From ba97a759bf408f525f2df703c04bd5fd443c02e7 Mon Sep 17 00:00:00 2001
From: harsh mahajan <harshmahajan2345@gmail.com>
Date: Thu, 30 Apr 2026 17:33:07 +0530
Subject: [PATCH 1/5] fix: remove misleading all-time usage stats from
 functions, sites, and storage

The *Total fields returned by the API represent all-time entity counts
(databases, buckets, files, deployments) that do not change with the
selected date range. Showing these alongside period selectors caused
customer confusion when comparing against billing stats.

- Remove Usage tab and page content for functions, sites, and storage
  sections where only all-time counts were displayed
- Keep databases usage page with reads/writes (period-specific)
- Keep individual function usage page with executions and GB hours (period-specific)
- Fix typo in function header tab event name (sage -> usage)
---
 .../databases/usage/[[period]]/+page.svelte   | 16 +---------
 .../function-[function]/header.svelte         |  2 +-
 .../functions/header.svelte                   |  5 ---
 .../functions/usage/[[period]]/+page.svelte   | 17 ++--------
 .../sites/header.svelte                       |  5 ---
 .../sites/site-[site]/header.svelte           |  5 ---
 .../site-[site]/usage/[[period]]/+page.svelte | 30 ++----------------
 .../sites/usage/[[period]]/+page.svelte       | 17 ++--------
 .../storage/bucket-[bucket]/header.svelte     |  6 ----
 .../usage/[[period]]/+page.svelte             | 31 ++-----------------
 .../storage/header.svelte                     |  6 ----
 .../storage/usage/[[period]]/+page.svelte     | 17 ++--------
 12 files changed, 12 insertions(+), 145 deletions(-)

diff --git a/src/routes/(console)/project-[region]-[project]/databases/usage/[[period]]/+page.svelte b/src/routes/(console)/project-[region]-[project]/databases/usage/[[period]]/+page.svelte
index d0caac9cfd..b5b114d9af 100644
--- a/src/routes/(console)/project-[region]-[project]/databases/usage/[[period]]/+page.svelte
+++ b/src/routes/(console)/project-[region]-[project]/databases/usage/[[period]]/+page.svelte
@@ -1,15 +1,10 @@
 <script lang="ts">
-    import { base } from '$app/paths';
-    import { page } from '$app/state';
-    import { Container, Usage, UsageMultiple } from '$lib/layout';
+    import { Container, UsageMultiple } from '$lib/layout';
     import { Layout } from '@appwrite.io/pink-svelte';
     import type { PageData } from './$types';
 
     export let data: PageData;
 
-    $: total = data.databasesTotal;
-    $: count = data.databases;
-
     $: reads = data.databasesReads;
     $: readsTotal = data.databasesReadsTotal;
 
@@ -19,15 +14,6 @@
 
 <Container>
     <Layout.Stack gap="l">
-        <Usage
-            path={`${base}/project-${page.params.region}-${page.params.project}/databases/usage`}
-            {total}
-            {count}
-            countMetadata={{
-                legend: 'Databases',
-                title: 'Total databases'
-            }} />
-
         <UsageMultiple
             title="Reads and writes"
             showHeader={false}
diff --git a/src/routes/(console)/project-[region]-[project]/functions/function-[function]/header.svelte b/src/routes/(console)/project-[region]-[project]/functions/function-[function]/header.svelte
index 465aae173a..22f1ac8671 100644
--- a/src/routes/(console)/project-[region]-[project]/functions/function-[function]/header.svelte
+++ b/src/routes/(console)/project-[region]-[project]/functions/function-[function]/header.svelte
@@ -31,7 +31,7 @@
         {
             href: `${path}/usage`,
             title: 'Usage',
-            event: 'sage',
+            event: 'usage',
             hasChildren: true
         },
         {
diff --git a/src/routes/(console)/project-[region]-[project]/functions/header.svelte b/src/routes/(console)/project-[region]-[project]/functions/header.svelte
index 9cbab48b05..7b83bca36d 100644
--- a/src/routes/(console)/project-[region]-[project]/functions/header.svelte
+++ b/src/routes/(console)/project-[region]-[project]/functions/header.svelte
@@ -19,11 +19,6 @@
             href: `${path}/templates`,
             title: 'Templates',
             event: 'templates'
-        },
-        {
-            href: `${path}/usage`,
-            title: 'Usage',
-            event: 'usage'
         }
     ];
 </script>
