From c001ad597f68b261eaf4c706817c2eac59761db4 Mon Sep 17 00:00:00 2001
From: "A.Shakhmatov" <dev@shakhmatov.com>
Date: Fri, 13 Feb 2026 18:32:18 +0300
Subject: [PATCH] feat: add schema caching with 5-min staleTime and refresh
 button

Reduce unnecessary re-fetches on large DWH by caching schema/management
queries for 5 minutes, and add a refresh button in the sidebar to
force-reload when needed.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 src/components/layout/Sidebar.tsx | 37 ++++++++++++++++++++++++++++---
 src/hooks/use-management.ts       |  3 +++
 src/hooks/use-schema.ts           |  7 ++++++
 3 files changed, 44 insertions(+), 3 deletions(-)

diff --git a/src/components/layout/Sidebar.tsx b/src/components/layout/Sidebar.tsx
index abcaa4d..06122b3 100644
--- a/src/components/layout/Sidebar.tsx
+++ b/src/components/layout/Sidebar.tsx
@@ -1,16 +1,35 @@
 import { useState } from "react";
+import { useQueryClient } from "@tanstack/react-query";
 import { Input } from "@/components/ui/input";
+import { Button } from "@/components/ui/button";
+import {
+  Tooltip,
+  TooltipContent,
+  TooltipTrigger,
+} from "@/components/ui/tooltip";
 import { SchemaTree } from "@/components/schema/SchemaTree";
 import { HistoryPanel } from "@/components/history/HistoryPanel";
 import { SavedQueriesPanel } from "@/components/saved-queries/SavedQueriesPanel";
 import { AdminPanel } from "@/components/management/AdminPanel";
-import { Search } from "lucide-react";
+import { Search, RefreshCw } from "lucide-react";
 
 type SidebarView = "schema" | "history" | "saved" | "admin";
 
+const SCHEMA_QUERY_KEYS = [
+  "databases", "schemas", "tables", "views",
+  "functions", "sequences", "completionSchema", "column-details",
+];
+
 export function Sidebar() {
   const [view, setView] = useState<SidebarView>("schema");
   const [search, setSearch] = useState("");
+  const queryClient = useQueryClient();
+
+  const handleRefreshSchema = () => {
+    for (const key of SCHEMA_QUERY_KEYS) {
+      queryClient.invalidateQueries({ queryKey: [key] });
+    }
+  };
 
   return (
     <div className="flex h-full flex-col bg-card">
@@ -59,8 +78,8 @@ export function Sidebar() {
 
       {view === "schema" ? (
         <>
-          <div className="p-2">
-            <div className="relative">
+          <div className="flex items-center gap-1 p-2">
+            <div className="relative flex-1">
               <Search className="absolute left-2 top-1/2 h-3.5 w-3.5 -translate-y-1/2 text-muted-foreground" />
               <Input
                 placeholder="Search objects..."
@@ -69,6 +88,18 @@ export function Sidebar() {
                 onChange={(e) => setSearch(e.target.value)}
               />
             </div>
+            <Tooltip>
+              <TooltipTrigger asChild>
+                <Button
+                  variant="ghost"
+                  size="icon-xs"
+                  onClick={handleRefreshSchema}
+                >
+                  <RefreshCw className="h-3.5 w-3.5" />
+                </Button>
+              </TooltipTrigger>
+              <TooltipContent side="bottom">Refresh schema</TooltipContent>
+            </Tooltip>
           </div>
           <div className="min-h-0 flex-1 overflow-y-auto overflow-x-hidden">
             <SchemaTree />
diff --git a/src/hooks/use-management.ts b/src/hooks/use-management.ts
index 66fb296..91390ee 100644
--- a/src/hooks/use-management.ts
+++ b/src/hooks/use-management.ts
@@ -29,6 +29,7 @@ export function useDatabaseInfo(connectionId: string | null) {
     queryKey: ["databaseInfo", connectionId],
     queryFn: () => getDatabaseInfo(connectionId!),
     enabled: !!connectionId,
+    staleTime: 5 * 60 * 1000,
   });
 }
 
@@ -37,6 +38,7 @@ export function useRoles(connectionId: string | null) {
     queryKey: ["roles", connectionId],
     queryFn: () => listRoles(connectionId!),
     enabled: !!connectionId,
+    staleTime: 5 * 60 * 1000,
   });
 }
 
@@ -49,6 +51,7 @@ export function useTablePrivileges(
     queryKey: ["tablePrivileges", connectionId, schema, table],
     queryFn: () => getTablePrivileges(connectionId!, schema!, table!),
     enabled: !!connectionId && !!schema && !!table,
+    staleTime: 5 * 60 * 1000,
   });
 }
 
diff --git a/src/hooks/use-schema.ts b/src/hooks/use-schema.ts
index 02b4548..d3b6a8c 100644
--- a/src/hooks/use-schema.ts
+++ b/src/hooks/use-schema.ts
@@ -16,6 +16,7 @@ export function useDatabases(connectionId: string | null) {
     queryKey: ["databases", connectionId],
     queryFn: () => listDatabases(connectionId!),
     enabled: !!connectionId,
+    staleTime: 5 * 60 * 1000,
   });
 }
 
@@ -39,6 +40,7 @@ export function useSchemas(connectionId: string | null) {
     queryKey: ["schemas", connectionId],
     queryFn: () => listSchemas(connectionId!),
     enabled: !!connectionId,
+    staleTime: 5 * 60 * 1000,
   });
 }
 
@@ -47,6 +49,7 @@ export function useTables(connectionId: string | null, schema: string) {
     queryKey: ["tables", connectionId, schema],
     queryFn: () => listTables(connectionId!, schema),
     enabled: !!connectionId && !!schema,
+    staleTime: 5 * 60 * 1000,
   });
 }
 
@@ -55,6 +58,7 @@ export function useViews(connectionId: string | null, schema: string) {
     queryKey: ["views", connectionId, schema],
     queryFn: () => listViews(connectionId!, schema),
     enabled: !!connectionId && !!schema,
+    staleTime: 5 * 60 * 1000,
   });
 }
 
@@ -63,6 +67,7 @@ export function useFunctions(connectionId: string | null, schema: string) {
     queryKey: ["functions", connectionId, schema],
     queryFn: () => listFunctions(connectionId!, schema),
     enabled: !!connectionId && !!schema,
+    staleTime: 5 * 60 * 1000,
   });
 }
 
@@ -71,6 +76,7 @@ export function useSequences(connectionId: string | null, schema: string) {
     queryKey: ["sequences", connectionId, schema],
     queryFn: () => listSequences(connectionId!, schema),
     enabled: !!connectionId && !!schema,
+    staleTime: 5 * 60 * 1000,
   });
 }
 
@@ -79,5 +85,6 @@ export function useColumnDetails(connectionId: string | null, schema: string | n
     queryKey: ["column-details", connectionId, schema, table],
     queryFn: () => getColumnDetails(connectionId!, schema!, table!),
     enabled: !!connectionId && !!schema && !!table,
+    staleTime: 5 * 60 * 1000,
   });
 }