fix: small domains fixes

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

@@ -14,13 +14,13 @@
 
     const backPage = `${base}/project-${$page.params.organization}/domains`;
 
-    let domain = '';
-    let domainData: Domain;
+    let domainName = '';
+    let domain: Domain;
 
     async function addDomain() {
         try {
-            domainData = await sdk.forConsole.domains.create($page.params.organization, domain);
-            console.log(domainData);
+            domain = await sdk.forConsole.domains.create($page.params.organization, domainName);
+            console.log(domain);
             invalidate(Dependencies.DOMAINS);
         } catch (error) {
             addNotification({
@@ -29,41 +29,11 @@
             });
         }
     }
-
-    async function verifyStatus() {
-        try {
-            domainData = await sdk.forConsole.domains.updateNameservers(domainData.$id);
-            console.log(domainData);
-        } catch (error) {
-            addNotification({
-                type: 'error',
-                message: error.message
-            });
-        }
-    }
-
-    async function back() {
-        try {
-            await sdk.forConsole.domains.delete(domainData.$id);
-            domainData = undefined;
-        } catch (error) {
-            addNotification({
-                type: 'error',
-                message: error.message
-            });
-        }
-    }
 </script>
 
-<Wizard title="Add domain" href={backPage} column columnSize="s" hideFooter={!domainData}>
-    {#if domainData}
-        <RecordsCard domain={domainData}>
-            <Divider />
-            <Layout.Stack direction="row" justifyContent="flex-end">
-                <Button text on:click={back}>Back</Button>
-                <Button secondary on:click={verifyStatus}>Verify</Button>
-            </Layout.Stack>
-        </RecordsCard>
+<Wizard title="Add domain" href={backPage} column columnSize="s" hideFooter={!domain}>
+    {#if domain}
+        <RecordsCard {domain} />
     {:else}
         <Fieldset legend="Configuration">
             <Form onSubmit={addDomain}>
@@ -72,7 +42,7 @@
                         label="Domain"
                         id="domain"
                         name="domain"
-                        bind:value={domain}
+                        bind:value={domainName}
                         required
                         placeholder="example.com" />
 
@@ -87,7 +57,7 @@
 
     <svelte:fragment slot="footer">
         <Button text href={backPage}>Cancel</Button>
-        {#if domainData}
+        {#if domain}
             <Button secondary href={backPage}>Skip to console</Button>
         {/if}
     </svelte:fragment>

src/routes/(console)/organization-[organization]/domains/recordsCard.svelte

@@ -1,14 +1,25 @@
 <script lang="ts">
     import { Copy } from '$lib/components';
     import { Link } from '$lib/elements';
+    import { Button } from '$lib/elements/forms';
     import type { Domain } from '$lib/sdk/domains';
+    import { addNotification } from '$lib/stores/notifications';
+    import { sdk } from '$lib/stores/sdk';
     import { consoleVariables } from '$routes/(console)/store';
     import { IconDuplicate, IconInfo } from '@appwrite.io/pink-icons-svelte';
-    import { Badge, Layout, Typography, Table, Fieldset, Icon } from '@appwrite.io/pink-svelte';
+    import {
+        Badge,
+        Layout,
+        Typography,
+        Table,
+        Fieldset,
+        Icon,
+        Divider
+    } from '@appwrite.io/pink-svelte';
 
     export let domain: Domain;
 
-    $: console.log($consoleVariables._APP_DOMAINS_NAMESERVERS);
+    let verified = undefined;
 
     // TODO: split _APP_DOMAINS_NAMESERVERS?
     let nameservers = $consoleVariables?._APP_DOMAINS_NAMESERVERS ?? [
@@ -16,7 +27,32 @@
         'ns2.appwrite.io'
     ];
 
-    $: verified = domain.nameservers === nameservers;
+    async function verifyStatus() {
+        try {
+            domain = await sdk.forConsole.domains.updateNameservers(domain.$id);
+            verified = domain.nameservers === nameservers;
+            console.log(domain);
+        } catch (error) {
+            addNotification({
+                type: 'error',
+                message: error.message
+            });
+        }
+    }
+
+    async function back() {
+        try {
+            await sdk.forConsole.domains.delete(domain.$id);
+            domain = undefined;
+        } catch (error) {
+            addNotification({
+                type: 'error',
+                message: error.message
+            });
+        }
+    }
+
+    $: console.log($consoleVariables._APP_DOMAINS_NAMESERVERS);
 </script>
 
 <Fieldset legend="Verification">
@@ -26,6 +62,9 @@
                 <Layout.Stack gap="s" direction="row" alignItems="center">
                     <Typography.Text variant="l-500">{domain.domain}</Typography.Text>
 
+                    {#if verified === false}
+                        <Badge variant="secondary" type="error" content="Verification failed" />
+                    {/if}
                     <Badge variant="secondary" type="warning" content="Pending verification" />
                 </Layout.Stack>
                 <Typography.Text variant="m-400">
@@ -64,6 +103,10 @@
                 </Typography.Text>
             </Layout.Stack>
         </Layout.Stack>
-        <slot />
+        <Divider />
+        <Layout.Stack direction="row" justifyContent="flex-end">
+            <Button text on:click={back}>Back</Button>
+            <Button secondary on:click={verifyStatus}>Verify</Button>
+        </Layout.Stack>
     </Layout.Stack>
 </Fieldset>