Merge branch 'feat-documentsdb' of https://github.com/appwrite/console into feat-documentsdb

Author: premtsd-code

bun.lock

@@ -106,7 +106,7 @@
         "immutable": "^5.1.5",
         "flatted": "^3.4.2",
         "yaml": "^1.10.3",
-        "picomatch": "^2.3.2",
+        "picomatch": "^4.0.4",
         "cookie": "^0.7.0"
     }
 }

package.json

@@ -5,7 +5,6 @@ import type { Models } from '@appwrite.io/console';
 // Parse feature flags from env as a string array (exact match only)
 const flagsRaw = (env.PUBLIC_CONSOLE_FEATURE_FLAGS ?? '').split(',');
 
-// @ts-expect-error: unused method!
 function isFlagEnabled(name: string) {
     // loose generic to allow safe access while retaining type safety
     return <T extends { account?: Account; organization?: Models.Organization }>(data: T) => {
@@ -19,4 +18,6 @@ function isFlagEnabled(name: string) {
     };
 }
 
-export const flags = {};
+export const flags = {
+    multiDb: isFlagEnabled('multi-db')
+};

src/lib/flags.ts

@@ -1,10 +1,12 @@
 <script lang="ts">
     import { goto } from '$app/navigation';
     import { page } from '$app/state';
-    import { PaginationWithLimit } from '$lib/components';
+    import { Empty, PaginationWithLimit } from '$lib/components';
     import { Button } from '$lib/elements/forms';
     import { Container, ResponsiveContainerHeader } from '$lib/layout';
+    import type { Models } from '@appwrite.io/console';
 
+    import Create from './create.svelte';
     import Grid from './grid.svelte';
     import { columns } from './store';
     import Table from './table.svelte';
@@ -23,23 +25,47 @@
 
     import { resolveRoute, withPath } from '$lib/stores/navigation';
     import EmptyDatabaseCloud from './empty.svelte';
+    import { flags } from '$lib/flags';
+    import { user } from '$lib/stores/user';
+    import { project } from '../store';
 
     const { data }: PageProps = $props();
 
+    let showCreate = $state(false);
+
+    const isMultiDb = $derived(flags.multiDb({ account: $user, organization: $organization }));
     const isLimited = $derived(isServiceLimited('databases', $organization, data.databases.total));
 
+    async function handleCreate(event: CustomEvent<Models.Database>) {
+        showCreate = false;
+        await goto(
+            resolveRoute('/(console)/project-[region]-[project]/databases/database-[database]', {
+                ...page.params,
+                database: event.detail.$id
+            })
+        );
+    }
+
     async function goToCreateDatabaseWizard() {
         await goto(
             resolveRoute('/(console)/project-[region]-[project]/databases/create', page.params)
         );
     }
 
+    function triggerCreate() {
+        if (isMultiDb) {
+            goToCreateDatabaseWizard();
+        } else {
+            showCreate = true;
+        }
+    }
+
     $effect(() => {
         $registerCommands([
             {
                 label: 'Create database',
                 callback: () => {
-                    goToCreateDatabaseWizard();
+                    triggerCreate();
                 },
                 keys: ['c'],
                 disabled: !$canWriteDatabases || isLimited,
@@ -56,7 +82,7 @@
 
     {#if data.databases.total}
         {#if data.view === 'grid'}
-            <Grid {data} onCreateDatabaseClick={goToCreateDatabaseWizard} />
+            <Grid {data} onCreateDatabaseClick={triggerCreate} />
         {:else}
             <Table
                 entities={data.entities}
@@ -77,7 +103,7 @@
                 size="s"
                 secondary>Clear Search</Button>
         </EmptySearch>
-    {:else}
+    {:else if isMultiDb}
         <EmptyDatabaseCloud
             disabled={$canWriteDatabases}
             onDatabaseTypeSelected={async (type) => {
@@ -91,9 +117,17 @@
                     )
                 );
             }} />
+    {:else}
+        <Empty
+            single
+            target="database"
+            allowCreate={$canWriteDatabases}
+            on:click={() => (showCreate = true)} />
     {/if}
 </Container>
 
+<Create bind:showCreate project={$project} on:created={handleCreate} />
+
 {#snippet containerHeader()}
     <ResponsiveContainerHeader
         hasSearch
@@ -103,10 +137,7 @@
         {#if $canWriteDatabases}
             <Tooltip disabled={!isLimited} maxWidth={BODY_TOOLTIP_MAX_WIDTH}>
                 <div>
-                    <Button
-                        disabled={isLimited}
-                        event="create_database"
-                        on:click={goToCreateDatabaseWizard}>
+                    <Button disabled={isLimited} event="create_database" on:click={triggerCreate}>
                         <Icon icon={IconPlus} slot="start" size="s" />
                         Create database
                     </Button>