mirror of
https://github.com/appwrite/console.git
synced 2026-06-06 19:27:48 +00:00
Merge pull request #1949 from appwrite/fix-domain-flows
Refactor domain verification status handling
This commit is contained in:
@@ -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">
|
||||
|
||||
@@ -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
|
||||
};
|
||||
|
||||
+22
-25
@@ -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);
|
||||
}
|
||||
}
|
||||
|
||||
+3
-1
@@ -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) {
|
||||
|
||||
+12
-3
@@ -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({
|
||||
|
||||
+1
-1
@@ -27,7 +27,7 @@
|
||||
});
|
||||
trackEvent(Submit.DomainUpdateVerification);
|
||||
} catch (e) {
|
||||
error = e;
|
||||
error = e.message;
|
||||
trackError(e, Submit.DomainUpdateVerification);
|
||||
}
|
||||
}
|
||||
|
||||
+1
-1
@@ -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) => {
|
||||
|
||||
+3
-1
@@ -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) {
|
||||
|
||||
+11
-2
@@ -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({
|
||||
|
||||
+1
-1
@@ -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) => {
|
||||
|
||||
+7
-1
@@ -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({
|
||||
|
||||
+1
-1
@@ -36,7 +36,7 @@
|
||||
});
|
||||
trackEvent(Submit.DomainCreate);
|
||||
} catch (e) {
|
||||
error = e;
|
||||
error = e.message;
|
||||
trackError(e, Submit.DomainCreate);
|
||||
}
|
||||
}
|
||||
|
||||
+1
-1
@@ -56,7 +56,7 @@
|
||||
});
|
||||
trackEvent(Submit.DomainUpdateVerification);
|
||||
} catch (e) {
|
||||
error = e;
|
||||
error = e.message;
|
||||
trackError(e, Submit.DomainUpdateVerification);
|
||||
}
|
||||
}
|
||||
|
||||
+1
-1
@@ -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) => {
|
||||
|
||||
Reference in New Issue
Block a user