diff --git a/src/routes/(console)/project-[region]-[project]/functions/usage/[[period]]/+page.svelte b/src/routes/(console)/project-[region]-[project]/functions/usage/[[period]]/+page.svelte
index a91d5a6f3f..cb464c166c 100644
--- a/src/routes/(console)/project-[region]-[project]/functions/usage/[[period]]/+page.svelte
+++ b/src/routes/(console)/project-[region]-[project]/functions/usage/[[period]]/+page.svelte
@@ -1,20 +1,7 @@
 <script lang="ts">
-    import { base } from '$app/paths';
-    import { page } from '$app/state';
-    import { Container, Usage } from '$lib/layout';
+    import { Container } from '$lib/layout';
 
     export let data;
-    $: total = data.deploymentsTotal;
-    $: count = data.deployments;
 </script>
 
-<Container>
-    <Usage
-        path={`${base}/project-${page.params.region}-${page.params.project}/functions/usage`}
-        countMetadata={{
-            legend: 'Functions',
-            title: 'Total functions'
-        }}
-        {total}
-        {count} />
-</Container>
+<Container></Container>
diff --git a/src/routes/(console)/project-[region]-[project]/sites/header.svelte b/src/routes/(console)/project-[region]-[project]/sites/header.svelte
index 511fcc0d36..037c8dd016 100644
--- a/src/routes/(console)/project-[region]-[project]/sites/header.svelte
+++ b/src/routes/(console)/project-[region]-[project]/sites/header.svelte
@@ -13,11 +13,6 @@
             title: 'Sites',
             event: 'sites',
             hasChildren: true
-        },
-        {
-            href: `${path}/usage`,
-            title: 'Usage',
-            event: 'usage'
         }
     ];
 </script>
diff --git a/src/routes/(console)/project-[region]-[project]/sites/site-[site]/header.svelte b/src/routes/(console)/project-[region]-[project]/sites/site-[site]/header.svelte
index 44a68d3d5c..e2da0914a7 100644
--- a/src/routes/(console)/project-[region]-[project]/sites/site-[site]/header.svelte
+++ b/src/routes/(console)/project-[region]-[project]/sites/site-[site]/header.svelte
@@ -28,11 +28,6 @@
             title: 'Domains',
             event: 'domains'
         },
-        {
-            href: `${path}/usage`,
-            title: 'Usage',
-            event: 'usage'
-        },
         {
             href: `${path}/settings`,
             title: 'Settings',
diff --git a/src/routes/(console)/project-[region]-[project]/sites/site-[site]/usage/[[period]]/+page.svelte b/src/routes/(console)/project-[region]-[project]/sites/site-[site]/usage/[[period]]/+page.svelte
index c2b841035d..cb464c166c 100644
--- a/src/routes/(console)/project-[region]-[project]/sites/site-[site]/usage/[[period]]/+page.svelte
+++ b/src/routes/(console)/project-[region]-[project]/sites/site-[site]/usage/[[period]]/+page.svelte
@@ -1,33 +1,7 @@
 <script lang="ts">
-    import { base } from '$app/paths';
-    import { page } from '$app/state';
-    import { Container, Usage } from '$lib/layout';
+    import { Container } from '$lib/layout';
 
     export let data;
-    $: total = data.deploymentsTotal;
-    $: count = data.deployments;
-
-    // $: totalBuilds = data.buildsTotal;
-    // $: countBuilds = data.builds;
 </script>
 
-<Container>
-    <Usage
-        path={`${base}/project-${page.params.region}-${page.params.project}/sites/site-${page.params.site}/usage`}
-        countMetadata={{
-            legend: 'Deployments',
-            title: 'Total deployments'
-        }}
-        {total}
-        {count} />
-
-    <!-- <Usage
-    title="Builds"
-    path={`${base}/project-${page.params.region}-${page.params.project}/sites/site-${page.params.site}/usage`}
-    countMetadata={{
-        legend: 'Builds',
-        title: 'Total builds'
-        }}
-        total={totalBuilds}
-        count={countBuilds} /> -->
-</Container>
+<Container></Container>
diff --git a/src/routes/(console)/project-[region]-[project]/sites/usage/[[period]]/+page.svelte b/src/routes/(console)/project-[region]-[project]/sites/usage/[[period]]/+page.svelte
index 4dec5a14e4..cb464c166c 100644
--- a/src/routes/(console)/project-[region]-[project]/sites/usage/[[period]]/+page.svelte
+++ b/src/routes/(console)/project-[region]-[project]/sites/usage/[[period]]/+page.svelte
@@ -1,20 +1,7 @@
 <script lang="ts">
-    import { base } from '$app/paths';
-    import { page } from '$app/state';
-    import { Container, Usage } from '$lib/layout';
+    import { Container } from '$lib/layout';
 
     export let data;
-    $: total = data.deploymentsTotal;
-    $: count = data.deployments;
 </script>
 
-<Container>
-    <Usage
-        path={`${base}/project-${page.params.region}-${page.params.project}/sites/usage`}
-        countMetadata={{
-            legend: 'Sites',
-            title: 'Total sites'
-        }}
-        {total}
-        {count} />
-</Container>
+<Container></Container>
diff --git a/src/routes/(console)/project-[region]-[project]/storage/bucket-[bucket]/header.svelte b/src/routes/(console)/project-[region]-[project]/storage/bucket-[bucket]/header.svelte
index 5bdf521833..8748b494b4 100644
--- a/src/routes/(console)/project-[region]-[project]/storage/bucket-[bucket]/header.svelte
+++ b/src/routes/(console)/project-[region]-[project]/storage/bucket-[bucket]/header.svelte
@@ -17,12 +17,6 @@
             event: 'files',
             hasChildren: true
         },
