Support optional subdomain for reverse proxy domains

src/interfaces/ReverseProxy.ts

@@ -86,6 +86,7 @@ export interface ReverseProxyDomain {
   type: ReverseProxyDomainType;
   target_cluster?: string;
   supports_custom_ports?: boolean;
+  require_subdomain?: boolean;
 }
 
 export enum ReverseProxyDomainType {

src/modules/reverse-proxy/ReverseProxyModal.tsx

@@ -248,8 +248,12 @@ export default function ReverseProxyModal({
   );
 
   const canContinueToSettings = useMemo(() => {
+    const subdomainRequired =
+      selectedDomain?.require_subdomain === true;
     const isSubdomainValid =
-      subdomain.length > 0 && baseDomain.length > 0 && !domainAlreadyExists;
+      baseDomain.length > 0 &&
+      !domainAlreadyExists &&
+      (subdomain.length > 0 || !subdomainRequired);
     const isValidPort = (port: number) => port >= 1 && port <= 65535;
     const hasHttpEndpoint = !isL4Mode && targets.length > 0;
     const hasL4Endpoint =
@@ -264,6 +268,7 @@ export default function ReverseProxyModal({
     subdomain,
     baseDomain,
     domainAlreadyExists,
+    selectedDomain,
     serviceMode,
     targets.length,
     isL4Mode,
@@ -444,6 +449,7 @@ export default function ReverseProxyModal({
                 baseDomain={baseDomain}
                 onBaseDomainChange={setBaseDomain}
                 domainAlreadyExists={domainAlreadyExists}
+                subdomainRequired={selectedDomain?.require_subdomain === true}
                 clusterOffline={
                   reverseProxy?.proxy_cluster && !isClusterConnected
                     ? { clusterName: reverseProxy.proxy_cluster }

src/modules/reverse-proxy/domain/ReverseProxyDomainInput.tsx

@@ -13,6 +13,7 @@ type Props = {
   baseDomain: string;
   onBaseDomainChange: (value: string) => void;
   domainAlreadyExists: boolean;
+  subdomainRequired?: boolean;
   clusterOffline?: {
     clusterName: string;
   };
@@ -24,13 +25,16 @@ export default function ReverseProxyDomainInput({
   baseDomain,
   onBaseDomainChange,
   domainAlreadyExists,
+  subdomainRequired = false,
   clusterOffline,
 }: Readonly<Props>) {
   return (
     <div>
       <Label>Domain</Label>
       <HelpText>
-        Enter a subdomain and select a domain for your service.
+        {subdomainRequired
+          ? "Enter a subdomain and select a domain for your service."
+          : "Optionally enter a subdomain, or use the domain directly."}
       </HelpText>
       <div className="flex items-start mt-2">
         <div className="flex-1 min-w-0">
@@ -47,7 +51,7 @@ export default function ReverseProxyDomainInput({
                 ? "This domain is already used by another service."
                 : undefined
             }
-            placeholder={"myapp"}
+            placeholder={subdomainRequired ? "myapp" : "myapp (optional)"}
             className="!rounded-r-none !border-r-0"
           />
         </div>

src/modules/reverse-proxy/domain/useReverseProxyDomain.ts

@@ -23,6 +23,13 @@ function parseDomain(
       .filter((d) => d.domain)
       .sort((a, b) => b.domain.length - a.domain.length);
     for (const d of sorted) {
+      if (fullDomain === d.domain) {
+        return {
+          subdomain: "",
+          baseDomain: d.domain,
+          isCustom: d.type === ReverseProxyDomainType.CUSTOM,
+        };
+      }
       if (fullDomain.endsWith(`.${d.domain}`)) {
         return {
           subdomain: fullDomain.slice(0, -(d.domain.length + 1)),
@@ -103,7 +110,11 @@ export function useReverseProxyDomain({
     return customDomain?.domain || freeDomain?.domain || "";
   });
 
-  const fullDomain = baseDomain ? `${subdomain}.${baseDomain}` : subdomain;
+  const fullDomain = baseDomain
+    ? subdomain
+      ? `${subdomain}.${baseDomain}`
+      : baseDomain
+    : subdomain;
 
   const domainAlreadyExists = useMemo(() => {
     if (!reverseProxies || !fullDomain) return false;