From eeebf6f8a313b5456355f7a5e675943b5bb1a90e Mon Sep 17 00:00:00 2001
From: Khushboo Verma <khush.vv@gmail.com>
Date: Tue, 9 Sep 2025 15:57:37 +0530
Subject: [PATCH 1/2] Update flow for apex domains

---
 src/lib/components/domains/cnameTable.svelte  | 16 ++++++-
 src/lib/components/domains/recordTable.svelte | 48 ++++++++++++++-----
 .../domains/domain-[domain]/+page.svelte      |  2 +-
 .../add-domain/verify-[domain]/+page.svelte   | 12 +++--
 .../add-domain/verify-[domain]/+page.svelte   | 12 +++--
 .../add-domain/verify-[domain]/+page.svelte   |  9 ++--
 .../domains/retryDomainModal.svelte           |  3 +-
 7 files changed, 70 insertions(+), 32 deletions(-)

diff --git a/src/lib/components/domains/cnameTable.svelte b/src/lib/components/domains/cnameTable.svelte
index b198524da2..9648202761 100644
--- a/src/lib/components/domains/cnameTable.svelte
+++ b/src/lib/components/domains/cnameTable.svelte
@@ -30,8 +30,8 @@
             {/if}
         </Layout.Stack>
         <Typography.Text variant="m-400">
-            Add the following record on your DNS provider. Note that DNS changes may take time to
-            propagate fully.
+            Add the following record on your DNS provider. Note that DNS changes may take up to 48
+            hours to propagate fully.
         </Typography.Text>
     </Layout.Stack>
 
@@ -51,6 +51,18 @@
                     text={$regionalConsoleVariables._APP_DOMAIN_TARGET_CNAME} />
             </Table.Cell>
         </Table.Row.Base>
+        <Table.Row.Base {root}>
+            <Table.Cell {root}>
+                <Layout.Stack direction="row" alignItems="center" gap="xs">
+                    CAA
+                    <Badge variant="secondary" size="s" content="Optional" />
+                </Layout.Stack>
+            </Table.Cell>
+            <Table.Cell {root}>@</Table.Cell>
+            <Table.Cell {root}>
+                <InteractiveText variant="copy" isVisible text={`0 issue "certainly.com"`} />
+            </Table.Cell>
+        </Table.Row.Base>
     </Table.Root>
     <Layout.Stack gap="s" direction="row" alignItems="center">
         <Icon icon={IconInfo} size="s" color="--fgcolor-neutral-secondary" />
diff --git a/src/lib/components/domains/recordTable.svelte b/src/lib/components/domains/recordTable.svelte
index 14683b7218..5fb7775d0f 100644
--- a/src/lib/components/domains/recordTable.svelte
+++ b/src/lib/components/domains/recordTable.svelte
@@ -9,13 +9,26 @@
         Alert
     } from '@appwrite.io/pink-svelte';
     import { regionalConsoleVariables } from '$routes/(console)/project-[region]-[project]/store';
+    import { isASubdomain } from '$lib/helpers/tlds';
 
-    export let domain: string;
-    export let verified = undefined;
-    export let variant: 'cname' | 'a' | 'aaaa';
-    export let service: 'sites' | 'general' = 'general';
+    interface Props {
+        domain: string;
+        verified?: boolean;
+        variant: 'cname' | 'a' | 'aaaa';
+        service?: 'sites' | 'general';
+        onNavigateToNameservers?: () => void;
+    }
+
+    let {
+        domain,
+        verified = undefined,
+        variant,
+        service = 'general',
+        onNavigateToNameservers = undefined
+    }: Props = $props();
 
     let subdomain = domain?.split('.')?.slice(0, -2)?.join('.');
