Merge pull request #1949 from appwrite/fix-domain-flows

Refactor domain verification status handling
This commit is contained in:
Torsten Dittmann
2025-05-30 21:02:25 +02:00
committed by GitHub
21 changed files with 95 additions and 78 deletions
+4 -10
View File
@@ -12,7 +12,7 @@
import { regionalConsoleVariables } from '$routes/(console)/project-[region]-[project]/store';
export let domain: string;
export let verified = false;
export let verified = undefined;
let subdomain = domain.split('.').slice(0, -2).join('.');
</script>
@@ -23,16 +23,10 @@
<Typography.Text variant="l-500" color="--fgcolor-neutral-primary">
{domain}
</Typography.Text>
{#if verified}
<Badge variant="secondary" type="success" content="Verified" />
{#if verified === true}
<Badge variant="secondary" type="success" size="xs" content="Verified" />
{:else if verified === false}
<Badge variant="secondary" type="error" content="Verification failed" />
{:else}
<Badge
variant="secondary"
type="warning"
size="xs"
content="Pending verification" />
<Badge variant="secondary" type="error" size="xs" content="Verification failed" />
{/if}
</Layout.Stack>
<Typography.Text variant="m-400">
@@ -4,7 +4,7 @@
import { Badge, Layout, Typography, Table, InteractiveText } from '@appwrite.io/pink-svelte';
export let domain: string;
export let verified = false;
export let verified = undefined;
const nameserverList = $regionalConsoleVariables?._APP_DOMAINS_NAMESERVERS
? $regionalConsoleVariables?._APP_DOMAINS_NAMESERVERS?.split(',')
@@ -16,10 +16,10 @@
<Typography.Text variant="l-500" color="--fgcolor-neutral-primary">
{domain}
</Typography.Text>
{#if verified}
{#if verified === true}
<Badge variant="secondary" type="success" size="xs" content="Verified" />
{:else if verified === false}
<Badge variant="secondary" type="warning" size="xs" content="Pending verification" />
<Badge variant="secondary" type="warning" size="xs" content="Verification failed" />
{/if}
</Layout.Stack>
<Typography.Text variant="m-400">
@@ -11,7 +11,7 @@
import { regionalConsoleVariables } from '$routes/(console)/project-[region]-[project]/store';
export let domain: string;
export let verified = false;
export let verified = undefined;
export let variant: 'cname' | 'a' | 'aaaa';
export let service: 'sites' | 'general' = 'general';
@@ -37,16 +37,10 @@
<Typography.Text variant="l-500" color="--fgcolor-neutral-primary">
{domain}
</Typography.Text>
{#if verified}
{#if verified === true}
<Badge variant="secondary" type="success" size="xs" content="Verified" />
{:else if verified === false}
<Badge variant="secondary" type="error" size="xs" content="Verification failed" />
{:else}
<Badge
variant="secondary"
type="warning"
size="xs"
content="Pending verification" />
{/if}
</Layout.Stack>
<Typography.Text variant="m-400">
+3 -2
View File
@@ -13,8 +13,9 @@
</Typography.Caption>
<slot>
{#if value !== null && value !== undefined}
<Typography.Text size="s" truncate color="--fgcolor-neutral-primary"
>{value}</Typography.Text>
<Typography.Text size="s" truncate color="--fgcolor-neutral-primary">
{value}
</Typography.Text>
{:else}
<Skeleton variant="line" width="100%" height={19.5} />
{/if}
@@ -41,7 +41,7 @@
let selectedDomain: Models.Domain = null;
const isDomainVerified = (domain: Models.Domain) => {
return domain.nameservers.toLocaleLowerCase() === 'appwrite';
return domain.nameservers.toLowerCase() === 'appwrite';
};
</script>
@@ -4,6 +4,7 @@ import { pageToOffset } from '$lib/helpers/load';
import { getLimit } from '$lib/helpers/load';
import { getPage } from '$lib/helpers/load';
import { sdk } from '$lib/stores/sdk.js';
import { Query } from '@appwrite.io/console';
export const load = async ({ parent, depends, url, route }) => {
depends(Dependencies.DOMAIN);
@@ -15,7 +16,10 @@ export const load = async ({ parent, depends, url, route }) => {
return {
domain,
recordList: await sdk.forConsole.domains.listRecords(domain.$id),
recordList: await sdk.forConsole.domains.listRecords(domain.$id, [
Query.offset(offset),
Query.limit(limit)
]),
offset,
limit
};
@@ -8,7 +8,7 @@
let { domain, retryVerification }: { domain: Models.Domain; retryVerification: () => void } =
$props();
const isDomainVerified = domain.nameservers.toLocaleLowerCase() === 'appwrite';
const isDomainVerified = domain.nameservers.toLowerCase() === 'appwrite';
const metrics = [
{
@@ -29,7 +29,7 @@
},
{
value:
domain?.registrar?.toLocaleLowerCase() === 'appwrite'
domain?.registrar?.toLowerCase() === 'appwrite'
? domain?.autoRenewal
? 'On'
: 'Off'
@@ -43,29 +43,26 @@
];
</script>
<Layout.Grid gap="m" columnsL={2} columns={1}>
<Layout.Stack direction="row" gap="m">
{#each metrics.slice(0, 3) as metric}
{#if metric.description === 'Status'}
<UsageCard description={metric.description}>
<Layout.Stack direction="row" gap="xs" alignItems="center">
<Status
label={metric.value.toString()}
status={isDomainVerified ? 'complete' : 'pending'} />
<Layout.Grid gap="m" columnsL={6} columns={3} columnsS={2} columnsXXS={1}>
{#each metrics.slice(0, 3) as metric}
{#if metric.description === 'Status'}
<UsageCard description={metric.description}>
<Layout.Stack direction="row" gap="xs" alignItems="center">
<Status
--font-size-s="var(--font-size-xs)"
label={metric.value.toString()}
status={isDomainVerified ? 'complete' : 'pending'} />
{#if !isDomainVerified}
<Link on:click={retryVerification}>Retry</Link>
{/if}
</Layout.Stack>
</UsageCard>
{:else}
<UsageCard description={metric.description} bind:value={metric.value} />
{/if}
{/each}
</Layout.Stack>
<Layout.Stack direction="row" gap="m">
{#each metrics.slice(3) as metric}
{#if !isDomainVerified}
<Link size="s" on:click={retryVerification}>Retry</Link>
{/if}
</Layout.Stack>
</UsageCard>
{:else}
<UsageCard description={metric.description} bind:value={metric.value} />
{/each}
</Layout.Stack>
{/if}
{/each}
{#each metrics.slice(3) as metric}
<UsageCard description={metric.description} bind:value={metric.value} />
{/each}
</Layout.Grid>
@@ -35,7 +35,7 @@
async function verifyStatus() {
try {
domain = await sdk.forConsole.domains.updateNameservers(domain.$id);
verified = domain.nameservers === 'Appwrite';
verified = domain.nameservers.toLowerCase() === 'appwrite';
if (verified) {
addNotification({
type: 'success',
@@ -46,7 +46,8 @@
} else {
addNotification({
type: 'error',
message: 'Domain not verified'
message:
'Domain verification failed. Please check your domain settings or try again later'
});
}
} catch (error) {
@@ -68,8 +69,9 @@
</div>
<Layout.Stack gap="s">
<Layout.Stack gap="s" direction="row" alignItems="center">
<Typography.Text variant="l-500" color="--fgcolor-neutral-primary"
>{domain.domain}</Typography.Text>
<Typography.Text variant="l-500" color="--fgcolor-neutral-primary">
{domain.domain}
</Typography.Text>
{#if verified === false}
<Badge
@@ -77,12 +79,8 @@
type="error"
size="xs"
content="Verification failed" />
{:else}
<Badge
variant="secondary"
type="warning"
size="xs"
content="Pending verification" />
{:else if verified === true}
<Badge variant="secondary" type="success" size="xs" content="Verified" />
{/if}
</Layout.Stack>
<Typography.Text variant="m-400">
@@ -23,7 +23,7 @@
try {
const domain = await sdk.forConsole.domains.updateNameservers(selectedDomain.$id);
show = false;
if (domain.nameservers === 'Appwrite') {
if (domain.nameservers.toLowerCase() === 'appwrite') {
addNotification({
type: 'success',
message: `${selectedDomain.domain} has been verified`
@@ -31,13 +31,14 @@
} else {
addNotification({
type: 'error',
message: `Domain verification failed. Please check your domain settings or try again later`
message:
'Domain verification failed. Please check your domain settings or try again later'
});
}
await invalidate(Dependencies.DOMAINS);
trackEvent(Submit.DomainUpdateVerification);
} catch (e) {
error = e;
error = e.message;
trackError(e, Submit.DomainUpdateVerification);
}
}
@@ -82,7 +82,9 @@
await goto(routeBase);
await invalidate(Dependencies.FUNCTION_DOMAINS);
} else {
await goto(`${routeBase}/add-domain/verify-${domainName}?rule=${rule.$id}`);
await goto(
`${routeBase}/add-domain/verify-${domainName}?rule=${rule.$id}&domain=${domain.$id}`
);
await invalidate(Dependencies.FUNCTION_DOMAINS);
}
} catch (error) {
@@ -28,6 +28,7 @@
let { data } = $props();
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');
@@ -42,14 +43,15 @@
selectedTab = 'nameserver';
}
});
let verified = $state(false);
let verified: boolean | undefined = $state(undefined);
let routeBase = `${base}/project-${page.params.region}-${page.params.project}/functions/function-${page.params.function}/domains`;
let isSubmitting = $state(writable(false));
async function verify() {
const isNewDomain =
data.domainsList.domains.findIndex((rule) => rule.domain === page.params.domain) === -1;
data.domainsList.domains.find((rule) => rule.domain === page.params.domain) ===
undefined;
try {
if (selectedTab !== 'nameserver') {
const ruleData = await sdk
@@ -61,7 +63,14 @@
$organization.$id,
page.params.domain
);
verified = domainData.nameservers.toLocaleLowerCase() === 'appwrite';
verified = domainData.nameservers.toLowerCase() === 'appwrite';
} else if (!isNewDomain && isCloud) {
const domain = await sdk.forConsole.domains.updateNameservers(domainId);
verified = domain.nameservers.toLowerCase() === 'appwrite';
if (!verified)
throw new Error(
'Domain verification failed. Please check your domain settings or try again later'
);
}
addNotification({
@@ -27,7 +27,7 @@
});
trackEvent(Submit.DomainUpdateVerification);
} catch (e) {
error = e;
error = e.message;
trackError(e, Submit.DomainUpdateVerification);
}
}
@@ -94,7 +94,7 @@
<svelte:fragment slot="tooltip" let:toggle>
<ActionMenu.Root>
{#if proxyRule.status !== 'verified'}
{#if proxyRule.status !== 'verified' && proxyRule.status !== 'verifying'}
<ActionMenu.Item.Button
leadingIcon={IconRefresh}
on:click={(e) => {
@@ -52,7 +52,9 @@
await goto(routeBase);
await invalidate(Dependencies.DOMAINS);
} else {
await goto(`${routeBase}/add-domain/verify-${domainName}?rule=${rule.$id}`);
await goto(
`${routeBase}/add-domain/verify-${domainName}?rule=${rule.$id}&domain=${domain.$id}`
);
await invalidate(Dependencies.DOMAINS);
}
} catch (error) {
@@ -28,6 +28,7 @@
let { data } = $props();
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');
@@ -50,7 +51,8 @@
async function verify() {
const isNewDomain =
data.domainsList.domains.findIndex((rule) => rule.domain === page.params.domain) === -1;
data.domainsList.domains.find((rule) => rule.domain === page.params.domain) ===
undefined;
try {
if (selectedTab !== 'nameserver') {
const ruleData = await sdk
@@ -62,7 +64,14 @@
$organization.$id,
page.params.domain
);
verified = domainData.nameservers.toLocaleLowerCase() === 'appwrite';
verified = domainData.nameservers.toLowerCase() === 'appwrite';
} else if (!isNewDomain && isCloud) {
const domain = await sdk.forConsole.domains.updateNameservers(domainId);
verified = domain.nameservers.toLowerCase() === 'appwrite';
if (!verified)
throw new Error(
'Domain verification failed. Please check your domain settings or try again later'
);
}
addNotification({
@@ -32,7 +32,7 @@
});
trackEvent(Submit.DomainUpdateVerification);
} catch (e) {
error = e;
error = e.message;
trackError(e, Submit.DomainUpdateVerification);
}
}
@@ -84,7 +84,7 @@
<svelte:fragment slot="tooltip" let:toggle>
<ActionMenu.Root>
{#if domain.status !== 'verified'}
{#if domain.status !== 'verified' && domain.status !== 'verifiying'}
<ActionMenu.Item.Button
leadingIcon={IconRefresh}
on:click={(e) => {
@@ -58,12 +58,18 @@
.forProject(page.params.region, page.params.project)
.proxy.updateRuleVerification(ruleId);
verified = ruleData.status === 'verified';
throw new Error(
'Domain verification failed. Please check your domain settings or try again later'
);
} else if (isNewDomain && isCloud) {
const domainData = await sdk.forConsole.domains.create(
$organization.$id,
page.params.domain
);
verified = domainData.nameservers.toLocaleLowerCase() === 'appwrite';
verified = domainData.nameservers.toLowerCase() === 'appwrite';
throw new Error(
'Domain verification failed. Please check your domain settings or try again later'
);
}
addNotification({
@@ -36,7 +36,7 @@
});
trackEvent(Submit.DomainCreate);
} catch (e) {
error = e;
error = e.message;
trackError(e, Submit.DomainCreate);
}
}
@@ -56,7 +56,7 @@
});
trackEvent(Submit.DomainUpdateVerification);
} catch (e) {
error = e;
error = e.message;
trackError(e, Submit.DomainUpdateVerification);
}
}
@@ -95,7 +95,7 @@
<svelte:fragment slot="tooltip" let:toggle>
<ActionMenu.Root>
{#if rule.status !== 'verified'}
{#if rule.status !== 'verified' && rule.status !== 'verifying'}
<ActionMenu.Item.Button
leadingIcon={IconRefresh}
on:click={(e) => {