@upstash/react-redis-browser 0.2.14-rc.7 → 0.2.14-rc.9

package/dist/index.mjs

@@ -1,5 +1,5 @@
 // src/components/databrowser/index.tsx
-import { useEffect as useEffect22, useMemo as useMemo12, useRef as useRef11 } from "react";
+import { useEffect as useEffect23, useMemo as useMemo12, useRef as useRef11 } from "react";
 
 // src/dark-mode-context.tsx
 import { createContext, useContext } from "react";
@@ -3167,7 +3167,7 @@ var portalRoot = root;
 var portalWrapper = wrapper;
 
 // src/components/databrowser/components/databrowser-instance.tsx
-import { useEffect as useEffect19, useState as useState25 } from "react";
+import { useEffect as useEffect20, useState as useState25 } from "react";
 import { Panel, PanelGroup, PanelResizeHandle } from "react-resizable-panels";
 
 // src/components/ui/segmented.tsx
@@ -3368,10 +3368,14 @@ function Toaster() {
 // src/components/databrowser/hooks/use-fetch-search-indexes.tsx
 import { useQuery } from "@tanstack/react-query";
 var FETCH_SEARCH_INDEXES_QUERY_KEY = "fetch-search-indexes";
-var useFetchSearchIndexes = (match) => {
+var useFetchSearchIndexes = ({
+  match,
+  enabled
+} = {}) => {
   const { redisNoPipeline: redis } = useRedis();
   return useQuery({
     queryKey: [FETCH_SEARCH_INDEXES_QUERY_KEY],
+    enabled: enabled ?? true,
     queryFn: async () => {
       let cursor = "0";
       const finalResult = [];
@@ -3434,7 +3438,8 @@ var SCAN_COUNTS = [100, 300, 500];
 var KeysProvider = ({ children }) => {
   const { active, search, valuesSearch, isValuesSearchSelected } = useTab();
   const { data: searchIndexDetails, isLoading: isIndexDetailsLoading } = useFetchSearchIndex(
-    valuesSearch.index
+    valuesSearch.index,
+    { enabled: isValuesSearchSelected }
   );
   const { redisNoPipeline: redis } = useRedis();
   const parsedValueQuery = parseJSObjectLiteral(valuesSearch.query);
@@ -6968,7 +6973,7 @@ var EditorDisplay = ({ dataKey, type }) => {
   const { data } = useFetchSimpleKey(dataKey, type);
   return /* @__PURE__ */ jsxs24("div", { className: "flex h-full w-full flex-col gap-2", children: [
     /* @__PURE__ */ jsx44(DisplayHeader, { dataKey, type, content: data ?? void 0 }),
-    /* @__PURE__ */ jsx44("div", { className: "flex h-full grow flex-col gap-2 rounded-md bg-zinc-100", children: data === void 0 ? /* @__PURE__ */ jsx44(Spinner, { isLoadingText: "", isLoading: true }) : data === null ? /* @__PURE__ */ jsx44(Fragment7, {}) : /* @__PURE__ */ jsx44(EditorDisplayForm, { dataKey, type, data }, dataKey) })
+    /* @__PURE__ */ jsx44("div", { className: "flex h-full grow flex-col gap-2 rounded-md", children: data === void 0 ? /* @__PURE__ */ jsx44(Spinner, { isLoadingText: "", isLoading: true }) : data === null ? /* @__PURE__ */ jsx44(Fragment7, {}) : /* @__PURE__ */ jsx44(EditorDisplayForm, { dataKey, type, data }, dataKey) })
   ] });
 };
 var EditorDisplayForm = ({
@@ -7015,14 +7020,14 @@ var DataDisplay = () => {
   const { selectedKey } = useTab();
   const { query } = useKeys();
   const type = useKeyType(selectedKey);
-  return /* @__PURE__ */ jsx45("div", { className: "h-full rounded-xl bg-zinc-100 p-5", children: !selectedKey ? /* @__PURE__ */ jsx45("div", {}) : !type ? query.isLoading ? /* @__PURE__ */ jsx45("div", { className: "flex h-full items-center justify-center", children: /* @__PURE__ */ jsx45("span", { className: "text-zinc-500", children: "Loading..." }) }) : /* @__PURE__ */ jsx45("div", {}) : !DATA_TYPES.includes(type) ? /* @__PURE__ */ jsx45("div", { className: "flex h-full items-center justify-center", children: /* @__PURE__ */ jsxs25("span", { className: "text-zinc-500", children: [
+  return /* @__PURE__ */ jsx45("div", { className: "h-full rounded-xl bg-zinc-100 p-5 dark:bg-zinc-200", children: !selectedKey ? /* @__PURE__ */ jsx45("div", {}) : !type ? query.isLoading ? /* @__PURE__ */ jsx45("div", { className: "flex h-full items-center justify-center", children: /* @__PURE__ */ jsx45("span", { className: "text-zinc-500", children: "Loading..." }) }) : /* @__PURE__ */ jsx45("div", {}) : !DATA_TYPES.includes(type) ? /* @__PURE__ */ jsx45("div", { className: "flex h-full items-center justify-center", children: /* @__PURE__ */ jsxs25("span", { className: "text-zinc-500", children: [
     "Unrecognized key type: ",
     type
   ] }) }) : /* @__PURE__ */ jsx45(Fragment8, { children: SIMPLE_DATA_TYPES.includes(type) ? /* @__PURE__ */ jsx45(EditorDisplay, { dataKey: selectedKey, type }) : type === "search" ? /* @__PURE__ */ jsx45(SearchDisplay, { indexName: selectedKey }) : /* @__PURE__ */ jsx45(ListDisplay, { dataKey: selectedKey, type }) }) });
 };
 
 // src/components/databrowser/components/header/index.tsx
-import { useState as useState14 } from "react";
+import { useEffect as useEffect15, useState as useState14 } from "react";
 import {
   IconChevronDown as IconChevronDown2,
   IconCircleCheck,
@@ -7186,7 +7191,7 @@ var EditIndexModal = ({
   ] }) });
 };
 
-// src/components/databrowser/components/sidebar/search-input.tsx
+// src/components/databrowser/components/header/search-input.tsx
 import { useEffect as useEffect14, useRef as useRef4, useState as useState13 } from "react";
 import { IconX as IconX2 } from "@tabler/icons-react";
 import { jsx as jsx50, jsxs as jsxs29 } from "react/jsx-runtime";
@@ -7311,11 +7316,15 @@ var SearchInput = () => {
   ] });
 };
 
-// src/components/databrowser/components/sidebar/type-selector.tsx
+// src/components/databrowser/components/header/type-selector.tsx
 import { jsx as jsx51, jsxs as jsxs30 } from "react/jsx-runtime";
 var ALL_TYPES_KEY = "all";
-function DataTypeSelector() {
+function DataTypeSelector({ allowSearch }) {
   const { search, setSearchType } = useTab();
+  const entries = [
+    [ALL_TYPES_KEY, "All Types"],
+    ...Object.entries(DATA_TYPE_NAMES).filter(([key]) => allowSearch || key !== "search")
+  ];
   return /* @__PURE__ */ jsxs30(
     Select,
     {
@@ -7329,13 +7338,7 @@ function DataTypeSelector() {
       value: search.type === void 0 ? ALL_TYPES_KEY : search.type,
       children: [
         /* @__PURE__ */ jsx51(SelectTrigger, { className: "!w-auto shrink-0 select-none whitespace-nowrap border-zinc-300 pr-8", children: /* @__PURE__ */ jsx51(SelectValue, {}) }),
-        /* @__PURE__ */ jsx51(SelectContent, { children: /* @__PURE__ */ jsx51(SelectGroup, { children: (() => {
-          const entries = [
-            [ALL_TYPES_KEY, "All Types"],
-            ...Object.entries(DATA_TYPE_NAMES)
-          ];
-          return entries.map(([key, value]) => /* @__PURE__ */ jsx51(SelectItem, { value: key, children: value }, key));
-        })() }) })
+        /* @__PURE__ */ jsx51(SelectContent, { children: /* @__PURE__ */ jsx51(SelectGroup, { children: entries.map(([key, value]) => /* @__PURE__ */ jsx51(SelectItem, { value: key, children: value }, key)) }) })
       ]
     }
   );
@@ -7343,7 +7346,7 @@ function DataTypeSelector() {
 
 // src/components/databrowser/components/header/index.tsx
 import { Fragment as Fragment9, jsx as jsx52, jsxs as jsxs31 } from "react/jsx-runtime";
-var Header = ({ tabType }) => {
+var Header = ({ tabType, allowSearch }) => {
   const { isValuesSearchSelected, setIsValuesSearchSelected } = useTab();
   return /* @__PURE__ */ jsxs31("div", { className: "flex items-center justify-between gap-1.5", children: [
     /* @__PURE__ */ jsxs31("div", { className: "flex grow items-center gap-1.5", children: [
@@ -7373,7 +7376,7 @@ var Header = ({ tabType }) => {
         }
       ),
       isValuesSearchSelected ? /* @__PURE__ */ jsx52(IndexSelector, {}) : /* @__PURE__ */ jsxs31(Fragment9, { children: [
-        /* @__PURE__ */ jsx52(DataTypeSelector, {}),
+        /* @__PURE__ */ jsx52(DataTypeSelector, { allowSearch }),
         /* @__PURE__ */ jsx52(SearchInput, {})
       ] })
     ] }),
@@ -7388,8 +7391,14 @@ var IndexSelector = () => {
     valuesSearch: { index },
     setValuesSearchIndex
   } = useTab();
-  const { data: indexes } = useFetchSearchIndexes();
+  const { data: indexes, isLoading } = useFetchSearchIndexes();
   const [open, setOpen] = useState14(false);
+  useEffect15(() => {
+    if (!indexes || isLoading) return;
+    if (index && !indexes.includes(index)) {
+      setValuesSearchIndex("");
+    }
+  }, [indexes, index, isLoading, setValuesSearchIndex]);
   const [search, setSearch] = useState14("");
   const [editingIndex, setEditingIndex] = useState14(null);
   const filteredIndexes = indexes?.filter((idx) => idx.toLowerCase().includes(search.toLowerCase()));
@@ -7559,6 +7568,9 @@ var HeaderError = () => {
   return /* @__PURE__ */ jsx53("p", { className: "text-sm text-red-600 dark:text-red-400", children: formatUpstashErrorMessage(query.error) });
 };
 
+// src/components/databrowser/components/query-builder.tsx
+import { IconExternalLink as IconExternalLink2 } from "@tabler/icons-react";
+
 // src/components/databrowser/components/search/query-editor.tsx
 import { useMemo as useMemo9 } from "react";
 
@@ -8186,31 +8198,46 @@ var QueryEditor = ({ value, onChange, height, schema }) => {
 };
 
 // src/components/databrowser/components/query-builder.tsx
-import { jsx as jsx55 } from "react/jsx-runtime";
+import { jsx as jsx55, jsxs as jsxs32 } from "react/jsx-runtime";
 var QueryBuilder = () => {
   const { valuesSearch, setValuesSearchQuery } = useTab();
   const { data: indexDetails } = useFetchSearchIndex(valuesSearch.index);
   const editorValue = PREFIX + (valuesSearch.query || "{}");
-  return /* @__PURE__ */ jsx55("div", { className: "h-full rounded-lg border border-zinc-300 bg-white px-[6px]", children: /* @__PURE__ */ jsx55(
-    QueryEditor,
-    {
-      value: editorValue,
-      onChange: (value) => {
-        const queryPart = value.slice(PREFIX.length);
-        setValuesSearchQuery(queryPart);
-      },
-      schema: indexDetails
-    }
-  ) });
+  return /* @__PURE__ */ jsxs32("div", { className: "flex h-full flex-col rounded-lg border border-zinc-300 bg-white px-[6px]", children: [
+    /* @__PURE__ */ jsx55("div", { className: "min-h-0 flex-1", children: /* @__PURE__ */ jsx55(
+      QueryEditor,
+      {
+        value: editorValue,
+        onChange: (value) => {
+          const queryPart = value.slice(PREFIX.length);
+          setValuesSearchQuery(queryPart);
+        },
+        schema: indexDetails
+      }
+    ) }),
+    /* @__PURE__ */ jsx55("div", { className: "flex items-center justify-end px-2 pb-1.5", children: /* @__PURE__ */ jsxs32(
+      "a",
+      {
+        href: "https://upstash-search.mintlify.app/redis/search/query-operators/boolean-operators/overview",
+        target: "_blank",
+        rel: "noopener noreferrer",
+        className: "flex items-center gap-1 text-xs text-zinc-400 transition-colors hover:text-zinc-600",
+        children: [
+          "Docs",
+          /* @__PURE__ */ jsx55(IconExternalLink2, { size: 12 })
+        ]
+      }
+    ) })
+  ] });
 };
 
 // src/components/databrowser/components/search-empty-state.tsx
 import { useState as useState16 } from "react";
-import { IconCode, IconDatabase, IconDownload, IconSearch as IconSearch3 } from "@tabler/icons-react";
+import { IconCode, IconDatabase, IconSearch as IconSearch3, IconSparkles } from "@tabler/icons-react";
 
 // src/components/databrowser/components/import-sample-dataset-modal.tsx
-import { useEffect as useEffect15, useState as useState15 } from "react";
-import { Fragment as Fragment10, jsx as jsx56, jsxs as jsxs32 } from "react/jsx-runtime";
+import { useEffect as useEffect16, useState as useState15 } from "react";
+import { Fragment as Fragment10, jsx as jsx56, jsxs as jsxs33 } from "react/jsx-runtime";
 var INDEX_NAME = "users-index";
 var USER_COUNT = 100;
 var firstNames = [
@@ -8347,7 +8374,7 @@ var ImportSampleDatasetModal = ({
   const [status, setStatus] = useState15();
   const [progress, setProgress] = useState15(0);
   const [error, setError] = useState15();
-  useEffect15(() => {
+  useEffect16(() => {
     if (!open) return;
     setProgress(0);
     setStatus(void 0);
@@ -8412,7 +8439,7 @@ var ImportSampleDatasetModal = ({
       onOpenChange: (isOpen) => {
         if (!isRunning) onOpenChange(isOpen);
       },
-      children: /* @__PURE__ */ jsxs32(
+      children: /* @__PURE__ */ jsxs33(
         DialogContent,
         {
           onInteractOutside: (e) => {
@@ -8422,9 +8449,9 @@ var ImportSampleDatasetModal = ({
             if (isRunning) e.preventDefault();
           },
           children: [
-            /* @__PURE__ */ jsxs32(DialogHeader, { children: [
+            /* @__PURE__ */ jsxs33(DialogHeader, { children: [
               /* @__PURE__ */ jsx56(DialogTitle, { children: "Import Sample Dataset" }),
-              !isRunning && !error && /* @__PURE__ */ jsxs32(DialogDescription, { children: [
+              !isRunning && !error && /* @__PURE__ */ jsxs33(DialogDescription, { children: [
                 "This will create a ",
                 /* @__PURE__ */ jsx56("strong", { children: "users-index" }),
                 " with 100 sample user records.",
@@ -8433,13 +8460,13 @@ var ImportSampleDatasetModal = ({
                 "Each user has name, age, gender, student/employment status, and contact information."
               ] })
             ] }),
-            isRunning && /* @__PURE__ */ jsxs32("div", { className: "flex flex-col gap-2 py-4", children: [
+            isRunning && /* @__PURE__ */ jsxs33("div", { className: "flex flex-col gap-2 py-4", children: [
               /* @__PURE__ */ jsx56("p", { className: "text-sm text-zinc-500", children: status }),
               /* @__PURE__ */ jsx56(Progress, { value: progress })
             ] }),
             error && /* @__PURE__ */ jsx56("div", { className: "w-full break-words text-sm text-red-500", children: formatUpstashErrorMessage(error) }),
-            /* @__PURE__ */ jsxs32(DialogFooter, { children: [
-              !isRunning && !error && /* @__PURE__ */ jsxs32(Fragment10, { children: [
+            /* @__PURE__ */ jsxs33(DialogFooter, { children: [
+              !isRunning && !error && /* @__PURE__ */ jsxs33(Fragment10, { children: [
                 /* @__PURE__ */ jsx56(Button, { onClick: () => onOpenChange(false), children: "Cancel" }),
                 /* @__PURE__ */ jsx56(Button, { variant: "primary", onClick: handleImport, children: "Import" })
               ] }),
@@ -8453,73 +8480,71 @@ var ImportSampleDatasetModal = ({
 };
 
 // src/components/databrowser/components/search-empty-state.tsx
-import { jsx as jsx57, jsxs as jsxs33 } from "react/jsx-runtime";
+import { jsx as jsx57, jsxs as jsxs34 } from "react/jsx-runtime";
 var SearchEmptyState = () => {
   const [importModalOpen, setImportModalOpen] = useState16(false);
-  return /* @__PURE__ */ jsxs33("div", { className: "flex flex-1 justify-center", children: [
-    /* @__PURE__ */ jsxs33("div", { className: "flex gap-8 rounded-xl border border-zinc-200 bg-gradient-to-b from-zinc-50 to-white p-8", children: [
-      /* @__PURE__ */ jsxs33("div", { className: "flex-1", children: [
-        /* @__PURE__ */ jsx57("h2", { className: "mb-2 text-lg font-semibold text-zinc-900", children: "Redis Search" }),
-        /* @__PURE__ */ jsx57("p", { className: "mb-6 max-w-md text-sm leading-relaxed text-zinc-600", children: "Redis Search allows you to create indexes on your existing keys and perform fast, full-text searches across your data." }),
-        /* @__PURE__ */ jsxs33("div", { className: "space-y-3", children: [
-          /* @__PURE__ */ jsx57("h3", { className: "text-xs font-medium uppercase tracking-wider text-zinc-400", children: "How it works" }),
-          /* @__PURE__ */ jsxs33("div", { className: "space-y-2.5", children: [
-            /* @__PURE__ */ jsxs33("div", { className: "flex items-start gap-3", children: [
-              /* @__PURE__ */ jsx57("div", { className: "flex h-7 w-7 shrink-0 items-center justify-center rounded-md bg-emerald-100 text-emerald-600", children: /* @__PURE__ */ jsx57(IconDatabase, { size: 16 }) }),
-              /* @__PURE__ */ jsxs33("div", { children: [
-                /* @__PURE__ */ jsx57("h4", { className: "text-sm font-medium text-zinc-900", children: "Store your data" }),
-                /* @__PURE__ */ jsx57("p", { className: "text-sm text-zinc-500", children: "Add documents as JSON, Hash, or String keys (string content must be valid JSON)." })
-              ] })
-            ] }),
-            /* @__PURE__ */ jsxs33("div", { className: "flex items-start gap-3", children: [
-              /* @__PURE__ */ jsx57("div", { className: "flex h-7 w-7 shrink-0 items-center justify-center rounded-md bg-emerald-100 text-emerald-600", children: /* @__PURE__ */ jsx57(IconCode, { size: 16 }) }),
-              /* @__PURE__ */ jsxs33("div", { children: [
-                /* @__PURE__ */ jsx57("h4", { className: "text-sm font-medium text-zinc-900", children: "Create an index" }),
-                /* @__PURE__ */ jsx57("p", { className: "text-sm text-zinc-500", children: "Define a search index specifying which fields to search on." })
-              ] })
-            ] }),
-            /* @__PURE__ */ jsxs33("div", { className: "flex items-start gap-3", children: [
-              /* @__PURE__ */ jsx57("div", { className: "flex h-7 w-7 shrink-0 items-center justify-center rounded-md bg-emerald-100 text-emerald-600", children: /* @__PURE__ */ jsx57(IconSearch3, { size: 16 }) }),
-              /* @__PURE__ */ jsxs33("div", { children: [
-                /* @__PURE__ */ jsx57("h4", { className: "text-sm font-medium text-zinc-900", children: "Search your data" }),
-                /* @__PURE__ */ jsx57("p", { className: "text-sm text-zinc-500", children: "Query with filters, full-text search, and sorted results." })
-              ] })
+  return /* @__PURE__ */ jsxs34("div", { className: "mx-auto flex h-full max-w-4xl gap-8 rounded-xl border border-zinc-200 bg-gradient-to-b from-zinc-50 to-white p-8", children: [
+    /* @__PURE__ */ jsx57(ImportSampleDatasetModal, { open: importModalOpen, onOpenChange: setImportModalOpen }),
+    /* @__PURE__ */ jsxs34("div", { className: "flex-1", children: [
+      /* @__PURE__ */ jsx57("h2", { className: "mb-2 text-lg font-semibold text-zinc-900", children: "Redis Search" }),
+      /* @__PURE__ */ jsx57("p", { className: "mb-6 max-w-md text-sm leading-relaxed text-zinc-600", children: "Redis Search allows you to create indexes on your existing keys and perform fast, full-text searches across your data." }),
+      /* @__PURE__ */ jsxs34("div", { className: "space-y-3", children: [
+        /* @__PURE__ */ jsx57("h3", { className: "text-xs font-medium uppercase tracking-wider text-zinc-400", children: "How it works" }),
+        /* @__PURE__ */ jsxs34("div", { className: "space-y-2.5", children: [
+          /* @__PURE__ */ jsxs34("div", { className: "flex items-start gap-3", children: [
+            /* @__PURE__ */ jsx57("div", { className: "flex h-7 w-7 shrink-0 items-center justify-center rounded-md bg-emerald-100 text-emerald-600", children: /* @__PURE__ */ jsx57(IconDatabase, { size: 16 }) }),
+            /* @__PURE__ */ jsxs34("div", { children: [
+              /* @__PURE__ */ jsx57("h4", { className: "text-sm font-medium text-zinc-900", children: "Store your data" }),
+              /* @__PURE__ */ jsx57("p", { className: "text-sm text-zinc-500", children: "Add documents as JSON, Hash, or String keys (string content must be valid JSON)." })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs34("div", { className: "flex items-start gap-3", children: [
+            /* @__PURE__ */ jsx57("div", { className: "flex h-7 w-7 shrink-0 items-center justify-center rounded-md bg-emerald-100 text-emerald-600", children: /* @__PURE__ */ jsx57(IconCode, { size: 16 }) }),
+            /* @__PURE__ */ jsxs34("div", { children: [
+              /* @__PURE__ */ jsx57("h4", { className: "text-sm font-medium text-zinc-900", children: "Create an index" }),
+              /* @__PURE__ */ jsx57("p", { className: "text-sm text-zinc-500", children: "Define a search index specifying which fields to search on." })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs34("div", { className: "flex items-start gap-3", children: [
+            /* @__PURE__ */ jsx57("div", { className: "flex h-7 w-7 shrink-0 items-center justify-center rounded-md bg-emerald-100 text-emerald-600", children: /* @__PURE__ */ jsx57(IconSearch3, { size: 16 }) }),
+            /* @__PURE__ */ jsxs34("div", { children: [
+              /* @__PURE__ */ jsx57("h4", { className: "text-sm font-medium text-zinc-900", children: "Search your data" }),
+              /* @__PURE__ */ jsx57("p", { className: "text-sm text-zinc-500", children: "Query with filters, full-text search, and sorted results." })
             ] })
           ] })
-        ] }),
-        /* @__PURE__ */ jsx57(
-          "a",
-          {
-            href: "https://upstash-search.mintlify.app/redis/search/introduction",
-            target: "_blank",
-            rel: "noopener noreferrer",
-            className: "mt-5 inline-block text-sm text-emerald-600 underline-offset-2 hover:underline",
-            children: "Learn more \u2192"
-          }
-        )
+        ] })
       ] }),
-      /* @__PURE__ */ jsxs33("div", { className: "flex w-72 flex-col items-center justify-center rounded-lg border border-dashed border-zinc-300 bg-white p-6", children: [
-        /* @__PURE__ */ jsx57("div", { className: "mb-4 flex h-12 w-12 items-center justify-center rounded-xl bg-zinc-100 text-zinc-500", children: /* @__PURE__ */ jsx57(IconDownload, { size: 24 }) }),
-        /* @__PURE__ */ jsx57("h3", { className: "mb-1 text-sm font-medium text-zinc-900", children: "Get started quickly" }),
-        /* @__PURE__ */ jsx57("p", { className: "mb-4 text-center text-xs text-zinc-500", children: "Import a sample dataset to try out Redis Search" }),
-        /* @__PURE__ */ jsx57(
-          "button",
-          {
-            onClick: () => setImportModalOpen(true),
-            className: "rounded-lg bg-zinc-900 px-4 py-2 text-sm font-medium text-white transition-colors hover:bg-zinc-800",
-            children: "Import a sample dataset"
-          }
-        )
-      ] })
+      /* @__PURE__ */ jsx57(
+        "a",
+        {
+          href: "https://upstash-search.mintlify.app/redis/search/introduction",
+          target: "_blank",
+          rel: "noopener noreferrer",
+          className: "mt-5 inline-block text-sm text-emerald-600 underline-offset-2 hover:underline",
+          children: "Learn more \u2192"
+        }
+      )
     ] }),
-    /* @__PURE__ */ jsx57(ImportSampleDatasetModal, { open: importModalOpen, onOpenChange: setImportModalOpen })
+    /* @__PURE__ */ jsxs34("div", { className: "flex w-72 flex-col items-center justify-center rounded-lg border bg-gradient-to-b from-zinc-50 to-white p-6 shadow-sm", children: [
+      /* @__PURE__ */ jsx57("div", { className: "mb-4 flex h-12 w-12 items-center justify-center rounded-xl bg-emerald-100 text-emerald-600", children: /* @__PURE__ */ jsx57(IconSparkles, { size: 24 }) }),
+      /* @__PURE__ */ jsx57("h3", { className: "mb-1 text-sm font-medium text-zinc-900", children: "Try it out" }),
+      /* @__PURE__ */ jsx57("p", { className: "mb-4 text-center text-xs text-zinc-500", children: "Load a sample dataset to explore Redis Search" }),
+      /* @__PURE__ */ jsx57(
+        "button",
+        {
+          onClick: () => setImportModalOpen(true),
+          className: "rounded-lg bg-emerald-600 px-4 py-2 text-sm font-medium text-white transition-colors hover:bg-emerald-700",
+          children: "Load sample data"
+        }
+      )
+    ] })
   ] });
 };
 
 // src/components/databrowser/components/sidebar/empty.tsx
-import { jsx as jsx58, jsxs as jsxs34 } from "react/jsx-runtime";
+import { jsx as jsx58, jsxs as jsxs35 } from "react/jsx-runtime";
 var Empty = () => {
-  return /* @__PURE__ */ jsx58("div", { className: "flex h-full w-full items-center justify-center rounded-md border bg-white px-4 py-6 text-center", children: /* @__PURE__ */ jsxs34("div", { className: "space-y-5", children: [
+  return /* @__PURE__ */ jsx58("div", { className: "flex h-full w-full items-center justify-center rounded-md border bg-white px-4 py-6 text-center", children: /* @__PURE__ */ jsxs35("div", { className: "space-y-5", children: [
     /* @__PURE__ */ jsx58("p", { className: "text-md font-medium", children: "Data on a break" }),
     /* @__PURE__ */ jsx58("p", { className: "text-balance text-center", children: '"Quick, lure it back with some CLI magic!"' })
   ] }) });
@@ -8532,8 +8557,8 @@ import { IconChevronRight as IconChevronRight3 } from "@tabler/icons-react";
 // src/components/databrowser/components/sidebar-context-menu.tsx
 import { useState as useState17 } from "react";
 import { ContextMenuSeparator as ContextMenuSeparator3 } from "@radix-ui/react-context-menu";
-import { IconCopy as IconCopy3, IconExternalLink as IconExternalLink2, IconTrash as IconTrash3 } from "@tabler/icons-react";
-import { Fragment as Fragment11, jsx as jsx59, jsxs as jsxs35 } from "react/jsx-runtime";
+import { IconCopy as IconCopy3, IconExternalLink as IconExternalLink3, IconTrash as IconTrash3 } from "@tabler/icons-react";
+import { Fragment as Fragment11, jsx as jsx59, jsxs as jsxs36 } from "react/jsx-runtime";
 var SidebarContextMenu = ({ children }) => {
   const { mutate: deleteKey } = useDeleteKey();
   const [isAlertOpen, setAlertOpen] = useState17(false);
@@ -8545,7 +8570,7 @@ var SidebarContextMenu = ({ children }) => {
     setSearch
   } = useDatabrowserStore();
   const { search: currentSearch, selectedKeys } = useTab();
-  return /* @__PURE__ */ jsxs35(Fragment11, { children: [
+  return /* @__PURE__ */ jsxs36(Fragment11, { children: [
     /* @__PURE__ */ jsx59(
       DeleteKeyModal,
       {
@@ -8562,7 +8587,7 @@ var SidebarContextMenu = ({ children }) => {
         }
       }
     ),
-    /* @__PURE__ */ jsxs35(ContextMenu, { modal: false, children: [
+    /* @__PURE__ */ jsxs36(ContextMenu, { modal: false, children: [
       /* @__PURE__ */ jsx59(
         ContextMenuTrigger,
         {
@@ -8583,8 +8608,8 @@ var SidebarContextMenu = ({ children }) => {
           children
         }
       ),
-      /* @__PURE__ */ jsxs35(ContextMenuContent, { children: [
-        /* @__PURE__ */ jsxs35(
+      /* @__PURE__ */ jsxs36(ContextMenuContent, { children: [
+        /* @__PURE__ */ jsxs36(
           ContextMenuItem,
           {
             onClick: () => {
@@ -8601,7 +8626,7 @@ var SidebarContextMenu = ({ children }) => {
             ]
           }
         ),
-        /* @__PURE__ */ jsxs35(
+        /* @__PURE__ */ jsxs36(
           ContextMenuItem,
           {
             onClick: () => {
@@ -8613,13 +8638,13 @@ var SidebarContextMenu = ({ children }) => {
             className: "gap-2",
             disabled: contextKeys.length !== 1,
             children: [
-              /* @__PURE__ */ jsx59(IconExternalLink2, { size: 16 }),
+              /* @__PURE__ */ jsx59(IconExternalLink3, { size: 16 }),
               "Open in new tab"
             ]
           }
         ),
         /* @__PURE__ */ jsx59(ContextMenuSeparator3, {}),
-        /* @__PURE__ */ jsxs35(ContextMenuItem, { onClick: () => setAlertOpen(true), className: "gap-2", children: [
+        /* @__PURE__ */ jsxs36(ContextMenuItem, { onClick: () => setAlertOpen(true), className: "gap-2", children: [
           /* @__PURE__ */ jsx59(IconTrash3, { size: 16 }),
           contextKeys.length > 1 ? `Delete ${contextKeys.length} keys` : "Delete key"
         ] })
@@ -8629,13 +8654,13 @@ var SidebarContextMenu = ({ children }) => {
 };
 
 // src/components/databrowser/components/sidebar/keys-list.tsx
-import { Fragment as Fragment13, jsx as jsx60, jsxs as jsxs36 } from "react/jsx-runtime";
+import { Fragment as Fragment13, jsx as jsx60, jsxs as jsxs37 } from "react/jsx-runtime";
 var KeysList = () => {
   const { keys } = useKeys();
   const lastClickedIndexRef = useRef5(null);
-  return /* @__PURE__ */ jsx60(SidebarContextMenu, { children: /* @__PURE__ */ jsxs36(Fragment13, { children: [
+  return /* @__PURE__ */ jsx60(SidebarContextMenu, { children: /* @__PURE__ */ jsxs37(Fragment13, { children: [
     /* @__PURE__ */ jsx60("div", { className: "h-px" }),
-    keys.map((data, i) => /* @__PURE__ */ jsxs36(Fragment12, { children: [
+    keys.map((data, i) => /* @__PURE__ */ jsxs37(Fragment12, { children: [
       /* @__PURE__ */ jsx60(
         KeyItem,
         {
@@ -8645,7 +8670,7 @@ var KeysList = () => {
           lastClickedIndexRef
         }
       ),
-      i !== keys.length - 1 && /* @__PURE__ */ jsx60("div", { className: "-z-10 mx-[13px] h-px bg-zinc-200 dark:bg-zinc-200" })
+      i !== keys.length - 1 && /* @__PURE__ */ jsx60("div", { className: "-z-10 mx-[13px] h-px bg-zinc-200 dark:bg-zinc-300" })
     ] }, data[0]))
   ] }) });
 };
@@ -8687,7 +8712,7 @@ var KeyItem = ({
       lastClickedIndexRef.current = index;
     }
   };
-  return /* @__PURE__ */ jsxs36(
+  return /* @__PURE__ */ jsxs37(
     "button",
     {
       "data-key": dataKey,
@@ -8709,9 +8734,9 @@ var KeyItem = ({
 };
 
 // src/components/databrowser/components/sidebar/skeleton-buttons.tsx
-import { jsx as jsx61, jsxs as jsxs37 } from "react/jsx-runtime";
+import { jsx as jsx61, jsxs as jsxs38 } from "react/jsx-runtime";
 var DEFAULT_SKELETON_COUNT = 6;
-var LoadingSkeleton = () => /* @__PURE__ */ jsx61("div", { className: "block h-full w-full rounded-lg bg-zinc-100 p-1 pr-3 transition-all", children: Array.from({ length: DEFAULT_SKELETON_COUNT }).fill(0).map((_, idx) => /* @__PURE__ */ jsxs37("div", { className: "flex h-10 items-center gap-2 px-3", children: [
+var LoadingSkeleton = () => /* @__PURE__ */ jsx61("div", { className: "block h-full w-full rounded-lg bg-zinc-100 p-1 pr-3 transition-all", children: Array.from({ length: DEFAULT_SKELETON_COUNT }).fill(0).map((_, idx) => /* @__PURE__ */ jsxs38("div", { className: "flex h-10 items-center gap-2 px-3", children: [
   /* @__PURE__ */ jsx61(Skeleton, { className: "size-5 shrink-0 rounded" }),
   /* @__PURE__ */ jsx61(Skeleton, { className: "h-4 grow rounded" })
 ] }, idx)) });
@@ -8727,7 +8752,7 @@ function Sidebar() {
       {
         query,
         disableRoundedInherit: true,
-        className: "min-h-0 rounded-xl bg-zinc-100 px-2 py-5 pr-4",
+        className: "min-h-0 rounded-xl bg-zinc-100 px-2 py-5 pr-4 dark:bg-zinc-200",
         scrollBarClassName: "py-5",
         children: /* @__PURE__ */ jsx62(KeysList, {})
       }
@@ -8736,7 +8761,7 @@ function Sidebar() {
 }
 
 // src/components/databrowser/components/ui-query-builder/ui-query-builder.tsx
-import { useCallback as useCallback4, useEffect as useEffect18, useRef as useRef8, useState as useState24 } from "react";
+import { useCallback as useCallback4, useEffect as useEffect19, useRef as useRef8, useState as useState24 } from "react";
 
 // src/components/databrowser/components/ui-query-builder/query-builder-context.tsx
 import { createContext as createContext6, useCallback as useCallback2, useContext as useContext6, useMemo as useMemo10 } from "react";
@@ -9270,7 +9295,7 @@ var DynamicWidthInput = ({
 };
 
 // src/components/databrowser/components/ui-query-builder/condition-common.tsx
-import { jsx as jsx65, jsxs as jsxs38 } from "react/jsx-runtime";
+import { jsx as jsx65, jsxs as jsxs39 } from "react/jsx-runtime";
 var BoostBadge = ({
   node,
   static: isStatic
@@ -9299,7 +9324,7 @@ var BoostBadge = ({
   const isNegative = (node.boost ?? 0) < 0;
   const labelBg = isNegative ? "bg-red-50" : "bg-purple-50";
   const textColor = isNegative ? "text-red-800" : "text-purple-800";
-  return /* @__PURE__ */ jsxs38("span", { className: "relative flex h-[26px] items-center overflow-hidden rounded-md border border-zinc-300 text-sm font-medium", children: [
+  return /* @__PURE__ */ jsxs39("span", { className: "relative flex h-[26px] items-center overflow-hidden rounded-md border border-zinc-300 text-sm font-medium", children: [
     /* @__PURE__ */ jsx65("span", { className: `flex h-full items-center px-2 ${labelBg} ${textColor}`, children: isNegative ? "Demote" : "Boost" }),
     isStatic ? /* @__PURE__ */ jsx65("span", { className: `px-2 ${textColor}`, children: node.boost }) : /* @__PURE__ */ jsx65("span", { className: "flex h-full items-center bg-white px-2", children: /* @__PURE__ */ jsx65(
       DynamicWidthInput,
@@ -9324,7 +9349,7 @@ var NodeActionsMenu = ({ node }) => {
   const handleToggleNot = () => {
     updateNode(node.id, { not: !node.not });
   };
-  return /* @__PURE__ */ jsxs38(DropdownMenu, { open, onOpenChange: setOpen, children: [
+  return /* @__PURE__ */ jsxs39(DropdownMenu, { open, onOpenChange: setOpen, children: [
     /* @__PURE__ */ jsx65(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsx65(
       "button",
       {
@@ -9333,8 +9358,8 @@ var NodeActionsMenu = ({ node }) => {
         children: /* @__PURE__ */ jsx65(IconDots, { size: 16 })
       }
     ) }),
-    /* @__PURE__ */ jsxs38(DropdownMenuContent, { align: "end", children: [
-      /* @__PURE__ */ jsx65(DropdownMenuItem, { onClick: handleToggleBoost, children: /* @__PURE__ */ jsxs38("div", { className: "flex items-center gap-2", children: [
+    /* @__PURE__ */ jsxs39(DropdownMenuContent, { align: "end", children: [
+      /* @__PURE__ */ jsx65(DropdownMenuItem, { onClick: handleToggleBoost, children: /* @__PURE__ */ jsxs39("div", { className: "flex items-center gap-2", children: [
         /* @__PURE__ */ jsx65(
           "div",
           {
@@ -9349,7 +9374,7 @@ var NodeActionsMenu = ({ node }) => {
         ),
         /* @__PURE__ */ jsx65("span", { children: "Boost" })
       ] }) }),
-      /* @__PURE__ */ jsx65(DropdownMenuItem, { onClick: handleToggleNot, children: /* @__PURE__ */ jsxs38("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsx65(DropdownMenuItem, { onClick: handleToggleNot, children: /* @__PURE__ */ jsxs39("div", { className: "flex items-center gap-2", children: [
         /* @__PURE__ */ jsx65(
           "div",
           {
@@ -9383,9 +9408,9 @@ import { DragOverlay as DndKitDragOverlay } from "@dnd-kit/core";
 import { IconGripVertical as IconGripVertical2 } from "@tabler/icons-react";
 
 // src/components/databrowser/components/ui-query-builder/query-condition.tsx
-import { useEffect as useEffect16, useState as useState20 } from "react";
+import { useEffect as useEffect17, useState as useState20 } from "react";
 import { IconGripVertical, IconX as IconX3 } from "@tabler/icons-react";
-import { Fragment as Fragment14, jsx as jsx66, jsxs as jsxs39 } from "react/jsx-runtime";
+import { Fragment as Fragment14, jsx as jsx66, jsxs as jsxs40 } from "react/jsx-runtime";
 var formatValueForDisplay = (value) => {
   if (Array.isArray(value)) {
     return value.join(", ");
@@ -9436,7 +9461,7 @@ var QueryCondition = ({
     return void 0;
   };
   const valueTypeError = getValueTypeError();
-  useEffect16(() => {
+  useEffect17(() => {
     if (currentFieldType === "boolean") {
       if (condition.value === "true") {
         updateNode(node.id, {
@@ -9606,7 +9631,7 @@ var QueryCondition = ({
   const filteredOperators = OPERATOR_OPTIONS.filter((op) => allowedOperators.includes(op.value));
   const isInvalidOperator = !isUnknownField && currentFieldType !== "unknown" && !allowedOperators.includes(condition.operator);
   const operatorError = isInvalidOperator ? `"${condition.operator}" is not valid for ${currentFieldType} fields` : void 0;
-  return /* @__PURE__ */ jsxs39("div", { className: "group/condition flex items-center gap-1 px-1", children: [
+  return /* @__PURE__ */ jsxs40("div", { className: "group/condition flex items-center gap-1 px-1", children: [
     /* @__PURE__ */ jsx66(
       "div",
       {
@@ -9617,8 +9642,8 @@ var QueryCondition = ({
         children: /* @__PURE__ */ jsx66(IconGripVertical, { size: 16 })
       }
     ),
-    /* @__PURE__ */ jsxs39("div", { className: "flex", children: [
-      /* @__PURE__ */ jsxs39(Select, { value: condition.field, onValueChange: handleFieldChange, children: [
+    /* @__PURE__ */ jsxs40("div", { className: "flex", children: [
+      /* @__PURE__ */ jsxs40(Select, { value: condition.field, onValueChange: handleFieldChange, children: [
         /* @__PURE__ */ jsx66(
           SimpleTooltip,
           {
@@ -9633,12 +9658,12 @@ var QueryCondition = ({
             )
           }
         ),
-        /* @__PURE__ */ jsxs39(SelectContent, { children: [
+        /* @__PURE__ */ jsxs40(SelectContent, { children: [
           isUnknownField && /* @__PURE__ */ jsx66(SelectItem, { value: condition.field, className: "text-red-500", children: condition.field }, condition.field),
           fieldNames.length > 0 ? fieldNames.map((field) => /* @__PURE__ */ jsx66(SelectItem, { value: field, children: field }, field)) : !isUnknownField && /* @__PURE__ */ jsx66("div", { className: "px-2 py-1.5 text-sm text-zinc-500", children: "No fields available" })
         ] })
       ] }),
-      /* @__PURE__ */ jsxs39(Select, { value: condition.operator, onValueChange: handleOperatorChange, children: [
+      /* @__PURE__ */ jsxs40(Select, { value: condition.operator, onValueChange: handleOperatorChange, children: [
         /* @__PURE__ */ jsx66(SimpleTooltip, { content: operatorError || valueTypeError, variant: "error", children: /* @__PURE__ */ jsx66(
           SelectTrigger,
           {
@@ -9646,7 +9671,7 @@ var QueryCondition = ({
             children: /* @__PURE__ */ jsx66(SelectValue, {})
           }
         ) }),
-        /* @__PURE__ */ jsxs39(SelectContent, { children: [
+        /* @__PURE__ */ jsxs40(SelectContent, { children: [
           isInvalidOperator && /* @__PURE__ */ jsx66(
             SelectItem,
             {
@@ -9659,8 +9684,8 @@ var QueryCondition = ({
           filteredOperators.map((op) => /* @__PURE__ */ jsx66(SelectItem, { value: op.value, children: op.label }, op.value))
         ] })
       ] }),
-      currentFieldType === "boolean" && condition.operator === "in" ? /* @__PURE__ */ jsxs39("div", { className: "flex h-[26px] items-center gap-2 rounded-none rounded-r-md border border-zinc-200 bg-white px-2 text-sm", children: [
-        /* @__PURE__ */ jsxs39("label", { className: "flex items-center gap-1", children: [
+      currentFieldType === "boolean" && condition.operator === "in" ? /* @__PURE__ */ jsxs40("div", { className: "flex h-[26px] items-center gap-2 rounded-none rounded-r-md border border-zinc-200 bg-white px-2 text-sm", children: [
+        /* @__PURE__ */ jsxs40("label", { className: "flex items-center gap-1", children: [
           /* @__PURE__ */ jsx66(
             "input",
             {
@@ -9679,7 +9704,7 @@ var QueryCondition = ({
           ),
           /* @__PURE__ */ jsx66("span", { children: "true" })
         ] }),
-        /* @__PURE__ */ jsxs39("label", { className: "flex items-center gap-1", children: [
+        /* @__PURE__ */ jsxs40("label", { className: "flex items-center gap-1", children: [
           /* @__PURE__ */ jsx66(
             "input",
             {
@@ -9698,7 +9723,7 @@ var QueryCondition = ({
           ),
           /* @__PURE__ */ jsx66("span", { children: "false" })
         ] })
-      ] }) : currentFieldType === "boolean" ? /* @__PURE__ */ jsxs39(
+      ] }) : currentFieldType === "boolean" ? /* @__PURE__ */ jsxs40(
         Select,
         {
           value: condition.value === true || condition.value === "true" ? "true" : condition.value === false || condition.value === "false" ? "false" : "true",
@@ -9711,7 +9736,7 @@ var QueryCondition = ({
           },
           children: [
             /* @__PURE__ */ jsx66(SelectTrigger, { className: "h-[26px] w-20 gap-3 rounded-none rounded-r-md border border-zinc-200 bg-white px-2 text-sm font-normal", children: /* @__PURE__ */ jsx66(SelectValue, {}) }),
-            /* @__PURE__ */ jsxs39(SelectContent, { children: [
+            /* @__PURE__ */ jsxs40(SelectContent, { children: [
               /* @__PURE__ */ jsx66(SelectItem, { value: "true", children: "true" }),
               /* @__PURE__ */ jsx66(SelectItem, { value: "false", children: "false" })
             ] })
@@ -9730,24 +9755,24 @@ var QueryCondition = ({
         }
       )
     ] }),
-    condition.operator === "fuzzy" && /* @__PURE__ */ jsxs39(
+    condition.operator === "fuzzy" && /* @__PURE__ */ jsxs40(
       Select,
       {
         value: String(condition.fuzzyDistance || 1),
         onValueChange: handleFuzzyDistanceChange,
         children: [
           /* @__PURE__ */ jsx66(SelectTrigger, { className: "h-[26px] w-16 gap-3 border-zinc-200 bg-white px-2 text-sm", children: /* @__PURE__ */ jsx66(SelectValue, {}) }),
-          /* @__PURE__ */ jsxs39(SelectContent, { children: [
+          /* @__PURE__ */ jsxs40(SelectContent, { children: [
             /* @__PURE__ */ jsx66(SelectItem, { value: "1", children: "1" }),
             /* @__PURE__ */ jsx66(SelectItem, { value: "2", children: "2" })
           ] })
         ]
       }
     ),
-    condition.operator === "phrase" && /* @__PURE__ */ jsxs39(Fragment14, { children: [
-      /* @__PURE__ */ jsxs39(Select, { value: phraseMode, onValueChange: handlePhraseModeChange, children: [
+    condition.operator === "phrase" && /* @__PURE__ */ jsxs40(Fragment14, { children: [
+      /* @__PURE__ */ jsxs40(Select, { value: phraseMode, onValueChange: handlePhraseModeChange, children: [
         /* @__PURE__ */ jsx66(SelectTrigger, { className: "h-[26px] w-20 gap-3 border-zinc-200 bg-white px-2 text-sm font-normal", children: /* @__PURE__ */ jsx66(SelectValue, {}) }),
-        /* @__PURE__ */ jsxs39(SelectContent, { children: [
+        /* @__PURE__ */ jsxs40(SelectContent, { children: [
           /* @__PURE__ */ jsx66(SelectItem, { value: "exact", children: "exact" }),
           /* @__PURE__ */ jsx66(SelectItem, { value: "slop", children: "slop" }),
           /* @__PURE__ */ jsx66(SelectItem, { value: "prefix", children: "prefix" })
@@ -9767,7 +9792,7 @@ var QueryCondition = ({
       )
     ] }),
     node.boost !== void 0 && /* @__PURE__ */ jsx66(BoostBadge, { node }),
-    /* @__PURE__ */ jsxs39(
+    /* @__PURE__ */ jsxs40(
       "div",
       {
         className: `flex items-center gap-1 transition-all duration-100 ${isDragging ? "opacity-0" : "-translate-x-[2px] opacity-0 group-hover/condition:translate-x-0 group-hover/condition:opacity-100 has-[[data-state=open]]:translate-x-0 has-[[data-state=open]]:opacity-100"}`,
@@ -9789,7 +9814,7 @@ var QueryCondition = ({
 };
 
 // src/components/databrowser/components/ui-query-builder/drag-overlay.tsx
-import { jsx as jsx67, jsxs as jsxs40 } from "react/jsx-runtime";
+import { jsx as jsx67, jsxs as jsxs41 } from "react/jsx-runtime";
 var QueryDragOverlay = ({
   activeNode,
   onDropAnimationComplete
@@ -9807,14 +9832,14 @@ var QueryDragOverlay = ({
           };
         }
       },
-      children: activeNode && activeNode.type === "condition" ? /* @__PURE__ */ jsxs40("div", { className: "relative -mt-1", children: [
+      children: activeNode && activeNode.type === "condition" ? /* @__PURE__ */ jsxs41("div", { className: "relative -mt-1", children: [
         /* @__PURE__ */ jsx67("div", { className: "drag-overlay-bg absolute -bottom-1 -top-1 left-0 right-0 rounded-md border border-zinc-300 bg-zinc-100/90 shadow-md" }),
         /* @__PURE__ */ jsx67("div", { className: "relative", children: /* @__PURE__ */ jsx67(QueryCondition, { node: activeNode, isDragging: true }) })
-      ] }) : activeNode && activeNode.type === "group" ? /* @__PURE__ */ jsxs40("div", { className: "relative", children: [
+      ] }) : activeNode && activeNode.type === "group" ? /* @__PURE__ */ jsxs41("div", { className: "relative", children: [
         /* @__PURE__ */ jsx67("div", { className: "drag-overlay-bg absolute -bottom-1 -top-1 left-0 right-0 rounded-md border border-zinc-300 bg-zinc-100/90 shadow-md" }),
-        /* @__PURE__ */ jsxs40("div", { className: "relative flex items-center gap-1", children: [
+        /* @__PURE__ */ jsxs41("div", { className: "relative flex items-center gap-1", children: [
           /* @__PURE__ */ jsx67("div", { className: "flex cursor-grab items-center text-zinc-400", children: /* @__PURE__ */ jsx67(IconGripVertical2, { size: 16 }) }),
-          /* @__PURE__ */ jsxs40("div", { className: "flex h-[26px] w-16 items-center justify-between rounded-md border border-zinc-300 bg-blue-50 px-2 text-sm font-medium capitalize text-zinc-700", children: [
+          /* @__PURE__ */ jsxs41("div", { className: "flex h-[26px] w-16 items-center justify-between rounded-md border border-zinc-300 bg-blue-50 px-2 text-sm font-medium capitalize text-zinc-700", children: [
             /* @__PURE__ */ jsx67("span", { children: activeNode.groupOperator === "and" ? "And" : "Or" }),
             /* @__PURE__ */ jsx67(
               "svg",
@@ -9848,7 +9873,7 @@ var QueryDragOverlay = ({
 };
 
 // src/components/databrowser/components/ui-query-builder/dnd-context.tsx
-import { jsx as jsx68, jsxs as jsxs41 } from "react/jsx-runtime";
+import { jsx as jsx68, jsxs as jsxs42 } from "react/jsx-runtime";
 var QueryDndProvider = ({
   children,
   rootNode,
@@ -9920,7 +9945,7 @@ var QueryDndProvider = ({
     moveNode(activeIdStr, targetGroupId, adjustedIndex);
   };
   const activeNode = activeId ? findNodeById(rootNode, String(activeId)) : null;
-  return /* @__PURE__ */ jsxs41(
+  return /* @__PURE__ */ jsxs42(
     DndContext,
     {
       sensors,
@@ -10027,14 +10052,14 @@ var EmptyGroupDropZone = ({ groupId, isOver }) => {
 };
 
 // src/components/databrowser/components/ui-query-builder/query-group.tsx
-import { Fragment as Fragment15, jsx as jsx71, jsxs as jsxs42 } from "react/jsx-runtime";
+import { Fragment as Fragment15, jsx as jsx71, jsxs as jsxs43 } from "react/jsx-runtime";
 var ChildRow = ({
   groupId,
   child,
   depth,
   activeOverId,
   droppingId
-}) => /* @__PURE__ */ jsxs42("div", { children: [
+}) => /* @__PURE__ */ jsxs43("div", { children: [
   /* @__PURE__ */ jsx71(
     DropIndicator,
     {
@@ -10075,8 +10100,8 @@ var InnerGroup = ({
   const handleDeleteGroup = () => {
     deleteNode(node.id);
   };
-  return /* @__PURE__ */ jsxs42("div", { children: [
-    /* @__PURE__ */ jsxs42("div", { className: "group/group flex items-center gap-1 px-1", children: [
+  return /* @__PURE__ */ jsxs43("div", { children: [
+    /* @__PURE__ */ jsxs43("div", { className: "group/group flex items-center gap-1 px-1", children: [
       !isRoot && /* @__PURE__ */ jsx71(
         "div",
         {
@@ -10087,29 +10112,30 @@ var InnerGroup = ({
           children: /* @__PURE__ */ jsx71(IconGripVertical3, { size: 16 })
         }
       ),
-      /* @__PURE__ */ jsxs42(Select, { value: node.groupOperator, onValueChange: handleOperatorChange, children: [
+      /* @__PURE__ */ jsxs43(Select, { value: node.groupOperator, onValueChange: handleOperatorChange, children: [
         /* @__PURE__ */ jsx71(SelectTrigger, { className: "h-[26px] w-16 gap-3 rounded-md border-zinc-300 bg-blue-50 px-2 text-sm font-medium capitalize text-zinc-700 [&>svg]:text-zinc-400", children: /* @__PURE__ */ jsx71(SelectValue, {}) }),
-        /* @__PURE__ */ jsxs42(SelectContent, { children: [
+        /* @__PURE__ */ jsxs43(SelectContent, { children: [
           /* @__PURE__ */ jsx71(SelectItem, { value: "and", children: "And" }),
           /* @__PURE__ */ jsx71(SelectItem, { value: "or", children: "Or" })
         ] })
       ] }),
-      /* @__PURE__ */ jsxs42(DropdownMenu, { children: [
+      /* @__PURE__ */ jsxs43(DropdownMenu, { children: [
         /* @__PURE__ */ jsx71(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsx71(
           "button",
           {
             type: "button",
-            className: "flex h-[26px] w-[26px] items-center justify-center rounded-md border border-zinc-300 text-zinc-500 transition-colors hover:text-zinc-700",
+            disabled: fieldInfos.length === 0,
+            className: "flex h-[26px] w-[26px] items-center justify-center rounded-md border border-zinc-300 text-zinc-500 transition-colors hover:text-zinc-700 disabled:cursor-not-allowed disabled:opacity-50",
             children: /* @__PURE__ */ jsx71(IconPlus4, { size: 16 })
           }
         ) }),
-        /* @__PURE__ */ jsxs42(DropdownMenuContent, { align: "start", children: [
+        /* @__PURE__ */ jsxs43(DropdownMenuContent, { align: "start", children: [
           /* @__PURE__ */ jsx71(DropdownMenuItem, { onClick: handleAddCondition, children: "Add Condition" }),
           /* @__PURE__ */ jsx71(DropdownMenuItem, { onClick: handleAddGroup, children: "Add Group" })
         ] })
       ] }),
       node.boost !== void 0 && /* @__PURE__ */ jsx71(BoostBadge, { node }),
-      !isRoot && /* @__PURE__ */ jsxs42(
+      !isRoot && /* @__PURE__ */ jsxs43(
         "div",
         {
           className: `flex -translate-x-[2px] items-center gap-1 opacity-0 transition-all duration-100 group-hover/group:translate-x-0 group-hover/group:opacity-100 has-[[data-state=open]]:translate-x-0 has-[[data-state=open]]:opacity-100`,
@@ -10128,7 +10154,7 @@ var InnerGroup = ({
         }
       )
     ] }),
-    /* @__PURE__ */ jsx71("div", { className: `min-h-[20px] ${isRoot ? "" : "ml-[15px] border-l-2 border-zinc-200 pl-3"}`, children: node.children.length === 0 ? /* @__PURE__ */ jsx71(EmptyGroupDropZone, { groupId: node.id, isOver: activeOverId === `drop-${node.id}-end` }) : /* @__PURE__ */ jsxs42(Fragment15, { children: [
+    /* @__PURE__ */ jsx71("div", { className: `min-h-[20px] ${isRoot ? "" : "ml-[15px] border-l-2 border-zinc-200 pl-3"}`, children: node.children.length === 0 ? /* @__PURE__ */ jsx71(EmptyGroupDropZone, { groupId: node.id, isOver: activeOverId === `drop-${node.id}-end` }) : /* @__PURE__ */ jsxs43(Fragment15, { children: [
       node.children.map(
         (child) => !child.not && /* @__PURE__ */ jsx71(
           ChildRow,
@@ -10142,9 +10168,9 @@ var InnerGroup = ({
           child.id
         )
       ),
-      node.children.some((child) => child.not) && /* @__PURE__ */ jsxs42(Tooltip, { delayDuration: 200, children: [
+      node.children.some((child) => child.not) && /* @__PURE__ */ jsxs43(Tooltip, { delayDuration: 200, children: [
         /* @__PURE__ */ jsx71(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx71("div", { className: "ml-2 mt-2 flex h-[26px] w-fit cursor-default select-none items-center rounded-md border border-zinc-300 bg-amber-50 px-2 text-sm font-medium capitalize text-amber-800", children: "Must Not" }) }),
-        /* @__PURE__ */ jsx71(TooltipContent, { side: "right", className: "max-w-xs", children: /* @__PURE__ */ jsxs42("p", { children: [
+        /* @__PURE__ */ jsx71(TooltipContent, { side: "right", className: "max-w-xs", children: /* @__PURE__ */ jsxs43("p", { children: [
           "Keys matching any of the conditions below are excluded from the results.",
           " ",
           /* @__PURE__ */ jsx71(
@@ -10219,7 +10245,7 @@ var QueryGroup = ({ node, isRoot = false, depth }) => {
 };
 
 // src/components/databrowser/components/ui-query-builder/use-query-state-sync.ts
-import { useCallback as useCallback3, useEffect as useEffect17, useRef as useRef7, useState as useState23 } from "react";
+import { useCallback as useCallback3, useEffect as useEffect18, useRef as useRef7, useState as useState23 } from "react";
 
 // src/components/databrowser/components/ui-query-builder/query-stringify.ts
 var jsonToJsLiteral = (json) => {
@@ -10349,7 +10375,7 @@ var useQueryStateSync = () => {
   });
   const lastSyncedQuery = useRef7(valuesSearch.query);
   const isOurUpdate = useRef7(false);
-  useEffect17(() => {
+  useEffect18(() => {
     if (isOurUpdate.current) {
       isOurUpdate.current = false;
       lastSyncedQuery.current = valuesSearch.query;
@@ -10383,14 +10409,14 @@ var useQueryStateSync = () => {
 };
 
 // src/components/databrowser/components/ui-query-builder/ui-query-builder.tsx
-import { jsx as jsx72, jsxs as jsxs43 } from "react/jsx-runtime";
+import { jsx as jsx72, jsxs as jsxs44 } from "react/jsx-runtime";
 var UIQueryBuilder = () => {
   const { valuesSearch } = useTab();
   const { data: indexDetails } = useFetchSearchIndex(valuesSearch.index);
   const { queryState, setQueryState } = useQueryStateSync();
   const fieldInfos = indexDetails?.schema ? extractFieldInfo(indexDetails.schema) : [];
   const hasNormalized = useRef8(false);
-  useEffect18(() => {
+  useEffect19(() => {
     if (hasNormalized.current || fieldInfos.length === 0) return;
     hasNormalized.current = true;
     setQueryState((state) => normalizeQueryState(state, fieldInfos));
@@ -10406,7 +10432,7 @@ var UIQueryBuilder = () => {
     setHasTopShadow(scrollTop > 0);
     setHasBottomShadow(scrollTop + clientHeight < scrollHeight - 1);
   }, []);
-  useEffect18(() => {
+  useEffect19(() => {
     viewportRef.current = scrollAreaRef.current?.querySelector(
       "[data-radix-scroll-area-viewport]"
     );
@@ -10417,7 +10443,7 @@ var UIQueryBuilder = () => {
     obs.observe(el);
     return () => obs.disconnect();
   }, [recomputeShadows]);
-  return /* @__PURE__ */ jsx72(QueryBuilderUIProvider, { fieldInfos, setQueryState, children: /* @__PURE__ */ jsxs43("div", { className: "relative h-full rounded-lg bg-zinc-50", children: [
+  return /* @__PURE__ */ jsx72(QueryBuilderUIProvider, { fieldInfos, setQueryState, children: /* @__PURE__ */ jsxs44("div", { className: "relative h-full rounded-lg bg-zinc-50", children: [
     /* @__PURE__ */ jsx72(
       "div",
       {
@@ -10510,7 +10536,7 @@ var extractFieldInfo = (schema) => {
 };
 
 // src/components/databrowser/components/databrowser-instance.tsx
-import { jsx as jsx73, jsxs as jsxs44 } from "react/jsx-runtime";
+import { jsx as jsx73, jsxs as jsxs45 } from "react/jsx-runtime";
 var PREFIX = "const query: Query = ";
 var QueryBuilderContent = () => {
   const { valuesSearch } = useTab();
@@ -10531,8 +10557,8 @@ var QueryBuilderContent = () => {
     }
     setMode(newMode);
   };
-  return /* @__PURE__ */ jsxs44("div", { children: [
-    /* @__PURE__ */ jsxs44("div", { className: "relative h-[200px] max-h-[40vh] min-h-[150px] resize-y overflow-hidden", children: [
+  return /* @__PURE__ */ jsxs45("div", { children: [
+    /* @__PURE__ */ jsxs45("div", { className: "relative h-[200px] max-h-[40vh] min-h-[150px] resize-y overflow-hidden", children: [
       /* @__PURE__ */ jsx73("div", { className: "absolute right-4 top-4 z-10", children: /* @__PURE__ */ jsx73(
         Segmented,
         {
@@ -10551,12 +10577,7 @@ var QueryBuilderContent = () => {
   ] });
 };
 var SearchContent = () => {
-  const { valuesSearch, setValuesSearchIndex } = useTab();
   const { data: indexes, isLoading } = useFetchSearchIndexes();
-  useEffect19(() => {
-    if (!indexes || isLoading) return;
-    if (valuesSearch.index && !indexes.includes(valuesSearch.index)) setValuesSearchIndex("");
-  }, [indexes, valuesSearch.index, isLoading, setValuesSearchIndex]);
   if (isLoading) {
     return null;
   }
@@ -10566,11 +10587,14 @@ var SearchContent = () => {
 };
 var DatabrowserInstance = ({
   hidden,
-  tabType
+  tabType,
+  allowSearch
 }) => {
   const { isValuesSearchSelected, setIsValuesSearchSelected } = useTab();
-  const { data: indexes, isLoading } = useFetchSearchIndexes();
-  useEffect19(() => {
+  const { data: indexes, isLoading } = useFetchSearchIndexes({
+    enabled: tabType === "search"
+  });
+  useEffect20(() => {
     if (tabType === "keys" && isValuesSearchSelected) {
       setIsValuesSearchSelected(false);
     } else if (tabType === "search" && !isValuesSearchSelected) {
@@ -10578,7 +10602,7 @@ var DatabrowserInstance = ({
     }
   }, [tabType, isValuesSearchSelected, setIsValuesSearchSelected]);
   const showEmptyState = isValuesSearchSelected && !isLoading && (!indexes || indexes.length === 0);
-  return /* @__PURE__ */ jsx73(KeysProvider, { children: /* @__PURE__ */ jsxs44(
+  return /* @__PURE__ */ jsx73(KeysProvider, { children: /* @__PURE__ */ jsxs45(
     "div",
     {
       className: cn(
@@ -10586,12 +10610,12 @@ var DatabrowserInstance = ({
         hidden && "hidden"
       ),
       children: [
-        /* @__PURE__ */ jsxs44("div", { className: "space-y-3 py-5", children: [
-          /* @__PURE__ */ jsx73(Header, { tabType }),
+        /* @__PURE__ */ jsxs45("div", { className: "space-y-3 py-5", children: [
+          /* @__PURE__ */ jsx73(Header, { tabType, allowSearch }),
           isValuesSearchSelected && !showEmptyState && /* @__PURE__ */ jsx73(SearchContent, {}),
           /* @__PURE__ */ jsx73(HeaderError, {})
         ] }),
-        showEmptyState ? /* @__PURE__ */ jsx73(SearchEmptyState, {}) : /* @__PURE__ */ jsxs44(
+        showEmptyState ? /* @__PURE__ */ jsx73(SearchEmptyState, {}) : /* @__PURE__ */ jsxs45(
           PanelGroup,
           {
             autoSaveId: "persistence",
@@ -10599,7 +10623,7 @@ var DatabrowserInstance = ({
             className: "h-full w-full text-sm antialiased",
             children: [
               /* @__PURE__ */ jsx73(Panel, { defaultSize: 30, minSize: 30, children: /* @__PURE__ */ jsx73(Sidebar, {}) }),
-              /* @__PURE__ */ jsxs44(PanelResizeHandle, { className: "group mx-[2px] flex h-full flex-col items-center justify-center gap-1 rounded-md px-[8px] transition-colors hover:bg-zinc-300/10", children: [
+              /* @__PURE__ */ jsxs45(PanelResizeHandle, { className: "group mx-[2px] flex h-full flex-col items-center justify-center gap-1 rounded-md px-[8px] transition-colors hover:bg-zinc-300/10", children: [
                 /* @__PURE__ */ jsx73("div", { className: "h-[3px] w-[3px] rounded-full bg-zinc-300" }),
                 /* @__PURE__ */ jsx73("div", { className: "h-[3px] w-[3px] rounded-full bg-zinc-300" }),
                 /* @__PURE__ */ jsx73("div", { className: "h-[3px] w-[3px] rounded-full bg-zinc-300" })
@@ -10615,7 +10639,7 @@ var DatabrowserInstance = ({
 };
 
 // src/components/databrowser/components/databrowser-tabs.tsx
-import { useCallback as useCallback6, useEffect as useEffect21, useMemo as useMemo11, useRef as useRef10, useState as useState27 } from "react";
+import { useCallback as useCallback6, useEffect as useEffect22, useMemo as useMemo11, useRef as useRef10, useState as useState27 } from "react";
 import {
   closestCenter,
   DndContext as DndContext2,
@@ -10633,7 +10657,7 @@ import { IconChevronDown as IconChevronDown3, IconPlus as IconPlus5, IconWindowM
 import * as React15 from "react";
 import { IconSearch as IconSearch4 } from "@tabler/icons-react";
 import { Command as CommandPrimitive } from "cmdk";
-import { jsx as jsx74, jsxs as jsxs45 } from "react/jsx-runtime";
+import { jsx as jsx74, jsxs as jsxs46 } from "react/jsx-runtime";
 var Command = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx74(
   CommandPrimitive,
   {
@@ -10646,7 +10670,7 @@ var Command = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__
   }
 ));
 Command.displayName = CommandPrimitive.displayName;
-var CommandInput = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxs45("div", { className: "flex items-center border-b px-3", "cmdk-input-wrapper": "", children: [
+var CommandInput = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxs46("div", { className: "flex items-center border-b px-3", "cmdk-input-wrapper": "", children: [
   /* @__PURE__ */ jsx74(IconSearch4, { className: "mr-2 h-4 w-4 shrink-0 opacity-50" }),
   /* @__PURE__ */ jsx74(
     CommandPrimitive.Input,
@@ -10721,7 +10745,7 @@ import {
 } from "@tabler/icons-react";
 
 // src/hooks/use-overflow.ts
-import { useCallback as useCallback5, useEffect as useEffect20, useRef as useRef9, useState as useState26 } from "react";
+import { useCallback as useCallback5, useEffect as useEffect21, useRef as useRef9, useState as useState26 } from "react";
 var useOverflow = () => {
   const [isOverflow, setIsOverflow] = useState26(false);
   const observerRef = useRef9(null);
@@ -10738,7 +10762,7 @@ var useOverflow = () => {
     });
     observerRef.current.observe(node);
   }, []);
-  useEffect20(() => {
+  useEffect21(() => {
     return () => {
       observerRef.current?.disconnect();
     };
@@ -10756,7 +10780,7 @@ function TabTypeIcon({ selectedKey }) {
 }
 
 // src/components/databrowser/components/tab.tsx
-import { jsx as jsx76, jsxs as jsxs46 } from "react/jsx-runtime";
+import { jsx as jsx76, jsxs as jsxs47 } from "react/jsx-runtime";
 var Tab = ({ id, isList }) => {
   const { active, search, selectedKey, valuesSearch, pinned, isValuesSearchSelected } = useTab();
   const {
@@ -10773,7 +10797,7 @@ var Tab = ({ id, isList }) => {
   const { ref, isOverflow } = useOverflow();
   const label = isValuesSearchSelected ? valuesSearch.index : search.key || selectedKey;
   const iconNode = isValuesSearchSelected ? /* @__PURE__ */ jsx76("div", { className: "flex h-[20px] w-[20px] items-center justify-center rounded-md bg-emerald-200 text-emerald-800", children: /* @__PURE__ */ jsx76(IconSearch5, { size: 14 }) }) : search.key ? /* @__PURE__ */ jsx76("div", { className: "flex h-[20px] w-[20px] items-center justify-center rounded-md bg-zinc-100 text-zinc-600", children: /* @__PURE__ */ jsx76(IconSearch5, { size: 14 }) }) : selectedKey ? /* @__PURE__ */ jsx76(TabTypeIcon, { selectedKey }) : void 0;
-  const tabNode = /* @__PURE__ */ jsxs46(
+  const tabNode = /* @__PURE__ */ jsxs47(
     "div",
     {
       id: isList ? `list-tab-${id}` : `tab-${id}`,
@@ -10808,33 +10832,33 @@ var Tab = ({ id, isList }) => {
       ]
     }
   );
-  return /* @__PURE__ */ jsxs46(ContextMenu, { children: [
+  return /* @__PURE__ */ jsxs47(ContextMenu, { children: [
     /* @__PURE__ */ jsx76(SimpleTooltip, { content: isOverflow ? label : void 0, children: /* @__PURE__ */ jsx76(ContextMenuTrigger, { asChild: true, children: tabNode }) }),
-    /* @__PURE__ */ jsxs46(
+    /* @__PURE__ */ jsxs47(
       ContextMenuContent,
       {
         onClick: (e) => {
           e.stopPropagation();
         },
         children: [
-          /* @__PURE__ */ jsxs46(ContextMenuItem, { onSelect: () => togglePinTab(id), className: "gap-2", children: [
+          /* @__PURE__ */ jsxs47(ContextMenuItem, { onSelect: () => togglePinTab(id), className: "gap-2", children: [
             /* @__PURE__ */ jsx76(IconPin, { size: 16 }),
             pinned ? "Unpin Tab" : "Pin Tab"
           ] }),
-          /* @__PURE__ */ jsxs46(ContextMenuItem, { onSelect: () => duplicateTab(id), className: "gap-2", children: [
+          /* @__PURE__ */ jsxs47(ContextMenuItem, { onSelect: () => duplicateTab(id), className: "gap-2", children: [
             /* @__PURE__ */ jsx76(IconCopyPlus, { size: 16 }),
             "Duplicate Tab"
           ] }),
           /* @__PURE__ */ jsx76(ContextMenuSeparator, {}),
-          /* @__PURE__ */ jsxs46(ContextMenuItem, { onSelect: () => forceRemoveTab(id), className: "gap-2", children: [
+          /* @__PURE__ */ jsxs47(ContextMenuItem, { onSelect: () => forceRemoveTab(id), className: "gap-2", children: [
             /* @__PURE__ */ jsx76(IconX5, { size: 16 }),
             "Close Tab"
           ] }),
-          /* @__PURE__ */ jsxs46(ContextMenuItem, { onSelect: () => closeOtherTabs(id), className: "gap-2", children: [
+          /* @__PURE__ */ jsxs47(ContextMenuItem, { onSelect: () => closeOtherTabs(id), className: "gap-2", children: [
             /* @__PURE__ */ jsx76(IconSquareX, { size: 16 }),
             "Close Other Tabs"
           ] }),
-          /* @__PURE__ */ jsxs46(
+          /* @__PURE__ */ jsxs47(
             ContextMenuItem,
             {
               onSelect: () => closeAllButPinned(),
@@ -10853,7 +10877,7 @@ var Tab = ({ id, isList }) => {
 };
 
 // src/components/databrowser/components/databrowser-tabs.tsx
-import { jsx as jsx77, jsxs as jsxs47 } from "react/jsx-runtime";
+import { jsx as jsx77, jsxs as jsxs48 } from "react/jsx-runtime";
 var SortableTab = ({ id }) => {
   const [originalWidth, setOriginalWidth] = useState27(null);
   const textRef = useRef10(null);
@@ -10880,7 +10904,7 @@ var SortableTab = ({ id }) => {
     }
     setNodeRef(element);
   };
-  useEffect21(() => {
+  useEffect22(() => {
     if (textRef.current && isDragging) {
       const originalMaxWidth = textRef.current.style.maxWidth;
       const originalWhiteSpace = textRef.current.style.whiteSpace;
@@ -10900,7 +10924,7 @@ var SortableTab = ({ id }) => {
       };
     }
   }, [isDragging]);
-  useEffect21(() => {
+  useEffect22(() => {
     const resizeObserver = new ResizeObserver((entries) => {
       if (entries[0]) {
         setOriginalWidth(entries[0].contentRect.width);
@@ -10946,7 +10970,7 @@ var DatabrowserTabs = ({ onFullScreenClick }) => {
   const [hasLeftShadow, setHasLeftShadow] = useState27(false);
   const [hasRightShadow, setHasRightShadow] = useState27(false);
   const [isOverflow, setIsOverflow] = useState27(false);
-  useEffect21(() => {
+  useEffect22(() => {
     const el = scrollRef.current;
     if (!el) return;
     const onWheel = (event) => {
@@ -10976,7 +11000,7 @@ var DatabrowserTabs = ({ onFullScreenClick }) => {
     setHasRightShadow(scrollLeft + clientWidth < scrollWidth - 1);
     setIsOverflow(scrollWidth > clientWidth + 1);
   }, []);
-  useEffect21(() => {
+  useEffect22(() => {
     recomputeShadows();
     const el = scrollRef.current;
     if (!el) return;
@@ -11004,8 +11028,8 @@ var DatabrowserTabs = ({ onFullScreenClick }) => {
       reorderTabs(oldIndex, newIndex);
     }
   };
-  return /* @__PURE__ */ jsx77("div", { className: "relative shrink-0 overflow-hidden rounded-t-lg bg-zinc-300", children: /* @__PURE__ */ jsxs47("div", { className: "flex items-center gap-1", children: [
-    /* @__PURE__ */ jsxs47("div", { className: "relative min-w-0 flex-1", children: [
+  return /* @__PURE__ */ jsx77("div", { className: "relative shrink-0 overflow-hidden rounded-t-lg bg-zinc-300", children: /* @__PURE__ */ jsxs48("div", { className: "flex items-center gap-1", children: [
+    /* @__PURE__ */ jsxs48("div", { className: "relative min-w-0 flex-1", children: [
       /* @__PURE__ */ jsx77(
         "div",
         {
@@ -11018,7 +11042,7 @@ var DatabrowserTabs = ({ onFullScreenClick }) => {
           className: `tabs-shadow-right pointer-events-none absolute right-0 top-0 z-10 h-full w-6 transition-opacity duration-200 ${hasRightShadow ? "opacity-100" : "opacity-0"}`
         }
       ),
-      /* @__PURE__ */ jsxs47(
+      /* @__PURE__ */ jsxs48(
         "div",
         {
           ref: scrollRef,
@@ -11052,7 +11076,7 @@ var DatabrowserTabs = ({ onFullScreenClick }) => {
         }
       )
     ] }),
-    /* @__PURE__ */ jsxs47("div", { className: "flex items-center gap-1 pl-1", children: [
+    /* @__PURE__ */ jsxs48("div", { className: "flex items-center gap-1 pl-1", children: [
       isOverflow && /* @__PURE__ */ jsx77(AddTabButton, {}),
       tabs.length > 1 && /* @__PURE__ */ jsx77(TabsListButton, { tabs, onSelectTab: selectTab }),
       onFullScreenClick && /* @__PURE__ */ jsx77(
@@ -11115,8 +11139,8 @@ function TabsListButton({
       tab.scrollIntoView({ behavior: "smooth" });
     }, 20);
   };
-  return /* @__PURE__ */ jsxs47(Popover, { open, onOpenChange: setOpen, children: [
-    /* @__PURE__ */ jsx77(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs47(
+  return /* @__PURE__ */ jsxs48(Popover, { open, onOpenChange: setOpen, children: [
+    /* @__PURE__ */ jsx77(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs48(
       Button,
       {
         variant: "secondary",
@@ -11129,7 +11153,7 @@ function TabsListButton({
         ]
       }
     ) }),
-    /* @__PURE__ */ jsx77(PopoverContent, { className: "w-96 p-0", align: "end", children: /* @__PURE__ */ jsx77(Command, { children: /* @__PURE__ */ jsxs47(CommandList, { children: [
+    /* @__PURE__ */ jsx77(PopoverContent, { className: "w-96 p-0", align: "end", children: /* @__PURE__ */ jsx77(Command, { children: /* @__PURE__ */ jsxs48(CommandList, { children: [
       /* @__PURE__ */ jsx77(CommandEmpty, { children: "No tabs" }),
       /* @__PURE__ */ jsx77(CommandGroup, { children: sorted.map(([_id, item]) => /* @__PURE__ */ jsx77(
         CommandItem,
@@ -11150,7 +11174,7 @@ function TabsListButton({
 }
 
 // src/components/databrowser/index.tsx
-import { jsx as jsx78, jsxs as jsxs48 } from "react/jsx-runtime";
+import { jsx as jsx78, jsxs as jsxs49 } from "react/jsx-runtime";
 var RedisBrowser = ({
   url,
   token,
@@ -11159,16 +11183,18 @@ var RedisBrowser = ({
   storage,
   disableTelemetry,
   onFullScreenClick,
-  theme = "light"
+  theme = "light",
+  allowSearch = false
 }) => {
   const credentials = useMemo12(() => ({ token, url }), [token, url]);
   const rootRef = useRef11(null);
-  useEffect22(() => {
+  useEffect23(() => {
     queryClient.resetQueries();
   }, [credentials.url]);
   return /* @__PURE__ */ jsx78(QueryClientProvider, { client: queryClient, children: /* @__PURE__ */ jsx78(RedisProvider, { redisCredentials: credentials, telemetry: !disableTelemetry, children: /* @__PURE__ */ jsx78(DarkModeProvider, { theme, children: /* @__PURE__ */ jsx78(DatabrowserProvider, { storage, rootRef, children: /* @__PURE__ */ jsx78(TooltipProvider, { children: /* @__PURE__ */ jsx78(
     RedisBrowserRoot,
     {
+      allowSearch,
       hideTabs,
       tabType,
       rootRef,
@@ -11179,11 +11205,12 @@ var RedisBrowser = ({
 var RedisBrowserRoot = ({
   hideTabs,
   tabType,
+  allowSearch,
   rootRef,
   onFullScreenClick
 }) => {
   const theme = useTheme();
-  useEffect22(() => {
+  useEffect23(() => {
     portalWrapper.classList.add("text-zinc-700");
     portalWrapper.classList.toggle("dark", theme === "dark");
   }, [theme]);
@@ -11195,22 +11222,32 @@ var RedisBrowserRoot = ({
         className: `ups-db ${theme === "dark" ? "dark" : ""}`,
         style: { height: "100%" },
         ref: rootRef,
-        children: /* @__PURE__ */ jsxs48("div", { className: "flex h-full flex-col overflow-hidden rounded-[14px] border-[4px] border-zinc-300 text-zinc-700", children: [
+        children: /* @__PURE__ */ jsxs49("div", { className: "flex h-full flex-col overflow-hidden rounded-[14px] border-[4px] border-zinc-300 text-zinc-700", children: [
           !hideTabs && /* @__PURE__ */ jsx78(DatabrowserTabs, { onFullScreenClick }),
-          /* @__PURE__ */ jsx78(DatabrowserInstances, { tabType })
+          /* @__PURE__ */ jsx78(DatabrowserInstances, { tabType, allowSearch })
         ] })
       }
     )
   );
 };
-var DatabrowserInstances = ({ tabType }) => {
+var DatabrowserInstances = ({
+  tabType,
+  allowSearch
+}) => {
   const { tabs, selectedTab, selectTab, addTab } = useDatabrowserStore();
-  useEffect22(() => {
+  useEffect23(() => {
     if (tabs.length === 0) addTab();
     else if (!selectedTab) selectTab(tabs[0][0]);
   }, [tabs, selectedTab, addTab, selectTab]);
   if (!selectedTab) return;
-  return tabs.map(([id]) => /* @__PURE__ */ jsx78(TabIdProvider, { value: id, children: /* @__PURE__ */ jsx78(DatabrowserInstance, { hidden: id !== selectedTab, tabType }) }, id));
+  return tabs.map(([id]) => /* @__PURE__ */ jsx78(TabIdProvider, { value: id, children: /* @__PURE__ */ jsx78(
+    DatabrowserInstance,
+    {
+      hidden: id !== selectedTab,
+      tabType,
+      allowSearch
+    }
+  ) }, id));
 };
 export {
   RedisBrowser