Merge pull request #2773 from appwrite/fix-domains-sync

Author: ItzNotABug

package.json

@@ -56,7 +56,7 @@
     "devDependencies": {
         "@eslint/compat": "^1.4.0",
         "@eslint/js": "^9.37.0",
-        "@imagine.dev/web-components": "https://pkg.vc/-/@appwrite/@imagine.dev/web-components@ad8767ea",
+        "@imagine.dev/web-components": "https://pkg.vc/-/@appwrite/@imagine.dev/web-components@4db67892",
         "@melt-ui/pp": "^0.3.2",
         "@melt-ui/svelte": "^0.86.6",
         "@playwright/test": "^1.56.0",

pnpm-lock.yaml

@@ -31,12 +31,14 @@
         siteId,
         region,
         projectId,
-        onAddNewDomain = null
+        onAddNewDomain,
+        onDomainsChanged
     }: {
         siteId: string;
         region: string;
         projectId: string;
         onAddNewDomain?: () => void;
+        onDomainsChanged?: () => void;
     } = $props();
 
     let loading = $state(true);
@@ -76,6 +78,7 @@
 
         if (wasDeleteOpen || wasRetryOpen) {
             loadDomains();
+            onDomainsChanged?.();
         }
 
         previousDeleteState = showDelete;
@@ -166,7 +169,7 @@
     <RetryDomainModal bind:show={showRetry} {selectedProxyRule} />
 {/if}
 
-{#snippet domainActions(rule: Models.ProxyRule, toggle: () => void)}
+{#snippet domainActions(rule, toggle)}
     <ActionMenu.Root>
         <ActionMenu.Item.Anchor href={`${$regionalProtocol}${rule.domain}`} external>
             Open domain

src/lib/studio/domains/manage/table.svelte

@@ -11,14 +11,16 @@
         siteId,
         region,
         projectId,
-        onAddNewDomain = null
+        onAddNewDomain,
+        onDomainsChanged
     }: {
         show: boolean;
         domain: string;
         siteId: string;
         region: string;
         projectId: string;
         onAddNewDomain?: () => void;
+        onDomainsChanged?: () => void;
     } = $props();
 </script>
 
@@ -42,6 +44,6 @@
             </Typography.Text>
         </Layout.Stack>
 
-        <DomainsTable {siteId} {region} {projectId} {onAddNewDomain} />
+        <DomainsTable {siteId} {region} {projectId} {onAddNewDomain} {onDomainsChanged} />
     </Layout.Stack>
 </SideSheet>

src/lib/studio/domains/manage/view.svelte

@@ -28,12 +28,14 @@
         rule,
         domain,
         onChangeDomain,
+        onVerified,
         show = $bindable(false)
     }: {
         show: boolean;
         rule: string;
         domain: Models.Domain;
         onChangeDomain: () => void;
+        onVerified?: () => void;
     } = $props();
 
     const isSubDomain = $derived.by(() => isASubdomain(domain?.domain));
@@ -50,15 +52,15 @@
                     .proxy.updateRuleVerification({ ruleId: rule });
 
                 verified = ruleData.status === 'verified';
-                throw new Error(
-                    'Domain verification failed. Please check your domain settings or try again later'
-                );
             } else if (isCloud) {
                 const domainData = await sdk.forConsole.domains.get({
                     domainId: domain.$id
                 });
 
                 verified = domainData.nameservers.toLowerCase() === 'appwrite';
+            }
+
+            if (!verified) {
                 throw new Error(
                     'Domain verification failed. Please check your domain settings or try again later'
                 );
@@ -70,6 +72,7 @@
             });
 
             show = false;
+            onVerified?.();
             await invalidate(Dependencies.DOMAINS);
             await invalidate(Dependencies.SITES_DOMAINS);
         } catch (error) {

src/lib/studio/domains/verify/view.svelte

@@ -280,6 +280,12 @@ export function hideStudio() {
     component.style.width = '';
     restoreBodyScroll();
 }
+
+export async function invalidateSiteInfo(): Promise<void> {
+    const webComponents = await getWebComponents();
+    webComponents.invalidateSiteInfo?.();
+}
+
 export type ErrorParams = {
     traceId?: string;
     message: string;

src/lib/studio/studio-widget.ts

@@ -8,7 +8,12 @@
     import { app } from '$lib/stores/app';
     import { Dependencies } from '$lib/constants';
     import { goto, invalidate } from '$app/navigation';
-    import { ensureStudioComponent, initImagine, getWebComponents } from './studio-widget';
+    import {
+        ensureStudioComponent,
+        initImagine,
+        getWebComponents,
+        invalidateSiteInfo
+    } from './studio-widget';
     import AddDomains from './domains/add/view.svelte';
     import VerifyDomain from './domains/verify/view.svelte';
     import ManageDomains from './domains/manage/view.svelte';
@@ -88,6 +93,7 @@
     {siteId}
     bind:show={showAddDomainsWizard}
     onDomainAdded={(rule, domain, verified) => {
+        invalidateSiteInfo();
         if (!verified) {
             ruleIdForVerification = rule;
             domainForVerification = domain;
@@ -98,6 +104,7 @@
 <VerifyDomain
     rule={ruleIdForVerification}
     domain={domainForVerification}
+    onVerified={invalidateSiteInfo}
     bind:show={showVerifyDomainsWizard}
     onChangeDomain={() => {
         ruleIdForVerification = null;
@@ -111,6 +118,7 @@
     {projectId}
     domain={primaryDomainForSite}
     bind:show={showManageDomainsSheet}
+    onDomainsChanged={invalidateSiteInfo}
     onAddNewDomain={() => {
         showAddDomainsWizard = true;
         showManageDomainsSheet = false;