From 995ef38eabb070025c3dccf4837e1e1cc35ad91d Mon Sep 17 00:00:00 2001 From: Khushboo Verma Date: Tue, 16 Sep 2025 12:56:47 +0530 Subject: [PATCH] Add badges and links to functions/projects tables --- src/lib/components/domains/index.ts | 5 + .../components}/domains/viewLogsModal.svelte | 0 src/lib/components/index.ts | 1 + .../domains/add-domain/+page.svelte | 10 +- .../function-[function]/domains/store.ts | 9 +- .../function-[function]/domains/table.svelte | 112 ++++++++++++++-- .../settings/domains/add-domain/+page.svelte | 2 +- .../settings/domains/table.svelte | 122 ++++++++++++++++-- .../sites/site-[site]/domains/store.ts | 4 +- .../sites/site-[site]/domains/table.svelte | 32 ++--- 10 files changed, 255 insertions(+), 42 deletions(-) create mode 100644 src/lib/components/domains/index.ts rename src/{routes/(console)/project-[region]-[project]/sites/site-[site] => lib/components}/domains/viewLogsModal.svelte (100%) diff --git a/src/lib/components/domains/index.ts b/src/lib/components/domains/index.ts new file mode 100644 index 000000000..857109816 --- /dev/null +++ b/src/lib/components/domains/index.ts @@ -0,0 +1,5 @@ +export { default as ViewLogsModal } from './viewLogsModal.svelte'; +export { default as CnameTable } from './cnameTable.svelte'; +export { default as DnsRecordsAction } from './dnsRecordsAction.svelte'; +export { default as NameserverTable } from './nameserverTable.svelte'; +export { default as RecordTable } from './recordTable.svelte'; diff --git a/src/routes/(console)/project-[region]-[project]/sites/site-[site]/domains/viewLogsModal.svelte b/src/lib/components/domains/viewLogsModal.svelte similarity index 100% rename from src/routes/(console)/project-[region]-[project]/sites/site-[site]/domains/viewLogsModal.svelte rename to src/lib/components/domains/viewLogsModal.svelte diff --git a/src/lib/components/index.ts b/src/lib/components/index.ts index 47afdf41a..5b4ae563d 100644 --- a/src/lib/components/index.ts +++ b/src/lib/components/index.ts @@ -87,3 +87,4 @@ export { default as ExpirationInput } from './expirationInput.svelte'; export { default as EstimatedCard } from './estimatedCard.svelte'; export { default as EmailVerificationBanner } from './alerts/emailVerificationBanner.svelte'; export { default as SortButton, type SortDirection } from './sortButton.svelte'; +export * from './domains'; diff --git a/src/routes/(console)/project-[region]-[project]/functions/function-[function]/domains/add-domain/+page.svelte b/src/routes/(console)/project-[region]-[project]/functions/function-[function]/domains/add-domain/+page.svelte index f913e4c91..edb5bc8fa 100644 --- a/src/routes/(console)/project-[region]-[project]/functions/function-[function]/domains/add-domain/+page.svelte +++ b/src/routes/(console)/project-[region]-[project]/functions/function-[function]/domains/add-domain/+page.svelte @@ -101,9 +101,13 @@ await goto(routeBase); await invalidate(Dependencies.FUNCTION_DOMAINS); } else { - await goto( - `${routeBase}/add-domain/verify-${domainName}?rule=${rule.$id}&domain=${domain.$id}` - ); + let redirect = `${routeBase}/add-domain/verify-${domainName}?rule=${rule.$id}`; + + if (isCloud && domain?.$id) { + redirect += `&domain=${domain.$id}`; + } + + await goto(redirect); await invalidate(Dependencies.FUNCTION_DOMAINS); } } catch (error) { diff --git a/src/routes/(console)/project-[region]-[project]/functions/function-[function]/domains/store.ts b/src/routes/(console)/project-[region]-[project]/functions/function-[function]/domains/store.ts index 902fb3e3e..5f36c6bc1 100644 --- a/src/routes/(console)/project-[region]-[project]/functions/function-[function]/domains/store.ts +++ b/src/routes/(console)/project-[region]-[project]/functions/function-[function]/domains/store.ts @@ -7,7 +7,7 @@ export const columns = writable([ title: 'Domain', type: 'string', format: 'string', - width: { min: 200 } + width: { min: 300 } }, { @@ -15,5 +15,12 @@ export const columns = writable([ title: 'Target', type: 'string', width: { min: 120, max: 400 } + }, + + { + id: 'updated', + title: '', + type: 'string', + width: { min: 160, max: 180 } } ]); diff --git a/src/routes/(console)/project-[region]-[project]/functions/function-[function]/domains/table.svelte b/src/routes/(console)/project-[region]-[project]/functions/function-[function]/domains/table.svelte index 80f8663d4..f3a1f1d8a 100644 --- a/src/routes/(console)/project-[region]-[project]/functions/function-[function]/domains/table.svelte +++ b/src/routes/(console)/project-[region]-[project]/functions/function-[function]/domains/table.svelte @@ -3,10 +3,16 @@ import { Link } from '$lib/elements'; import { Button } from '$lib/elements/forms'; import type { Models } from '@appwrite.io/console'; - import { IconDotsHorizontal, IconRefresh, IconTrash } from '@appwrite.io/pink-icons-svelte'; + import { + IconDotsHorizontal, + IconRefresh, + IconTerminal, + IconTrash + } from '@appwrite.io/pink-icons-svelte'; import { ActionMenu, Badge, + Divider, Icon, Layout, Popover, @@ -15,9 +21,11 @@ } from '@appwrite.io/pink-svelte'; import DeleteDomainModal from './deleteDomainModal.svelte'; import RetryDomainModal from './retryDomainModal.svelte'; + import { ViewLogsModal } from '$lib/components'; import { columns } from './store'; import { regionalProtocol } from '$routes/(console)/project-[region]-[project]/store'; import DnsRecordsAction from '$lib/components/domains/dnsRecordsAction.svelte'; + import { timeFromNowShort } from '$lib/helpers/date'; let { proxyRules, @@ -29,6 +37,7 @@ let showDelete = $state(false); let showRetry = $state(false); + let showLogs = $state(false); let selectedProxyRule: Models.ProxyRule = $state(null); const proxyTarget = (proxy: Models.ProxyRule) => { @@ -63,18 +72,77 @@ {proxyRule.domain} - {#if proxyRule.status === 'verifying'} - - {:else if proxyRule.status !== 'verified'} - + {#if proxyRule.status === 'created'} + + + { + e.preventDefault(); + selectedProxyRule = proxyRule; + showRetry = true; + }}> + Retry + + + {:else if proxyRule.status === 'verifying'} + + + { + e.preventDefault(); + selectedProxyRule = proxyRule; + showLogs = true; + }}> + View logs + + + {:else if proxyRule.status === 'unverified'} + + + { + e.preventDefault(); + selectedProxyRule = proxyRule; + showLogs = true; + }}> + View logs + + {/if} {:else if column.id === 'target'} {proxyTarget(proxyRule)} + {:else if column.id === 'updated'} + + {#if proxyRule.status !== 'verified'} + + {#if proxyRule.status === 'created'} + Checked {timeFromNowShort(proxyRule.$updatedAt)} + {:else if proxyRule.status === 'verifying'} + Updated {timeFromNowShort(proxyRule.$updatedAt)} + {:else if proxyRule.status === 'unverified'} + Failed {timeFromNowShort(proxyRule.$updatedAt)} + {/if} + + {/if} + {/if} {/each} @@ -93,6 +161,17 @@ + {#if proxyRule.logs && (proxyRule.status === 'unverified' || proxyRule.status === 'verifying')} + { + selectedProxyRule = proxyRule; + showLogs = true; + toggle(e); + }}> + View logs + + {/if} {#if proxyRule.status !== 'verified' && proxyRule.status !== 'verifying'} {/if} + {#if proxyRule.logs && (proxyRule.status === 'unverified' || proxyRule.status === 'verifying')} +
+ +
+ {/if} {/if} + +{#if showLogs} + +{/if} + + diff --git a/src/routes/(console)/project-[region]-[project]/settings/domains/add-domain/+page.svelte b/src/routes/(console)/project-[region]-[project]/settings/domains/add-domain/+page.svelte index 90d5a2159..476e71602 100644 --- a/src/routes/(console)/project-[region]-[project]/settings/domains/add-domain/+page.svelte +++ b/src/routes/(console)/project-[region]-[project]/settings/domains/add-domain/+page.svelte @@ -61,7 +61,7 @@ } else { let redirect = `${routeBase}/add-domain/verify-${domainName}?rule=${rule.$id}`; - if (isCloud) { + if (isCloud && domain?.$id) { /** * Domains are only on cloud! * Self-hosted instances have rules. diff --git a/src/routes/(console)/project-[region]-[project]/settings/domains/table.svelte b/src/routes/(console)/project-[region]-[project]/settings/domains/table.svelte index 1558e8e3f..045a26937 100644 --- a/src/routes/(console)/project-[region]-[project]/settings/domains/table.svelte +++ b/src/routes/(console)/project-[region]-[project]/settings/domains/table.svelte @@ -3,10 +3,16 @@ import { Link } from '$lib/elements'; import { Button } from '$lib/elements/forms'; import type { Models } from '@appwrite.io/console'; - import { IconDotsHorizontal, IconRefresh, IconTrash } from '@appwrite.io/pink-icons-svelte'; + import { + IconDotsHorizontal, + IconRefresh, + IconTerminal, + IconTrash + } from '@appwrite.io/pink-icons-svelte'; import { ActionMenu, Badge, + Divider, Icon, Layout, Popover, @@ -15,8 +21,10 @@ } from '@appwrite.io/pink-svelte'; import DeleteDomainModal from './deleteDomainModal.svelte'; import RetryDomainModal from './retryDomainModal.svelte'; + import { ViewLogsModal } from '$lib/components'; import { regionalProtocol } from '../../store'; import DnsRecordsAction from '$lib/components/domains/dnsRecordsAction.svelte'; + import { timeFromNowShort } from '$lib/helpers/date'; let { domains, @@ -28,6 +36,7 @@ let showDelete = $state(false); let showRetry = $state(false); + let showLogs = $state(false); let selectedDomain: Models.ProxyRule = $state(null); const columns = [ @@ -36,7 +45,13 @@ title: 'Domain', type: 'string', format: 'string', - width: { min: 200, max: 550 } + width: { min: 300, max: 550 } + }, + { + id: 'updated', + title: '', + type: 'string', + width: { min: 160, max: 180 } } ]; @@ -64,14 +79,73 @@ {domain.domain} - {#if domain.status === 'verifying'} - - {:else if domain.status !== 'verified'} - + {#if domain.status === 'created'} + + + { + e.preventDefault(); + selectedDomain = domain; + showRetry = true; + }}> + Retry + + + {:else if domain.status === 'verifying'} + + + { + e.preventDefault(); + selectedDomain = domain; + showLogs = true; + }}> + View logs + + + {:else if domain.status === 'unverified'} + + + { + e.preventDefault(); + selectedDomain = domain; + showLogs = true; + }}> + View logs + + + {/if} + + {:else if column.id === 'updated'} + + {#if domain.status !== 'verified'} + + {#if domain.status === 'created'} + Checked {timeFromNowShort(domain.$updatedAt)} + {:else if domain.status === 'verifying'} + Updated {timeFromNowShort(domain.$updatedAt)} + {:else if domain.status === 'unverified'} + Failed {timeFromNowShort(domain.$updatedAt)} + {/if} + {/if} {/if} @@ -92,7 +166,18 @@ - {#if domain.status !== 'verified' && domain.status !== 'verifiying'} + {#if domain.logs && (domain.status === 'unverified' || domain.status === 'verifying')} + { + selectedDomain = domain; + showLogs = true; + toggle(e); + }}> + View logs + + {/if} + {#if domain.status !== 'verified' && domain.status !== 'verifying'} { @@ -104,6 +189,11 @@ {/if} + {#if domain.logs && (domain.status === 'unverified' || domain.status === 'verifying')} +
+ +
+ {/if} {/if} + +{#if showLogs} + +{/if} + + diff --git a/src/routes/(console)/project-[region]-[project]/sites/site-[site]/domains/store.ts b/src/routes/(console)/project-[region]-[project]/sites/site-[site]/domains/store.ts index 647887b62..5f36c6bc1 100644 --- a/src/routes/(console)/project-[region]-[project]/sites/site-[site]/domains/store.ts +++ b/src/routes/(console)/project-[region]-[project]/sites/site-[site]/domains/store.ts @@ -7,7 +7,7 @@ export const columns = writable([ title: 'Domain', type: 'string', format: 'string', - width: { min: 200 } + width: { min: 300 } }, { @@ -21,6 +21,6 @@ export const columns = writable([ id: 'updated', title: '', type: 'string', - width: { min: 100, max: 140 } + width: { min: 160, max: 180 } } ]); diff --git a/src/routes/(console)/project-[region]-[project]/sites/site-[site]/domains/table.svelte b/src/routes/(console)/project-[region]-[project]/sites/site-[site]/domains/table.svelte index 6a259cc2d..e604cfed4 100644 --- a/src/routes/(console)/project-[region]-[project]/sites/site-[site]/domains/table.svelte +++ b/src/routes/(console)/project-[region]-[project]/sites/site-[site]/domains/table.svelte @@ -21,7 +21,7 @@ } from '@appwrite.io/pink-svelte'; import DeleteDomainModal from './deleteDomainModal.svelte'; import RetryDomainModal from './retryDomainModal.svelte'; - import ViewLogsModal from './viewLogsModal.svelte'; + import { ViewLogsModal } from '$lib/components'; import { columns } from './store'; import { regionalProtocol } from '$routes/(console)/project-[region]-[project]/store'; import DnsRecordsAction from '$lib/components/domains/dnsRecordsAction.svelte'; @@ -128,20 +128,22 @@ {:else if column.id === 'target'} {proxyTarget(rule)} {:else if column.id === 'updated'} - {#if rule.status !== 'verified'} - - {#if rule.status === 'created'} - Checked {timeFromNowShort(rule.$updatedAt)} - {:else if rule.status === 'verifying'} - Updated {timeFromNowShort(rule.$updatedAt)} - {:else if rule.status === 'unverified'} - Failed {timeFromNowShort(rule.$updatedAt)} - {/if} - - {/if} + + {#if rule.status !== 'verified'} + + {#if rule.status === 'created'} + Checked {timeFromNowShort(rule.$updatedAt)} + {:else if rule.status === 'verifying'} + Updated {timeFromNowShort(rule.$updatedAt)} + {:else if rule.status === 'unverified'} + Failed {timeFromNowShort(rule.$updatedAt)} + {/if} + + {/if} + {/if} {/each}