-        {
-            href: `${path}/usage`,
-            title: 'Usage',
-            event: 'usage',
-            hasChildren: true
-        },
         {
             href: `${path}/settings`,
             event: 'settings',
diff --git a/src/routes/(console)/project-[region]-[project]/storage/bucket-[bucket]/usage/[[period]]/+page.svelte b/src/routes/(console)/project-[region]-[project]/storage/bucket-[bucket]/usage/[[period]]/+page.svelte
index 3c39c5f9ef..b6c56a6e87 100644
--- a/src/routes/(console)/project-[region]-[project]/storage/bucket-[bucket]/usage/[[period]]/+page.svelte
+++ b/src/routes/(console)/project-[region]-[project]/storage/bucket-[bucket]/usage/[[period]]/+page.svelte
@@ -1,33 +1,6 @@
 <script lang="ts">
-    import { base } from '$app/paths';
-    import { page } from '$app/state';
-    import { Container, Usage } from '$lib/layout';
+    import { Container } from '$lib/layout';
 
-    export let data;
-    $: filesTotal = data.filesTotal;
-    $: files = data.files;
-    $: transformationsTotal = data.imageTransformationsTotal;
-    $: transformations = data.imageTransformations;
 </script>
 
-<Container>
-    <Usage
-        path={`${base}/project-${page.params.region}-${page.params.project}/storage/bucket-${page.params.bucket}/usage`}
-        total={filesTotal}
-        count={files}
-        countMetadata={{
-            legend: 'Files',
-            title: 'Total files'
-        }} />
-
-    <Usage
-        path={`${base}/project-${page.params.region}-${page.params.project}/storage/bucket-${page.params.bucket}/usage`}
-        total={transformationsTotal}
-        count={transformations}
-        countMetadata={{
-            legend: 'Image transformations',
-            title: 'Total transformations'
-        }}
-        isCumulative
-        hidePeriodSelect />
-</Container>
+<Container></Container>
diff --git a/src/routes/(console)/project-[region]-[project]/storage/header.svelte b/src/routes/(console)/project-[region]-[project]/storage/header.svelte
index 24aa16ec32..8a63a5c9f5 100644
--- a/src/routes/(console)/project-[region]-[project]/storage/header.svelte
+++ b/src/routes/(console)/project-[region]-[project]/storage/header.svelte
@@ -13,12 +13,6 @@
             title: 'Buckets',
             event: 'buckets',
             hasChildren: true
-        },
-        {
-            href: `${path}/usage`,
-            title: 'Usage',
-            event: 'usage',
-            hasChildren: true
         }
     ];
 </script>
diff --git a/src/routes/(console)/project-[region]-[project]/storage/usage/[[period]]/+page.svelte b/src/routes/(console)/project-[region]-[project]/storage/usage/[[period]]/+page.svelte
index 659277fbd2..cb464c166c 100644
--- a/src/routes/(console)/project-[region]-[project]/storage/usage/[[period]]/+page.svelte
+++ b/src/routes/(console)/project-[region]-[project]/storage/usage/[[period]]/+page.svelte
@@ -1,20 +1,7 @@
 <script lang="ts">
-    import { base } from '$app/paths';
-    import { page } from '$app/state';
-    import { Container, Usage } from '$lib/layout';
+    import { Container } from '$lib/layout';
 
     export let data;
-    $: total = data.bucketsTotal;
-    $: count = data.buckets;
 </script>
 
-<Container>
-    <Usage
-        path={`${base}/project-${page.params.region}-${page.params.project}/storage/usage`}
-        {total}
-        {count}
-        countMetadata={{
-            legend: 'Buckets',
-            title: 'Total buckets'
-        }} />
-</Container>
+<Container></Container>

