mirror of
https://github.com/appwrite/console.git
synced 2026-06-06 19:27:48 +00:00
Update flow for apex domains
This commit is contained in:
@@ -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" />
|
||||
|
||||
@@ -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">
|
||||
|
||||
+1
-1
@@ -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
|
||||
|
||||
+7
-5
@@ -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">
|
||||
|
||||
+7
-5
@@ -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">
|
||||
|
||||
+4
-5
@@ -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">
|
||||
|
||||
+2
-1
@@ -117,7 +117,8 @@
|
||||
{verified}
|
||||
service="sites"
|
||||
variant={selectedTab}
|
||||
domain={selectedProxyRule.domain} />
|
||||
domain={selectedProxyRule.domain}
|
||||
onNavigateToNameservers={() => (selectedTab = 'nameserver')} />
|
||||
{/if}
|
||||
|
||||
<svelte:fragment slot="footer">
|
||||
|
||||
Reference in New Issue
Block a user