Add retry button in ViewLogs modal (#2805)

* Add retry button in ViewLogs modal

* lint

* remove fallback

Author: hmacr

src/lib/components/domains/viewLogsModal.svelte

@@ -2,17 +2,80 @@
     import { Modal } from '$lib/components';
     import { Logs } from '@appwrite.io/pink-svelte';
     import { app } from '$lib/stores/app';
-    import type { Models } from '@appwrite.io/console';
+    import { ProxyRuleStatus, type Models } from '@appwrite.io/console';
+    import { Button } from '$lib/elements/forms';
+    import { getApexDomain } from '$lib/helpers/tlds';
+    import { isCloud } from '$lib/system';
+    import { sdk } from '$lib/stores/sdk';
+    import { page } from '$app/state';
+    import { Dependencies } from '$lib/constants';
+    import { invalidate } from '$app/navigation';
+    import { addNotification } from '$lib/stores/notifications';
+    import { Submit, trackError, trackEvent } from '$lib/actions/analytics';
 
     let {
         show = $bindable(false),
-        selectedProxyRule
+        selectedProxyRule,
+        domainsList
     }: {
         show: boolean;
         selectedProxyRule: Models.ProxyRule;
+        domainsList?: Models.DomainsList;
     } = $props();
+
+    let error = $state(null);
+
+    async function retryDomain() {
+        error = null;
+
+        try {
+            const apexDomain = getApexDomain(selectedProxyRule.domain);
+            const domain = domainsList?.domains.find((d) => d.domain === apexDomain);
+            if (isCloud && domain) {
+                await sdk.forConsole.domains.updateNameservers({
+                    domainId: domain.$id
+                });
+            }
+        } catch {
+            // Ignore error
+        }
+
+        try {
+            selectedProxyRule = await sdk
+                .forProject(page.params.region, page.params.project)
+                .proxy.updateRuleVerification({ ruleId: selectedProxyRule.$id });
+
+            await invalidate(Dependencies.DOMAINS);
+            show = false;
+            addNotification({
+                type: 'success',
+                message: 'Domain verified successfully'
+            });
+            trackEvent(Submit.DomainUpdateVerification);
+        } catch (e) {
+            error = e.message;
+            trackError(e, Submit.DomainUpdateVerification);
+        }
+    }
+
+    $effect(() => {
+        if (!show) {
+            error = null;
+        }
+    });
 </script>
 
-<Modal title="Certificate logs" bind:show size="m" hideFooter>
+<Modal
+    title="Certificate logs"
+    size="m"
+    bind:show
+    bind:error
+    onSubmit={retryDomain}
+    hideFooter={selectedProxyRule.status !== ProxyRuleStatus.Unverified}>
     <Logs logs={selectedProxyRule.logs} theme={$app.themeInUse} showScrollButton height="250px" />
+    <svelte:fragment slot="footer">
+        {#if selectedProxyRule.status === ProxyRuleStatus.Unverified}
+            <Button submit>Retry</Button>
+        {/if}
+    </svelte:fragment>
 </Modal>

src/routes/(console)/project-[region]-[project]/functions/function-[function]/domains/table.svelte

@@ -226,7 +226,7 @@
 {/if}
 
 {#if showLogs}
-    <ViewLogsModal bind:show={showLogs} {selectedProxyRule} />
+    <ViewLogsModal bind:show={showLogs} {selectedProxyRule} domainsList={organizationDomains} />
 {/if}
 
 <style>

src/routes/(console)/project-[region]-[project]/settings/domains/table.svelte

@@ -231,7 +231,7 @@
 {/if}
 
 {#if showLogs}
-    <ViewLogsModal bind:show={showLogs} {selectedProxyRule} />
+    <ViewLogsModal bind:show={showLogs} {selectedProxyRule} domainsList={organizationDomains} />
 {/if}
 
 <style>

src/routes/(console)/project-[region]-[project]/sites/site-[site]/domains/table.svelte

@@ -226,7 +226,7 @@
 {/if}
 
 {#if showLogs}
-    <ViewLogsModal bind:show={showLogs} {selectedProxyRule} />
+    <ViewLogsModal bind:show={showLogs} {selectedProxyRule} domainsList={organizationDomains} />
 {/if}
 
 <style>