From 1d33ca27f979415ff6dbdaf2022aa498ebff3977 Mon Sep 17 00:00:00 2001
From: harsh mahajan <harshmahajan2345@gmail.com>
Date: Thu, 30 Apr 2026 17:36:15 +0530
Subject: [PATCH 2/5] fix lint issue

---
 .../storage/bucket-[bucket]/usage/[[period]]/+page.svelte        | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/routes/(console)/project-[region]-[project]/storage/bucket-[bucket]/usage/[[period]]/+page.svelte b/src/routes/(console)/project-[region]-[project]/storage/bucket-[bucket]/usage/[[period]]/+page.svelte
index b6c56a6e87..3ef899e530 100644
--- a/src/routes/(console)/project-[region]-[project]/storage/bucket-[bucket]/usage/[[period]]/+page.svelte
+++ b/src/routes/(console)/project-[region]-[project]/storage/bucket-[bucket]/usage/[[period]]/+page.svelte
@@ -1,6 +1,5 @@
 <script lang="ts">
     import { Container } from '$lib/layout';
-
 </script>
 
 <Container></Container>

From 4d2562ae2d6a4059933bee2a61d4b7435b7cace9 Mon Sep 17 00:00:00 2001
From: harsh mahajan <harshmahajan2345@gmail.com>
Date: Thu, 30 Apr 2026 17:38:17 +0530
Subject: [PATCH 3/5] fix: clear loaders and unused data props on emptied usage
 pages

Stop unnecessary API calls on usage routes that no longer render
anything. Replace each loader with an empty return and remove
leftover export let data bindings from the page components.
---
 .../functions/usage/[[period]]/+page.svelte   |  2 --
 .../functions/usage/[[period]]/+page.ts       | 15 +------------
 .../site-[site]/usage/[[period]]/+page.ts     | 16 +-------------
 .../sites/usage/[[period]]/+page.svelte       |  2 --
 .../sites/usage/[[period]]/+page.ts           | 13 +-----------
 .../bucket-[bucket]/usage/[[period]]/+page.ts | 21 +------------------
 .../storage/usage/[[period]]/+page.svelte     |  2 --
 .../storage/usage/[[period]]/+page.ts         | 13 +-----------
 8 files changed, 5 insertions(+), 79 deletions(-)

diff --git a/src/routes/(console)/project-[region]-[project]/functions/usage/[[period]]/+page.svelte b/src/routes/(console)/project-[region]-[project]/functions/usage/[[period]]/+page.svelte
index cb464c166c..3ef899e530 100644
--- a/src/routes/(console)/project-[region]-[project]/functions/usage/[[period]]/+page.svelte
+++ b/src/routes/(console)/project-[region]-[project]/functions/usage/[[period]]/+page.svelte
@@ -1,7 +1,5 @@
 <script lang="ts">
     import { Container } from '$lib/layout';
-
-    export let data;
 </script>
 
 <Container></Container>
diff --git a/src/routes/(console)/project-[region]-[project]/functions/usage/[[period]]/+page.ts b/src/routes/(console)/project-[region]-[project]/functions/usage/[[period]]/+page.ts
index 6a4ec0fc18..80b1ec6bf5 100644
--- a/src/routes/(console)/project-[region]-[project]/functions/usage/[[period]]/+page.ts
+++ b/src/routes/(console)/project-[region]-[project]/functions/usage/[[period]]/+page.ts
@@ -1,16 +1,3 @@
-import { isValueOfStringEnum } from '$lib/helpers/types';
-import { sdk } from '$lib/stores/sdk';
-import { UsageRange } from '@appwrite.io/console';
 import type { PageLoad } from './$types';
 
-export const load: PageLoad = async ({ params }) => {
-    const period = isValueOfStringEnum(UsageRange, params.period)
-        ? params.period
-        : UsageRange.ThirtyDays;
-
-    return {
-        ...(await sdk
-            .forProject(params.region, params.project)
-            .functions.listUsage({ range: period }))
-    };
-};
+export const load: PageLoad = async () => ({});
diff --git a/src/routes/(console)/project-[region]-[project]/sites/site-[site]/usage/[[period]]/+page.ts b/src/routes/(console)/project-[region]-[project]/sites/site-[site]/usage/[[period]]/+page.ts
index 169caa3e58..80b1ec6bf5 100644
--- a/src/routes/(console)/project-[region]-[project]/sites/site-[site]/usage/[[period]]/+page.ts
+++ b/src/routes/(console)/project-[region]-[project]/sites/site-[site]/usage/[[period]]/+page.ts
@@ -1,17 +1,3 @@
-import { isValueOfStringEnum } from '$lib/helpers/types';
-import { sdk } from '$lib/stores/sdk';
-import { UsageRange } from '@appwrite.io/console';
 import type { PageLoad } from './$types';
 
