Apex domains handling

package.json

@@ -83,7 +83,8 @@
         "typescript": "^5.8.2",
         "typescript-eslint": "^8.30.1",
         "vite": "^6.2.3",
-        "vitest": "^3.0.0"
+        "vitest": "^3.0.0",
+        "tldts": "^7.0.7"
     },
     "pnpm": {
         "onlyBuiltDependencies": [

src/lib/helpers/tlds.ts

@@ -0,0 +1,21 @@
+import { parse } from 'tldts';
+
+/**
+ * Returns the apex/root domain from a full domain string.
+ */
+export function getApexDomain(domain: string): string | null {
+    return parse(domain).domain;
+}
+
+/**
+ * Checks whether the given domain is a subdomain.
+ */
+export function isASubdomain(domain: string | null): boolean {
+    if (!domain) return false;
+
+    const { domain: apex, subdomain } = parse(domain);
+    if (!apex) return false;
+    if (subdomain === 'www') return false;
+
+    return !!subdomain;
+}

src/routes/(console)/project-[region]-[project]/functions/function-[function]/domains/add-domain/+page.svelte

@@ -20,6 +20,7 @@
     import { isValueOfStringEnum } from '$lib/helpers/types.js';
     import { isCloud } from '$lib/system';
     import { project } from '$routes/(console)/project-[region]-[project]/store';
+    import { getApexDomain } from '$lib/helpers/tlds';
 
     const routeBase = `${base}/project-${page.params.region}-${page.params.project}/functions/function-${page.params.function}/domains`;
 
@@ -47,14 +48,12 @@
     });
 
     async function addDomain() {
-        let domain = data.domains?.domains.find((d) => d.domain === domainName);
+        const apexDomain = getApexDomain(domainName);
+        let domain = data.domains?.domains.find((d) => d.domain === apexDomain);
 
-        if (!domain && isCloud) {
+        if (apexDomain && !domain && isCloud) {
             try {
-                domain = await sdk.forConsole.domains.create(
-                    $project.teamId,
-                    domainName.toLocaleLowerCase()
-                );
+                domain = await sdk.forConsole.domains.create($project.teamId, apexDomain);
             } catch (error) {
                 addNotification({
                     type: 'error',

src/routes/(console)/project-[region]-[project]/functions/function-[function]/domains/add-domain/verify-[domain]/+page.svelte

@@ -20,14 +20,15 @@
     import Wizard from '$lib/layout/wizard.svelte';
     import { base } from '$app/paths';
     import { writable } from 'svelte/store';
+    import { isASubdomain } from '$lib/helpers/tlds';
     import { consoleVariables } from '$routes/(console)/store';
     import NameserverTable from '$lib/components/domains/nameserverTable.svelte';
     import RecordTable from '$lib/components/domains/recordTable.svelte';
 
     let { data } = $props();
 
     const ruleId = page.url.searchParams.get('rule');
-    let isSubDomain = $derived(page.params.domain?.split('.')?.length >= 3);
+    const isSubDomain = $derived.by(() => isASubdomain(page.params.domain));
 
     let selectedTab = $state<'cname' | 'nameserver' | 'a' | 'aaaa'>('nameserver');
     $effect(() => {

src/routes/(console)/project-[region]-[project]/settings/domains/add-domain/+page.svelte

@@ -11,6 +11,7 @@
     import { onMount } from 'svelte';
     import { isCloud } from '$lib/system';
     import { project } from '$routes/(console)/project-[region]-[project]/store';
+    import { getApexDomain } from '$lib/helpers/tlds';
 
     const routeBase = `${base}/project-${page.params.region}-${page.params.project}/settings/domains`;
 
@@ -27,14 +28,12 @@
     });
 
     async function addDomain() {
-        let domain = data.domains?.domains.find((d) => d.domain === domainName);
+        const apexDomain = getApexDomain(domainName);
+        let domain = data.domains?.domains.find((d) => d.domain === apexDomain);
 
-        if (!domain && isCloud) {
+        if (apexDomain && !domain && isCloud) {
             try {
-                domain = await sdk.forConsole.domains.create(
-                    $project.teamId,
-                    domainName.toLocaleLowerCase()
-                );
+                domain = await sdk.forConsole.domains.create($project.teamId, apexDomain);
             } catch (error) {
                 addNotification({
                     type: 'error',
@@ -48,7 +47,7 @@
         try {
             const rule = await sdk
                 .forProject(page.params.region, page.params.project)
-                .proxy.createAPIRule(domainName);
+                .proxy.createAPIRule(domainName.toLocaleLowerCase());
             if (rule?.status === 'verified') {
                 await goto(routeBase);
                 await invalidate(Dependencies.DOMAINS);

src/routes/(console)/project-[region]-[project]/settings/domains/add-domain/verify-[domain]/+page.svelte

@@ -20,14 +20,15 @@
     import Wizard from '$lib/layout/wizard.svelte';
     import { base } from '$app/paths';
     import { writable } from 'svelte/store';
+    import { isASubdomain } from '$lib/helpers/tlds';
     import { consoleVariables } from '$routes/(console)/store';
     import NameserverTable from '$lib/components/domains/nameserverTable.svelte';
     import RecordTable from '$lib/components/domains/recordTable.svelte';
 
     let { data } = $props();
 
     const ruleId = page.url.searchParams.get('rule');
-    let isSubDomain = $derived(page.params.domain?.split('.')?.length >= 3);
+    const isSubDomain = $derived.by(() => isASubdomain(page.params.domain));
 
     let selectedTab = $state<'cname' | 'nameserver' | 'a' | 'aaaa'>('nameserver');
     $effect(() => {

src/routes/(console)/project-[region]-[project]/sites/site-[site]/domains/add-domain/+page.svelte

@@ -25,6 +25,7 @@
     import { ConnectRepoModal } from '$lib/components/git/index.js';
     import { project } from '$routes/(console)/project-[region]-[project]/store';
     import { isCloud } from '$lib/system';
+    import { getApexDomain } from '$lib/helpers/tlds';
 
     const routeBase = `${base}/project-${page.params.region}-${page.params.project}/sites/site-${page.params.site}/domains`;
 
@@ -52,14 +53,12 @@
     });
 
     async function addDomain() {
-        let domain = data.domains?.domains.find((d) => d.domain === domainName);
+        const apexDomain = getApexDomain(domainName);
+        let domain = data.domains?.domains.find((d) => d.domain === apexDomain);
 
-        if (!domain && isCloud) {
+        if (apexDomain && !domain && isCloud) {
             try {
-                domain = await sdk.forConsole.domains.create(
-                    $project.teamId,
-                    domainName.toLocaleLowerCase()
-                );
+                domain = await sdk.forConsole.domains.create($project.teamId, apexDomain);
             } catch (error) {
                 addNotification({
                     type: 'error',

src/routes/(console)/project-[region]-[project]/sites/site-[site]/domains/add-domain/verify-[domain]/+page.svelte

@@ -20,16 +20,18 @@
     import Wizard from '$lib/layout/wizard.svelte';
     import { base } from '$app/paths';
     import { writable } from 'svelte/store';
+    import { isASubdomain } from '$lib/helpers/tlds';
     import { consoleVariables } from '$routes/(console)/store';
     import NameserverTable from '$lib/components/domains/nameserverTable.svelte';
     import RecordTable from '$lib/components/domains/recordTable.svelte';
 
     let { data } = $props();
 
     const ruleId = page.url.searchParams.get('rule');
-    let isSubDomain = $derived(page.params.domain?.split('.')?.length >= 3);
+    const isSubDomain = $derived.by(() => isASubdomain(page.params.domain));
 
     let selectedTab = $state<'cname' | 'nameserver' | 'a' | 'aaaa'>('nameserver');
+
     $effect(() => {
         if ($consoleVariables._APP_DOMAIN_TARGET_CNAME && isSubDomain) {
             selectedTab = 'cname';

src/routes/(console)/project-[region]-[project]/sites/site-[site]/domains/retryDomainModal.svelte

@@ -11,6 +11,7 @@
     import { consoleVariables } from '$routes/(console)/store';
     import { isCloud } from '$lib/system';
     import { page } from '$app/state';
+    import { isASubdomain } from '$lib/helpers/tlds';
     import NameserverTable from '$lib/components/domains/nameserverTable.svelte';
     import RecordTable from '$lib/components/domains/recordTable.svelte';
 
@@ -22,9 +23,7 @@
         selectedDomain: Models.ProxyRule;
     } = $props();
 
-    let isSubDomain = $derived.by(() =>
-        selectedDomain?.domain?.length ? selectedDomain?.domain?.split('.')?.length >= 3 : false
-    );
+    const isSubDomain = $derived.by(() => isASubdomain(selectedDomain?.domain));
 
     let selectedTab = $state<'cname' | 'nameserver' | 'a' | 'aaaa'>('nameserver');
     $effect(() => {