From 6d96d688598562cffefb78f3dc12801365de2b5d Mon Sep 17 00:00:00 2001
From: Arman <arman@appwrite.io>
Date: Tue, 18 Jun 2024 18:48:48 +0200
Subject: [PATCH] feat: replace routes

---
 src/lib/layout/containerButton.svelte            |  4 +++-
 src/lib/layout/containerHeader.svelte            |  4 +++-
 .../functions/function-[function]/+page.svelte   |  8 +++-----
 .../functions/function-[function]/execute.svelte |  1 +
 .../function-[function]/executions/+page.svelte  | 16 +++++++---------
 .../settings/executeFunction.svelte              | 11 ++++++-----
 .../functions/function-[function]/store.ts       |  4 ++--
 7 files changed, 25 insertions(+), 23 deletions(-)

diff --git a/src/lib/layout/containerButton.svelte b/src/lib/layout/containerButton.svelte
index 97fb3efd7..facdf58c5 100644
--- a/src/lib/layout/containerButton.svelte
+++ b/src/lib/layout/containerButton.svelte
@@ -15,6 +15,7 @@
     export let disabled: boolean;
     export let buttonText: string;
     export let buttonMethod: () => void | Promise<void>;
+    export let buttonHref: string = null;
     export let buttonEvent: string = buttonText?.toLocaleLowerCase();
     export let icon = 'plus';
     export let showIcon = true;
@@ -31,7 +32,8 @@
         secondary={buttonType === 'secondary'}
         on:click={buttonMethod}
         event={buttonEvent}
-        {disabled}>
+        {disabled}
+        href={buttonHref}>
         {#if showIcon}
             <span class={`icon-${icon}`} aria-hidden="true" />
         {/if}
diff --git a/src/lib/layout/containerHeader.svelte b/src/lib/layout/containerHeader.svelte
index 9e6d3df8d..404e518fc 100644
--- a/src/lib/layout/containerHeader.svelte
+++ b/src/lib/layout/containerHeader.svelte
@@ -31,6 +31,7 @@
 
     export let buttonText: string = null;
     export let buttonMethod: () => void = null;
+    export let buttonHref: string = null;
     export let buttonEvent: string = buttonText?.toLocaleLowerCase();
     export let buttonDisabled = false;
 
@@ -177,7 +178,8 @@
                 disabled={isButtonDisabled}
                 {buttonText}
                 {buttonEvent}
-                {buttonMethod} />
+                {buttonMethod}
+                {buttonHref} />
         {/if}
     </slot>
 </header>
diff --git a/src/routes/console/project-[project]/functions/function-[function]/+page.svelte b/src/routes/console/project-[project]/functions/function-[function]/+page.svelte
index aa0c3c17b..62005ecfd 100644
--- a/src/routes/console/project-[project]/functions/function-[function]/+page.svelte
+++ b/src/routes/console/project-[project]/functions/function-[function]/+page.svelte
@@ -25,7 +25,7 @@
         TableRow,
         TableScroll
     } from '$lib/elements/table';
-    import { deploymentList, execute, func, proxyRuleList, showFunctionExecute } from './store';
+    import { deploymentList, func, proxyRuleList } from './store';
     import { Container, ContainerHeader } from '$lib/layout';
     import { app } from '$lib/stores/app';
     import { calculateSize, humanFileSize } from '$lib/helpers/sizeConvertion';
@@ -41,6 +41,7 @@
     import DeploymentDomains from './deploymentDomains.svelte';
     import { GRACE_PERIOD_OVERRIDE, isCloud } from '$lib/system';
     import { readOnly } from '$lib/stores/billing';
+    import { project } from '../../store';
 
     export let data;
 
@@ -151,10 +152,7 @@
 
                         <Button
                             secondary
-                            on:click={() => {
-                                $execute = $func;
-                                $showFunctionExecute = true;
-                            }}
+                            href={`${base}/console/project-${$project.$id}/functions/function-${$func.$id}/executions/execute-function`}
                             disabled={isCloud && $readOnly && !GRACE_PERIOD_OVERRIDE}>
                             Execute now
                         </Button>
diff --git a/src/routes/console/project-[project]/functions/function-[function]/execute.svelte b/src/routes/console/project-[project]/functions/function-[function]/execute.svelte
index aea981107..6b408f9ec 100644
--- a/src/routes/console/project-[project]/functions/function-[function]/execute.svelte
+++ b/src/routes/console/project-[project]/functions/function-[function]/execute.svelte
@@ -1,4 +1,5 @@
 <script lang="ts">
+    //TODO remove
     import { afterNavigate, goto, invalidate } from '$app/navigation';
     import { base } from '$app/paths';
     import { page } from '$app/stores';