-export const load: PageLoad = async ({ params }) => {
-    const period = isValueOfStringEnum(UsageRange, params.period)
-        ? params.period
-        : UsageRange.ThirtyDays;
-
-    return {
-        ...(await sdk.forProject(params.region, params.project).sites.getUsage({
-            siteId: params.site,
-            range: period
-        }))
-    };
-};
+export const load: PageLoad = async () => ({});
diff --git a/src/routes/(console)/project-[region]-[project]/sites/usage/[[period]]/+page.svelte b/src/routes/(console)/project-[region]-[project]/sites/usage/[[period]]/+page.svelte
index cb464c166c..3ef899e530 100644
--- a/src/routes/(console)/project-[region]-[project]/sites/usage/[[period]]/+page.svelte
+++ b/src/routes/(console)/project-[region]-[project]/sites/usage/[[period]]/+page.svelte
@@ -1,7 +1,5 @@
 <script lang="ts">
     import { Container } from '$lib/layout';
-
-    export let data;
 </script>
 
 <Container></Container>
diff --git a/src/routes/(console)/project-[region]-[project]/sites/usage/[[period]]/+page.ts b/src/routes/(console)/project-[region]-[project]/sites/usage/[[period]]/+page.ts
index f9782fef9b..80b1ec6bf5 100644
--- a/src/routes/(console)/project-[region]-[project]/sites/usage/[[period]]/+page.ts
+++ b/src/routes/(console)/project-[region]-[project]/sites/usage/[[period]]/+page.ts
@@ -1,14 +1,3 @@
-import { isValueOfStringEnum } from '$lib/helpers/types';
-import { sdk } from '$lib/stores/sdk';
-import { UsageRange } from '@appwrite.io/console';
 import type { PageLoad } from './$types';
 
-export const load: PageLoad = async ({ params }) => {
-    const period = isValueOfStringEnum(UsageRange, params.period)
-        ? params.period
-        : UsageRange.ThirtyDays;
-
-    return {
-        ...(await sdk.forProject(params.region, params.project).sites.listUsage({ range: period }))
-    };
-};
+export const load: PageLoad = async () => ({});
diff --git a/src/routes/(console)/project-[region]-[project]/storage/bucket-[bucket]/usage/[[period]]/+page.ts b/src/routes/(console)/project-[region]-[project]/storage/bucket-[bucket]/usage/[[period]]/+page.ts
index e840f385bd..80b1ec6bf5 100644
--- a/src/routes/(console)/project-[region]-[project]/storage/bucket-[bucket]/usage/[[period]]/+page.ts
+++ b/src/routes/(console)/project-[region]-[project]/storage/bucket-[bucket]/usage/[[period]]/+page.ts
@@ -1,22 +1,3 @@
-import { sdk } from '$lib/stores/sdk';
 import type { PageLoad } from './$types';
-import { isValueOfStringEnum } from '$lib/helpers/types';
-import { UsageRange, type Models } from '@appwrite.io/console';
 
-export const load: PageLoad = async ({ params }) => {
-    const period = isValueOfStringEnum(UsageRange, params.period)
-        ? params.period
-        : UsageRange.ThirtyDays;
-
-    const response = await sdk.forProject(params.region, params.project).storage.getBucketUsage({
-        bucketId: params.bucket,
-        range: period
-    });
-
-    return {
-        filesTotal: response.filesTotal,
-        files: response.files as Models.Metric[],
-        imageTransformationsTotal: response.imageTransformationsTotal,
-        imageTransformations: response.imageTransformations as Models.Metric[]
-    };
-};
+export const load: PageLoad = async () => ({});
diff --git a/src/routes/(console)/project-[region]-[project]/storage/usage/[[period]]/+page.svelte b/src/routes/(console)/project-[region]-[project]/storage/usage/[[period]]/+page.svelte
index cb464c166c..3ef899e530 100644
--- a/src/routes/(console)/project-[region]-[project]/storage/usage/[[period]]/+page.svelte
+++ b/src/routes/(console)/project-[region]-[project]/storage/usage/[[period]]/+page.svelte
@@ -1,7 +1,5 @@
 <script lang="ts">
     import { Container } from '$lib/layout';
-
-    export let data;
 </script>
 
 <Container></Container>
diff --git a/src/routes/(console)/project-[region]-[project]/storage/usage/[[period]]/+page.ts b/src/routes/(console)/project-[region]-[project]/storage/usage/[[period]]/+page.ts
index 619804280d..80b1ec6bf5 100644
--- a/src/routes/(console)/project-[region]-[project]/storage/usage/[[period]]/+page.ts
+++ b/src/routes/(console)/project-[region]-[project]/storage/usage/[[period]]/+page.ts
@@ -1,14 +1,3 @@
-import { isValueOfStringEnum } from '$lib/helpers/types';
-import { sdk } from '$lib/stores/sdk';
-import { UsageRange } from '@appwrite.io/console';
 import type { PageLoad } from './$types';
 
