feat: function scopes

src/lib/actions/analytics.ts

@@ -226,6 +226,7 @@ export enum Submit {
     FunctionUpdateLogging = 'submit_function_update_logging',
     FunctionUpdateTimeout = 'submit_function_update_timeout',
     FunctionUpdateEvents = 'submit_function_update_events',
+    FunctionUpdateScopes = 'submit_function_update_scopes',
     FunctionConnectRepo = 'submit_function_connect_repo',
     FunctionDisconnectRepo = 'submit_function_disconnect_repo',
     FunctionRedeploy = 'submit_function_redeploy',

src/routes/console/project-[project]/functions/function-[function]/settings/updateScopes.svelte

@@ -0,0 +1,91 @@
+<script lang="ts">
+    import { invalidate } from '$app/navigation';
+    import { page } from '$app/stores';
+    import { Submit, trackError, trackEvent } from '$lib/actions/analytics';
+    import { CardGrid, Heading } from '$lib/components';
+    import { Dependencies } from '$lib/constants';
+    import { Button, Form } from '$lib/elements/forms';
+    import { addNotification } from '$lib/stores/notifications';
+    import { sdk } from '$lib/stores/sdk';
+    import { onMount } from 'svelte';
+    import { func } from '../store';
+    import { isValueOfStringEnum } from '$lib/helpers/types';
+    import { Runtime } from '@appwrite.io/console';
+    import Scopes from '$routes/console/project-[project]/overview/keys/scopes.svelte';
+    import { symmetricDifference } from '$lib/helpers/array';
+
+    const functionId = $page.params.function;
+    let functionScopes: string[] = null;
+
+    onMount(async () => {
+        functionScopes ??= $func.scopes;
+    });
+
+    async function updateScopes() {
+        try {
+            if (!isValueOfStringEnum(Runtime, $func.runtime)) {
+                throw new Error(`Invalid runtime: ${$func.runtime}`);
+            }
+            await sdk.forProject.functions.update(
+                functionId,
+                $func.name,
+                $func.runtime,
+                $func.execute || undefined,
+                $func.events || undefined,
+                $func.schedule || undefined,
+                $func.timeout || undefined,
+                $func.enabled || undefined,
+                $func.logging || undefined,
+                $func.entrypoint || undefined,
+                $func.commands || undefined,
+                $func.installationId || undefined,
+                $func.providerRepositoryId || undefined,
+                $func.providerBranch || undefined,
+                $func.providerSilentMode || undefined,
+                $func.providerRootDirectory || undefined,
+                // TODO: use updated SDK
+                functionScopes
+            );
+            await invalidate(Dependencies.FUNCTION);
+            addNotification({
+                type: 'success',
+                message: 'Function scopes have been updated'
+            });
+            trackEvent(Submit.FunctionUpdateScopes);
+        } catch (error) {
+            addNotification({
+                type: 'error',
+                message: error.message
+            });
+            trackError(error, Submit.FunctionUpdateScopes);
+        }
+    }
+</script>
+
+<Form onSubmit={updateScopes}>
+    <CardGrid>
+        <Heading tag="h6" size="7">Scopes</Heading>
+        <p class="text">
+            Select scopes to grant the dynamic key generated temporarily for your function. It is
+            best practice to allow only necessary permissions. <a
+                href="https://appwrite.io/docs/permissions"
+                target="_blank"
+                rel="noopener noreferrer"
+                class="link">Learn more</a
+            >.
+        </p>
+        <svelte:fragment slot="aside">
+            {#if functionScopes !== null}
+                <Scopes bind:scopes={functionScopes} />
+            {/if}
+        </svelte:fragment>
+
+        <svelte:fragment slot="actions">
+            <Button
+                submit
+                disabled={functionScopes &&
+                    $func?.scopes &&
+                    !symmetricDifference(functionScopes, $func?.scopes).length}>Update</Button>
+        </svelte:fragment>
+    </CardGrid>
+</Form>