add: backup banner alert.

src/lib/components/billing/alerts/backupDatabase.svelte

@@ -0,0 +1,28 @@
+<script lang="ts">
+    import { page } from '$app/stores';
+    import { BillingPlan } from '$lib/constants';
+    import { Button } from '$lib/elements/forms';
+    import { organization } from '$lib/stores/organization';
+    import { HeaderAlert } from '$lib/layout';
+    import { isCloud } from '$lib/system.js';
+    import { upgradeURL } from '$lib/stores/billing';
+
+    const isFreePlan = $organization?.billingPlan === BillingPlan.FREE;
+
+    const subtitle = isFreePlan
+        ? 'Upgrade your plan to ensure your data stays safe with advanced backup policies'
+        : 'Protect your data by quickly adding a backup policy';
+    const ctaText = isFreePlan ? 'Upgrade plan' : 'Add backup';
+    const ctaURL = isFreePlan ? $upgradeURL : `${$page.url.pathname}/backups`;
+</script>
+
+{#if isCloud && $organization?.$id && $page.url.pathname.match(/\/databases\/database-[^/]+$/)}
+    <HeaderAlert type="warning" title="Your database is not backed up">
+        <svelte:fragment>{subtitle}</svelte:fragment>
+        <svelte:fragment slot="buttons">
+            <Button href={ctaURL} secondary fullWidthMobile>
+                <span class="text">{ctaText}</span>
+            </Button>
+        </svelte:fragment>
+    </HeaderAlert>
+{/if}

src/lib/stores/database.ts

@@ -0,0 +1,31 @@
+import { derived } from 'svelte/store';
+import { page } from '$app/stores';
+import { type Models, Query } from '@appwrite.io/console';
+import { sdk } from '$lib/stores/sdk';
+import { headerAlert } from '$lib/stores/headerAlert';
+import BackupDatabase from '$lib/components/billing/alerts/backupDatabase.svelte';
+
+export const database = derived(page, ($page) => $page.data?.database as Models.Database);
+
+export async function checkForDatabaseBackupPolicies(database: Models.Database) {
+    let total = 0;
+    try {
+        const policies = await sdk.forConsole.backups.listPolicies([
+            Query.limit(1),
+            Query.equal('resourceId', database.$id)
+        ]);
+
+        total = policies.total;
+    } catch (e) {
+        // ignore, backups not allowed on free plan error.
+    }
+
+    if (!total) {
+        headerAlert.add({
+            id: 'databasesBackup',
+            component: BackupDatabase,
+            show: true,
+            importance: 7
+        });
+    }
+}

src/lib/stores/sdk.ts

@@ -71,6 +71,7 @@ export const sdk = {
         client: clientConsole,
         account: new Account(clientConsole),
         avatars: new Avatars(clientConsole),
+        backups: new Backups(clientConsole),
         functions: new Functions(clientConsole),
         health: new Health(clientConsole),
         locale: new Locale(clientConsole),

src/routes/(console)/+layout.svelte

@@ -9,6 +9,7 @@
     import { app } from '$lib/stores/app';
     import { log } from '$lib/stores/logs';
     import { newOrgModal, organization } from '$lib/stores/organization';
+    import { database, checkForDatabaseBackupPolicies } from '$lib/stores/database';
     import { wizard } from '$lib/stores/wizard';
     import { afterUpdate, onMount } from 'svelte';
     import { loading } from '$routes/store';
@@ -265,6 +266,12 @@
         }
     }
 
+    database.subscribe(async (database) => {
+        if (!database) return;
+        // the component checks `isCloud` internally.
+        await checkForDatabaseBackupPolicies(database);
+    });
+
     organization.subscribe(async (org) => {
         if (!org) return;
         if (isCloud) {