-export const load: PageLoad = async ({ params }) => {
-    const period = isValueOfStringEnum(UsageRange, params.period)
-        ? params.period
-        : UsageRange.ThirtyDays;
-
-    return {
-        ...(await sdk.forProject(params.region, params.project).storage.getUsage({ range: period }))
-    };
-};
+export const load: PageLoad = async () => ({});

From 1f2aab991617f13068f7842346c65d6c13b77c9b Mon Sep 17 00:00:00 2001
From: harsh mahajan <harshmahajan2345@gmail.com>
Date: Thu, 30 Apr 2026 17:40:07 +0530
Subject: [PATCH 4/5] fix: remove databases reads/writes usage tab and clear
 loaders

---
 .../database-[database]/header.svelte         |  6 -----
 .../usage/[[period]]/+page.svelte             | 23 ++--------------
 .../usage/[[period]]/+page.ts                 | 16 +----------
 .../databases/header.svelte                   |  6 -----
 .../databases/usage/[[period]]/+page.svelte   | 27 ++-----------------
 .../databases/usage/[[period]]/+page.ts       | 15 +----------
 6 files changed, 6 insertions(+), 87 deletions(-)

diff --git a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/header.svelte b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/header.svelte
index 1d3ded6c0d..7bd3d0756a 100644
--- a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/header.svelte
+++ b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/header.svelte
@@ -34,12 +34,6 @@
                 event: 'backups',
                 hasChildren: true
             },
-            {
-                href: withPath(baseDatabasePath, '/usage'),
-                title: 'Usage',
-                event: 'usage',
-                hasChildren: true
-            },
             {
                 href: withPath(baseDatabasePath, '/settings'),
                 event: 'settings',
diff --git a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/usage/[[period]]/+page.svelte b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/usage/[[period]]/+page.svelte
index 84c6ff2b72..3ef899e530 100644
--- a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/usage/[[period]]/+page.svelte
+++ b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/usage/[[period]]/+page.svelte
@@ -1,24 +1,5 @@
 <script lang="ts">
-    import { Container, UsageMultiple } from '$lib/layout';
-
-    export let data;
-
-    $: reads = data.databaseReads;
-    $: readsTotal = data.databaseReadsTotal;
-
-    $: writes = data.databaseWrites;
-    $: writesTotal = data.databaseWritesTotal;
+    import { Container } from '$lib/layout';
 </script>
 
-<Container databasesMainScreen>
-    <UsageMultiple
-        title="Reads and writes"
-        showHeader={false}
-        total={[readsTotal, writesTotal]}
-        count={[reads, writes]}
-        legendNumberFormat="abbreviate"
-        legendData={[
-            { name: 'Reads', value: readsTotal },
-            { name: 'Writes', value: writesTotal }
-        ]} />
-</Container>
+<Container></Container>
diff --git a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/usage/[[period]]/+page.ts b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/usage/[[period]]/+page.ts
index 9391c5451a..80b1ec6bf5 100644
--- a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/usage/[[period]]/+page.ts
+++ b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/usage/[[period]]/+page.ts
@@ -1,17 +1,3 @@
-import { isValueOfStringEnum } from '$lib/helpers/types';
-import { sdk } from '$lib/stores/sdk';
-import { UsageRange } from '@appwrite.io/console';
 import type { PageLoad } from './$types';
 
-export const load: PageLoad = async ({ params }) => {
-    const period = isValueOfStringEnum(UsageRange, params.period)
-        ? params.period
-        : UsageRange.ThirtyDays;
-
-    return {
-        ...(await sdk.forProject(params.region, params.project).tablesDB.getUsage({
-            databaseId: params.database,
-            range: period
-        }))
-    };
-};
+export const load: PageLoad = async () => ({});
diff --git a/src/routes/(console)/project-[region]-[project]/databases/header.svelte b/src/routes/(console)/project-[region]-[project]/databases/header.svelte
index 796c86d09f..edaaeb32ef 100644
--- a/src/routes/(console)/project-[region]-[project]/databases/header.svelte
+++ b/src/routes/(console)/project-[region]-[project]/databases/header.svelte
@@ -14,12 +14,6 @@
             title: 'Databases',
             event: 'databases',
             hasChildren: true
-        },
-        {
-            href: `${path}/usage`,
-            title: 'Usage',
-            event: 'usage',
-            hasChildren: true
         }
     ];
 </script>