+    const isSubDomain = $derived.by(() => isASubdomain(domain));
 
     function setTarget() {
         switch (variant) {
@@ -44,8 +57,8 @@
             {/if}
         </Layout.Stack>
         <Typography.Text variant="m-400">
-            Add the following record on your DNS provider. Note that DNS changes may take time to
-            propagate fully.
+            Add the following record on your DNS provider. Note that DNS changes may take up to 48
+            hours to propagate fully.
         </Typography.Text>
     </Layout.Stack>
 
@@ -62,16 +75,25 @@
                 <InteractiveText variant="copy" isVisible text={setTarget()} />
             </Table.Cell>
         </Table.Row.Base>
+        <Table.Row.Base {root}>
+            <Table.Cell {root}>
+                <Layout.Stack direction="row" alignItems="center" gap="xs">
+                    CAA
+                    <Badge variant="secondary" size="s" content="Optional" />
+                </Layout.Stack>
+            </Table.Cell>
+            <Table.Cell {root}>@</Table.Cell>
+            <Table.Cell {root}>
+                <InteractiveText variant="copy" isVisible text={`0 issue "certainly.com"`} />
+            </Table.Cell>
+        </Table.Row.Base>
     </Table.Root>
     <Layout.Stack gap="s" direction="row" alignItems="center">
-        {#if variant === 'cname'}
+        {#if variant === 'cname' && !isSubDomain}
             <Alert.Inline>
-                If your domain uses CAA records, ensure certainly.com is authorized — otherwise, SSL
-                setup may fail. A list of all domain providers and their DNS setting is available <Link
-                    variant="muted"
-                    external
-                    href="https://appwrite.io/docs/advanced/platform/custom-domains">here</Link
-                >.
+                Since <Badge variant="secondary" size="s" content={domain} /> is an apex domain, CNAME
+                record is only supported by certain providers. If yours doesn't, please verify using
+                <Link variant="muted" on:click={onNavigateToNameservers}>nameservers</Link> instead.
             </Alert.Inline>
         {:else}
             <Typography.Text variant="m-400" color="--fgcolor-neutral-secondary">
diff --git a/src/routes/(console)/organization-[organization]/domains/domain-[domain]/+page.svelte b/src/routes/(console)/organization-[organization]/domains/domain-[domain]/+page.svelte
index d6ce25571b..b24836bad7 100644
--- a/src/routes/(console)/organization-[organization]/domains/domain-[domain]/+page.svelte
+++ b/src/routes/(console)/organization-[organization]/domains/domain-[domain]/+page.svelte
@@ -118,7 +118,7 @@
                             Navigate to your domain provider and update the nameservers to <InlineCode
                                 code="ns1.appwrite-dns.com"
                                 size="s" /> and <InlineCode code="ns2.appwrite-dns.com" size="s" />.
-                            Note that DNS changes may take time to propagate fully.
+                            Note that DNS changes may take up to 48 hours to propagate fully.
                         </span>
                         <svelte:fragment slot="actions">
                             <Button
diff --git a/src/routes/(console)/project-[region]-[project]/functions/function-[function]/domains/add-domain/verify-[domain]/+page.svelte b/src/routes/(console)/project-[region]-[project]/functions/function-[function]/domains/add-domain/verify-[domain]/+page.svelte
index 4db9c86d72..09f923d369 100644
--- a/src/routes/(console)/project-[region]-[project]/functions/function-[function]/domains/add-domain/verify-[domain]/+page.svelte
+++ b/src/routes/(console)/project-[region]-[project]/functions/function-[function]/domains/add-domain/verify-[domain]/+page.svelte
@@ -20,7 +20,6 @@
     import Wizard from '$lib/layout/wizard.svelte';
     import { base } from '$app/paths';
     import { writable } from 'svelte/store';
-    import { isASubdomain } from '$lib/helpers/tlds';
     import NameserverTable from '$lib/components/domains/nameserverTable.svelte';
     import RecordTable from '$lib/components/domains/recordTable.svelte';
     import { regionalConsoleVariables } from '$routes/(console)/project-[region]-[project]/store';
@@ -29,11 +28,10 @@
 
     const ruleId = page.url.searchParams.get('rule');
     const domainId = page.url.searchParams.get('domain');
-    const isSubDomain = $derived.by(() => isASubdomain(page.params.domain));
 
     let selectedTab = $state<'cname' | 'nameserver' | 'a' | 'aaaa'>('nameserver');
     $effect(() => {
-        if ($regionalConsoleVariables._APP_DOMAIN_TARGET_CNAME && isSubDomain) {
+        if ($regionalConsoleVariables._APP_DOMAIN_TARGET_CNAME) {
             selectedTab = 'cname';
         } else if (!isCloud && $regionalConsoleVariables._APP_DOMAIN_TARGET_A) {
             selectedTab = 'a';
@@ -124,7 +122,7 @@
                 <Layout.Stack gap="xl">
                     <div>
                         <Tabs.Root variant="secondary" let:root>
-                            {#if isSubDomain && !!$regionalConsoleVariables._APP_DOMAIN_TARGET_CNAME && $regionalConsoleVariables._APP_DOMAIN_TARGET_CNAME !== 'localhost'}
+                            {#if !!$regionalConsoleVariables._APP_DOMAIN_TARGET_CNAME && $regionalConsoleVariables._APP_DOMAIN_TARGET_CNAME !== 'localhost'}
                                 <Tabs.Item.Button
                                     {root}
                                     on:click={() => (selectedTab = 'cname')}
@@ -162,7 +160,11 @@
                     {#if selectedTab === 'nameserver'}
                         <NameserverTable domain={page.params.domain} {verified} />
                     {:else}
-                        <RecordTable domain={page.params.domain} {verified} variant={selectedTab} />
+                        <RecordTable
+                            domain={page.params.domain}
+                            {verified}
+                            variant={selectedTab}
+                            onNavigateToNameservers={() => (selectedTab = 'nameserver')} />
                     {/if}
                     <Divider />
                     <Layout.Stack direction="row" justifyContent="flex-end">
diff --git a/src/routes/(console)/project-[region]-[project]/settings/domains/add-domain/verify-[domain]/+page.svelte b/src/routes/(console)/project-[region]-[project]/settings/domains/add-domain/verify-[domain]/+page.svelte
index a6c23790f5..83ff1e1afb 100644
--- a/src/routes/(console)/project-[region]-[project]/settings/domains/add-domain/verify-[domain]/+page.svelte
+++ b/src/routes/(console)/project-[region]-[project]/settings/domains/add-domain/verify-[domain]/+page.svelte
@@ -20,7 +20,6 @@
     import Wizard from '$lib/layout/wizard.svelte';
     import { base } from '$app/paths';
     import { writable } from 'svelte/store';
-    import { isASubdomain } from '$lib/helpers/tlds';
     import NameserverTable from '$lib/components/domains/nameserverTable.svelte';
     import RecordTable from '$lib/components/domains/recordTable.svelte';
     import { regionalConsoleVariables } from '$routes/(console)/project-[region]-[project]/store';
@@ -29,12 +28,11 @@
 
     const ruleId = page.url.searchParams.get('rule');
     const domainId = page.url.searchParams.get('domain');
-    const isSubDomain = $derived.by(() => isASubdomain(page.params.domain));
 
     let selectedTab = $state<'cname' | 'nameserver' | 'a' | 'aaaa'>('nameserver');
 
     $effect(() => {
-        if ($regionalConsoleVariables._APP_DOMAIN_TARGET_CNAME && isSubDomain) {
+        if ($regionalConsoleVariables._APP_DOMAIN_TARGET_CNAME) {
             selectedTab = 'cname';
         } else if (!isCloud && $regionalConsoleVariables._APP_DOMAIN_TARGET_A) {
             selectedTab = 'a';
@@ -126,7 +124,7 @@
                 <Layout.Stack gap="xl">
                     <div>
                         <Tabs.Root variant="secondary" let:root>
-                            {#if isSubDomain && !!$regionalConsoleVariables._APP_DOMAIN_TARGET_CNAME && $regionalConsoleVariables._APP_DOMAIN_TARGET_CNAME !== 'localhost'}
+                            {#if !!$regionalConsoleVariables._APP_DOMAIN_TARGET_CNAME && $regionalConsoleVariables._APP_DOMAIN_TARGET_CNAME !== 'localhost'}
                                 <Tabs.Item.Button
                                     {root}
                                     on:click={() => (selectedTab = 'cname')}
@@ -164,7 +162,11 @@
                     {#if selectedTab === 'nameserver'}
                         <NameserverTable domain={page.params.domain} {verified} />
                     {:else}
-                        <RecordTable domain={page.params.domain} {verified} variant={selectedTab} />
+                        <RecordTable
+                            domain={page.params.domain}
+                            {verified}
+                            variant={selectedTab}
+                            onNavigateToNameservers={() => (selectedTab = 'nameserver')} />
                     {/if}
                     <Divider />
                     <Layout.Stack direction="row" justifyContent="flex-end">
diff --git a/src/routes/(console)/project-[region]-[project]/sites/site-[site]/domains/add-domain/verify-[domain]/+page.svelte b/src/routes/(console)/project-[region]-[project]/sites/site-[site]/domains/add-domain/verify-[domain]/+page.svelte
index 8422d783a0..d4f74032de 100644
--- a/src/routes/(console)/project-[region]-[project]/sites/site-[site]/domains/add-domain/verify-[domain]/+page.svelte
+++ b/src/routes/(console)/project-[region]-[project]/sites/site-[site]/domains/add-domain/verify-[domain]/+page.svelte
@@ -20,7 +20,6 @@
     import Wizard from '$lib/layout/wizard.svelte';
     import { base } from '$app/paths';
     import { writable } from 'svelte/store';
-    import { isASubdomain } from '$lib/helpers/tlds';
     import RecordTable from '$lib/components/domains/recordTable.svelte';
     import NameserverTable from '$lib/components/domains/nameserverTable.svelte';
     import { regionalConsoleVariables } from '$routes/(console)/project-[region]-[project]/store';
@@ -28,12 +27,11 @@
     let { data } = $props();
 
     const ruleId = page.url.searchParams.get('rule');
-    const isSubDomain = $derived.by(() => isASubdomain(page.params.domain));
 
     let selectedTab = $state<'cname' | 'nameserver' | 'a' | 'aaaa'>('nameserver');
 
     $effect(() => {
-        if ($regionalConsoleVariables._APP_DOMAIN_TARGET_CNAME && isSubDomain) {
+        if ($regionalConsoleVariables._APP_DOMAIN_TARGET_CNAME) {
             selectedTab = 'cname';
         } else if (!isCloud && $regionalConsoleVariables._APP_DOMAIN_TARGET_A) {
             selectedTab = 'a';
@@ -123,7 +121,7 @@
                 <Layout.Stack gap="xl">
                     <div>
                         <Tabs.Root variant="secondary" let:root>
-                            {#if isSubDomain && !!$regionalConsoleVariables._APP_DOMAIN_TARGET_CNAME && $regionalConsoleVariables._APP_DOMAIN_TARGET_CNAME !== 'localhost'}
+                            {#if !!$regionalConsoleVariables._APP_DOMAIN_TARGET_CNAME && $regionalConsoleVariables._APP_DOMAIN_TARGET_CNAME !== 'localhost'}
                                 <Tabs.Item.Button
                                     {root}
                                     on:click={() => (selectedTab = 'cname')}
@@ -165,7 +163,8 @@
                             {verified}
                             service="sites"
                             variant={selectedTab}
-                            domain={page.params.domain} />
+                            domain={page.params.domain}
+                            onNavigateToNameservers={() => (selectedTab = 'nameserver')} />
                     {/if}
                     <Divider />
                     <Layout.Stack direction="row" justifyContent="flex-end">
diff --git a/src/routes/(console)/project-[region]-[project]/sites/site-[site]/domains/retryDomainModal.svelte b/src/routes/(console)/project-[region]-[project]/sites/site-[site]/domains/retryDomainModal.svelte
index 949d8079c9..d6ff8548f7 100644
--- a/src/routes/(console)/project-[region]-[project]/sites/site-[site]/domains/retryDomainModal.svelte
+++ b/src/routes/(console)/project-[region]-[project]/sites/site-[site]/domains/retryDomainModal.svelte
@@ -117,7 +117,8 @@
             {verified}
             service="sites"
             variant={selectedTab}
-            domain={selectedProxyRule.domain} />
+            domain={selectedProxyRule.domain}
+            onNavigateToNameservers={() => (selectedTab = 'nameserver')} />
     {/if}
 
     <svelte:fragment slot="footer">

From 645308399b55b39caa999430ae5edb087e63586f Mon Sep 17 00:00:00 2001
From: Khushboo Verma <khush.vv@gmail.com>
Date: Thu, 11 Sep 2025 19:28:12 +0530
Subject: [PATCH 2/2] Change CAA badge to recommended

---
 src/lib/components/domains/cnameTable.svelte  | 2 +-
 src/lib/components/domains/recordTable.svelte | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/lib/components/domains/cnameTable.svelte b/src/lib/components/domains/cnameTable.svelte
index 9648202761..91be100549 100644
--- a/src/lib/components/domains/cnameTable.svelte
+++ b/src/lib/components/domains/cnameTable.svelte
@@ -55,7 +55,7 @@
             <Table.Cell {root}>
                 <Layout.Stack direction="row" alignItems="center" gap="xs">
                     CAA
-                    <Badge variant="secondary" size="s" content="Optional" />
+                    <Badge variant="secondary" size="s" content="Recommended" />
                 </Layout.Stack>
             </Table.Cell>
             <Table.Cell {root}>@</Table.Cell>
diff --git a/src/lib/components/domains/recordTable.svelte b/src/lib/components/domains/recordTable.svelte
index 5fb7775d0f..e0c284b18d 100644
--- a/src/lib/components/domains/recordTable.svelte
+++ b/src/lib/components/domains/recordTable.svelte
@@ -79,7 +79,7 @@
             <Table.Cell {root}>
                 <Layout.Stack direction="row" alignItems="center" gap="xs">
                     CAA
-                    <Badge variant="secondary" size="s" content="Optional" />
+                    <Badge variant="secondary" size="s" content="Recommended" />
                 </Layout.Stack>
             </Table.Cell>
             <Table.Cell {root}>@</Table.Cell>