more commands

2026-06-06 19:27:48 +00:00 · 2023-07-22 13:03:04 +01:00
parent 9a31ce8683
commit 10acb7783f
10 changed files with 144 additions and 16 deletions
@@ -19,7 +19,9 @@ const groups = [
    'webhooks',
    'integrations',
    'migrations',
-    'users'
+    'users',
+    'collections',
+    'attributes'
 ] as const;

 export type CommandGroup = (typeof groups)[number];
@@ -104,7 +106,7 @@ export const commandCenterKeyDownHandler = derived(
        const reset = debounce(() => {
            recentKeyCodes = [];
            validCommands = [];
-        }, 2000);
+        }, 1000);

        const getHighestPriorityCommand = () => {
            if (!validCommands.length) return;
@@ -6,8 +6,8 @@
    import { useCompletion } from 'ai/svelte';
    import { subPanels } from '../subPanels';

-    import CoolerAppwrite from '$lib/images/appwrite-cooler.svg';
    import { isLanguage, type Language } from '$lib/components/code.svelte';
+    import CoolerAppwrite from '$lib/images/appwrite-cooler.svg';
    import { VARS } from '$lib/system';

    const { input, handleSubmit, completion, isLoading, complete } = useCompletion({
@@ -0,0 +1,27 @@
+<script lang="ts">
+    import { attributeOptions } from '$routes/console/project-[project]/databases/database-[database]/collection-[collection]/attributes/store';
+    import Template from './template.svelte';
+
+    let search = '';
+
+    let options = attributeOptions.map((option) => {
+        return {
+            label: option.name,
+            icon: option.icon,
+            callback() {
+              option.
+            }
+        };
+    });
+
+    $: filteredPlatforms = options.filter((option) => {
+        return option.label.toLowerCase().includes(search.toLowerCase());
+    });
+</script>
+
+<Template options={filteredPlatforms} bind:search>
+    <div class="u-flex u-cross-center u-gap-8" slot="option" let:option>
+        <i class="icon-{option.icon}" />
+        <span>{option.label}</span>
+    </div>
+</Template>
@@ -36,3 +36,9 @@ export const DatabasesPanel: SubPanel = {
    name: 'Databases',
    component: Databases
 };
+
+import Collections from './collections.svelte';
+export const CollectionsPanel: SubPanel = {
+    name: 'Collections',
+    component: Collections
+};
@@ -7,5 +7,5 @@
 </script>

 <Template options={$results} bind:search={$search}>
-    <div class="option" slot="option" let:option>{option.label}</div>
+    <div slot="option" let:option>{option.label}</div>
 </Template>
@@ -7,5 +7,5 @@
 </script>

 <Template options={$results} bind:search={$search}>
-    <div class="option" slot="option" let:option>{option.label}</div>
+    <div slot="option" let:option>{option.label}</div>
 </Template>
@@ -1,22 +1,26 @@
 import { goto } from '$app/navigation';
-import { sdk } from '$lib/stores/sdk';
+import { database } from '$routes/console/project-[project]/databases/database-[database]/store';
+import { project } from '$routes/console/project-[project]/store';
 import { get } from 'svelte/store';
 import type { Searcher } from '../commands';
-import { project } from '$routes/console/project-[project]/store';
+import { sdk } from '$lib/stores/sdk';

 export const collectionsSearcher = (async (query: string) => {
-    const { databases } = await sdk.forProject.databases.list();
+    const databaseId = get(database).$id;
+    const { collections } = await sdk.forProject.databases.listCollections(databaseId);

    const projectId = get(project).$id;
-    return databases
-        .filter((db) => db.name.toLowerCase().includes(query.toLowerCase()))
+    return collections
+        .filter((col) => col.name.toLowerCase().includes(query.toLowerCase()))
        .map(
-            (db) =>
+            (col) =>
                ({
-                    group: 'databases',
-                    label: db.name,
+                    group: 'collections',
+                    label: col.name,
                    callback: () => {
-                        goto(`/console/project-${projectId}/databases/database-${db.$id}`);
+                        goto(
+                            `/console/project-${projectId}/databases/database-${databaseId}/collection-${col.$id}`
+                        );
                    }
                } as const)
        );
@@ -22,8 +22,8 @@
                goto(`/console/project-${$project.$id}/databases/usage`);
            },
            keys: ['g', 'u'],
-            disabled: $page.url.pathname.includes('usage'),
-
+            disabled:
+                $page.url.pathname.includes('usage') || $page.url.pathname.includes('database-'),
            group: 'databases'
        }
    ]);
@@ -6,6 +6,14 @@
    import { base } from '$app/paths';
    import { page } from '$app/stores';
    import { Dependencies } from '$lib/constants';
+    import {
+        addSubPanel,
+        registerCommands,
+        registerSearchers,
+        updateCommandGroupRanks
+    } from '$lib/commandCenter';
+    import { collectionsSearcher } from '$lib/commandCenter/searchers';
+    import { CollectionsPanel } from '$lib/commandCenter/panels';

    const project = $page.params.project;
    const databaseId = $page.params.database;
@@ -17,6 +25,67 @@
            `${base}/console/project-${project}/databases/database-${databaseId}/collection-${event.detail.$id}`
        );
    }