diff --git a/src/routes/(console)/project-[region]-[project]/databases/usage/[[period]]/+page.svelte b/src/routes/(console)/project-[region]-[project]/databases/usage/[[period]]/+page.svelte
index b5b114d9af..3ef899e530 100644
--- a/src/routes/(console)/project-[region]-[project]/databases/usage/[[period]]/+page.svelte
+++ b/src/routes/(console)/project-[region]-[project]/databases/usage/[[period]]/+page.svelte
@@ -1,28 +1,5 @@
 <script lang="ts">
-    import { Container, UsageMultiple } from '$lib/layout';
-    import { Layout } from '@appwrite.io/pink-svelte';
-    import type { PageData } from './$types';
-
-    export let data: PageData;
-
-    $: reads = data.databasesReads;
-    $: readsTotal = data.databasesReadsTotal;
-
-    $: writes = data.databasesWrites;
-    $: writesTotal = data.databasesWritesTotal;
+    import { Container } from '$lib/layout';
 </script>
 
-<Container>
-    <Layout.Stack gap="l">
-        <UsageMultiple
-            title="Reads and writes"
-            showHeader={false}
-            total={[readsTotal, writesTotal]}
-            count={[reads, writes]}
-            legendNumberFormat="abbreviate"
-            legendData={[
-                { name: 'Reads', value: readsTotal },
-                { name: 'Writes', value: writesTotal }
-            ]} />
-    </Layout.Stack>
-</Container>
+<Container></Container>
diff --git a/src/routes/(console)/project-[region]-[project]/databases/usage/[[period]]/+page.ts b/src/routes/(console)/project-[region]-[project]/databases/usage/[[period]]/+page.ts
index 359a5153e0..80b1ec6bf5 100644
--- a/src/routes/(console)/project-[region]-[project]/databases/usage/[[period]]/+page.ts
+++ b/src/routes/(console)/project-[region]-[project]/databases/usage/[[period]]/+page.ts
@@ -1,16 +1,3 @@
-import { isValueOfStringEnum } from '$lib/helpers/types';
-import { sdk } from '$lib/stores/sdk';
-import { UsageRange } from '@appwrite.io/console';
 import type { PageLoad } from './$types';
 
-export const load: PageLoad = async ({ params }) => {
-    const period = isValueOfStringEnum(UsageRange, params.period)
-        ? params.period
-        : UsageRange.ThirtyDays;
-
-    return {
-        ...(await sdk
-            .forProject(params.region, params.project)
-            .tablesDB.listUsage({ range: period }))
-    };
-};
+export const load: PageLoad = async () => ({});

From ee6d36f516d95e5e3f6a37d7bb88d5e341ee7907 Mon Sep 17 00:00:00 2001
From: harsh mahajan <harshmahajan2345@gmail.com>
Date: Tue, 5 May 2026 00:23:39 +0530
Subject: [PATCH 5/5] Revert "fix: remove databases reads/writes usage tab and
 clear loaders"

This reverts commit 1f2aab991617f13068f7842346c65d6c13b77c9b.
---
 .../database-[database]/header.svelte         |  6 +++++
 .../usage/[[period]]/+page.svelte             | 23 ++++++++++++++--
 .../usage/[[period]]/+page.ts                 | 16 ++++++++++-
 .../databases/header.svelte                   |  6 +++++
 .../databases/usage/[[period]]/+page.svelte   | 27 +++++++++++++++++--
 .../databases/usage/[[period]]/+page.ts       | 15 ++++++++++-
 6 files changed, 87 insertions(+), 6 deletions(-)

diff --git a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/header.svelte b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/header.svelte
index 7bd3d0756a..1d3ded6c0d 100644
--- a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/header.svelte
+++ b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/header.svelte
@@ -34,6 +34,12 @@
                 event: 'backups',
                 hasChildren: true
             },