diff --git a/src/routes/console/project-[project]/functions/function-[function]/executions/+page.svelte b/src/routes/console/project-[project]/functions/function-[function]/executions/+page.svelte
index 4806d3f8d..e6f25e884 100644
--- a/src/routes/console/project-[project]/functions/function-[function]/executions/+page.svelte
+++ b/src/routes/console/project-[project]/functions/function-[function]/executions/+page.svelte
@@ -1,5 +1,5 @@
 <script lang="ts">
-    import { goto, invalidate } from '$app/navigation';
+    import { invalidate } from '$app/navigation';
     import { Alert, EmptySearch, Id, PaginationWithLimit } from '$lib/components';
     import { BillingPlan, Dependencies } from '$lib/constants';
     import { Pill } from '$lib/elements';
@@ -19,13 +19,14 @@
     import { log } from '$lib/stores/logs';
     import { sdk } from '$lib/stores/sdk';
     import { onMount } from 'svelte';
-    import { func, execute } from '../store';
+    import { func } from '../store';
     import type { Models } from '@appwrite.io/console';
     import { organization } from '$lib/stores/organization';
     import { getServiceLimit, showUsageRatesModal } from '$lib/stores/billing';
     import { project } from '$routes/console/project-[project]/store';
     import Create from '../create.svelte';
     import { abbreviateNumber } from '$lib/helpers/numbers';
+    import { base } from '$app/paths';
 
     export let data;
 
@@ -51,13 +52,7 @@
         title="Executions"
         buttonText="Execute now"
         buttonEvent="execute_function"
-        buttonMethod={() => {
-            $execute = $func;
-            // $showFunctionExecute = true;
-            goto(
-                `/console/project-${$project.$id}/functions/function-${$func.$id}/executions/execute-function`
-            );
-        }}>
+        buttonHref={`${base}/console/project-${$project.$id}/functions/function-${$func.$id}/executions/execute-function`}>
         <svelte:fragment slot="tooltip" let:tier let:limit let:upgradeMethod>
             <p class="u-bold">The {tier} plan has limits</p>
             <ul>
@@ -125,6 +120,9 @@
                                 warning={status === 'waiting' || status === 'building'}
                                 danger={status === 'failed'}
                                 info={status === 'completed' || status === 'ready'}>
+                                {#if status === 'scheduled'}
+                                    <span class="icon-clock" aria-hidden="true" />
+                                {/if}
                                 {status}
                             </Pill>
                         </TableCell>
diff --git a/src/routes/console/project-[project]/functions/function-[function]/settings/executeFunction.svelte b/src/routes/console/project-[project]/functions/function-[function]/settings/executeFunction.svelte
index ba4d81ea3..43702d9c9 100644
--- a/src/routes/console/project-[project]/functions/function-[function]/settings/executeFunction.svelte
+++ b/src/routes/console/project-[project]/functions/function-[function]/settings/executeFunction.svelte
@@ -1,8 +1,10 @@
 <script lang="ts">
+    import { base } from '$app/paths';
     import { CardGrid, Heading, SvgIcon } from '$lib/components';
     import { Button } from '$lib/elements/forms';
     import { toLocaleDateTime } from '$lib/helpers/date';
-    import { execute, func, showFunctionExecute } from '../store';
+    import { project } from '$routes/console/project-[project]/store';
+    import { func } from '../store';
 </script>
 
 <CardGrid>
@@ -28,9 +30,8 @@
     <svelte:fragment slot="actions">
         <Button
             secondary
-            on:click={() => {
-                $execute = $func;
-                $showFunctionExecute = true;
-            }}>Execute now</Button>
+            href={`${base}/console/project-${$project.$id}/functions/function-${$func.$id}/executions/execute-function`}>
+            Execute now
+        </Button>
     </svelte:fragment>
 </CardGrid>
diff --git a/src/routes/console/project-[project]/functions/function-[function]/store.ts b/src/routes/console/project-[project]/functions/function-[function]/store.ts
index 0bc01a1d4..e5b2bbe56 100644
--- a/src/routes/console/project-[project]/functions/function-[function]/store.ts
+++ b/src/routes/console/project-[project]/functions/function-[function]/store.ts
@@ -11,8 +11,8 @@ export const proxyRuleList = derived(
     page,
     ($page) => $page.data.proxyRuleList as Models.ProxyRuleList
 );
-export const execute: Writable<Models.Function> = writable();
-export const showFunctionExecute: Writable<boolean> = writable(false);
+export const execute: Writable<Models.Function> = writable(); //TODO Remove
+export const showFunctionExecute: Writable<boolean> = writable(false); //TODO Remove
 
 export const repositories: Writable<{
     search: string;