+
+    $: $registerCommands([
+        {
+            label: 'Find Collections',
+            callback() {
+                addSubPanel(CollectionsPanel);
+            },
+            keys: ['f', 'c'],
+            group: 'collections',
+            icon: 'search'
+        },
+        {
+            label: 'Create Collection',
+            callback() {
+                $showCreate = true;
+                if (!$page.url.pathname.endsWith(databaseId)) {
+                    goto(`/console/project-${project}/databases/database-${databaseId}`);
+                }
+            },
+            keys: $page.url.pathname.endsWith(databaseId) ? ['c'] : ['c', 'c'],
+            disabled: $page.url.pathname.includes('collection-'),
+            group: 'collections',
+            icon: 'plus'
+        },
+        {
+            label: 'Go to collections',
+            callback() {
+                goto(`/console/project-${project}/databases/database-${databaseId}`);
+            },
+            disabled:
+                $page.url.pathname.endsWith(databaseId) ||
+                $page.url.pathname.includes('collection-'),
+            keys: ['g', 'c'],
+            group: 'collections'
+        },
+        {
+            label: 'Go to usage',
+            callback() {
+                goto(`/console/project-${project}/databases/database-${databaseId}/usage`);
+            },
+            disabled:
+                $page.url.pathname.includes('/usage') || $page.url.pathname.includes('collection-'),
+            keys: ['g', 'u'],
+            group: 'collections'
+        },
+        {
+            label: 'Go to settings',
+            callback() {
+                goto(`/console/project-${project}/databases/database-${databaseId}/settings`);
+            },
+            disabled:
+                $page.url.pathname.includes('/settings') ||
+                $page.url.pathname.includes('collection-'),
+            keys: ['g', 's'],
+            group: 'collections'
+        }
+    ]);
+
+    $registerSearchers(collectionsSearcher);
+
+    $: $updateCommandGroupRanks((p) => ({ ...p, collections: 10 }));
 </script>

 <svelte:head>
@@ -4,6 +4,7 @@
    import { sdk } from '$lib/stores/sdk';
    import { onDestroy, onMount } from 'svelte';
    import { collection } from './store';
+    import { registerCommands, updateCommandGroupRanks } from '$lib/commandCenter';

    let unsubscribe: { (): void };

@@ -23,6 +24,25 @@
            unsubscribe();
        }
    });
+
+    $: $registerCommands([
+        {
+            label: 'Create Attribute',
+            keys: ['c', 'a'],
+            callback() {
+                // no-op
+            },
+            icon: 'plus',
+            group: 'attributes'
+        }
+    ]);
+
+    $updateCommandGroupRanks((p) => ({
+        ...p,
+        attributes: 1000,
+        documents: 900,
+        collections: 800
+    }));
 </script>

 <svelte:head>