+            {
+                href: withPath(baseDatabasePath, '/usage'),
+                title: 'Usage',
+                event: 'usage',
+                hasChildren: true
+            },
             {
                 href: withPath(baseDatabasePath, '/settings'),
                 event: 'settings',
diff --git a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/usage/[[period]]/+page.svelte b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/usage/[[period]]/+page.svelte
index 3ef899e530..84c6ff2b72 100644
--- a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/usage/[[period]]/+page.svelte
+++ b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/usage/[[period]]/+page.svelte
@@ -1,5 +1,24 @@
 <script lang="ts">
-    import { Container } from '$lib/layout';
+    import { Container, UsageMultiple } from '$lib/layout';
+
+    export let data;
+
+    $: reads = data.databaseReads;
+    $: readsTotal = data.databaseReadsTotal;
+
+    $: writes = data.databaseWrites;
+    $: writesTotal = data.databaseWritesTotal;
 </script>
 
-<Container></Container>
+<Container databasesMainScreen>
+    <UsageMultiple
+        title="Reads and writes"
+        showHeader={false}
+        total={[readsTotal, writesTotal]}
+        count={[reads, writes]}
+        legendNumberFormat="abbreviate"
+        legendData={[
+            { name: 'Reads', value: readsTotal },
+            { name: 'Writes', value: writesTotal }
+        ]} />
+</Container>
diff --git a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/usage/[[period]]/+page.ts b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/usage/[[period]]/+page.ts
index 80b1ec6bf5..9391c5451a 100644
--- a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/usage/[[period]]/+page.ts
+++ b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/usage/[[period]]/+page.ts
@@ -1,3 +1,17 @@
+import { isValueOfStringEnum } from '$lib/helpers/types';
+import { sdk } from '$lib/stores/sdk';
+import { UsageRange } from '@appwrite.io/console';
 import type { PageLoad } from './$types';
 
-export const load: PageLoad = async () => ({});
+export const load: PageLoad = async ({ params }) => {
+    const period = isValueOfStringEnum(UsageRange, params.period)
+        ? params.period
+        : UsageRange.ThirtyDays;
+
+    return {
+        ...(await sdk.forProject(params.region, params.project).tablesDB.getUsage({
+            databaseId: params.database,
+            range: period
+        }))
+    };
+};
diff --git a/src/routes/(console)/project-[region]-[project]/databases/header.svelte b/src/routes/(console)/project-[region]-[project]/databases/header.svelte
index edaaeb32ef..796c86d09f 100644
--- a/src/routes/(console)/project-[region]-[project]/databases/header.svelte
+++ b/src/routes/(console)/project-[region]-[project]/databases/header.svelte
@@ -14,6 +14,12 @@
             title: 'Databases',
             event: 'databases',
             hasChildren: true
+        },
+        {
+            href: `${path}/usage`,
+            title: 'Usage',
+            event: 'usage',
+            hasChildren: true
         }
     ];
 </script>
diff --git a/src/routes/(console)/project-[region]-[project]/databases/usage/[[period]]/+page.svelte b/src/routes/(console)/project-[region]-[project]/databases/usage/[[period]]/+page.svelte
index 3ef899e530..b5b114d9af 100644
--- a/src/routes/(console)/project-[region]-[project]/databases/usage/[[period]]/+page.svelte
+++ b/src/routes/(console)/project-[region]-[project]/databases/usage/[[period]]/+page.svelte
@@ -1,5 +1,28 @@
 <script lang="ts">
-    import { Container } from '$lib/layout';
+    import { Container, UsageMultiple } from '$lib/layout';
+    import { Layout } from '@appwrite.io/pink-svelte';
+    import type { PageData } from './$types';
+
+    export let data: PageData;
+
+    $: reads = data.databasesReads;
+    $: readsTotal = data.databasesReadsTotal;
+
+    $: writes = data.databasesWrites;
+    $: writesTotal = data.databasesWritesTotal;
 </script>
 
-<Container></Container>
+<Container>
+    <Layout.Stack gap="l">
+        <UsageMultiple
+            title="Reads and writes"
+            showHeader={false}
+            total={[readsTotal, writesTotal]}
+            count={[reads, writes]}
+            legendNumberFormat="abbreviate"
+            legendData={[
+                { name: 'Reads', value: readsTotal },
+                { name: 'Writes', value: writesTotal }
+            ]} />
+    </Layout.Stack>
+</Container>
diff --git a/src/routes/(console)/project-[region]-[project]/databases/usage/[[period]]/+page.ts b/src/routes/(console)/project-[region]-[project]/databases/usage/[[period]]/+page.ts
index 80b1ec6bf5..359a5153e0 100644
--- a/src/routes/(console)/project-[region]-[project]/databases/usage/[[period]]/+page.ts
+++ b/src/routes/(console)/project-[region]-[project]/databases/usage/[[period]]/+page.ts
@@ -1,3 +1,16 @@
+import { isValueOfStringEnum } from '$lib/helpers/types';
+import { sdk } from '$lib/stores/sdk';
+import { UsageRange } from '@appwrite.io/console';
 import type { PageLoad } from './$types';
 
-export const load: PageLoad = async () => ({});
+export const load: PageLoad = async ({ params }) => {
+    const period = isValueOfStringEnum(UsageRange, params.period)
+        ? params.period
+        : UsageRange.ThirtyDays;
+
+    return {
+        ...(await sdk
+            .forProject(params.region, params.project)
+            .tablesDB.listUsage({ range: period }))
+    };
+};