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

package/dist/index.js

@@ -2665,6 +2665,48 @@ function formatTime(seconds) {
   return parts.slice(0, 1).join(" ");
 }
 var isTest = typeof window !== "undefined" && window.__PLAYWRIGHT__ === true;
+var jsonToJsLiteral = (json) => {
+  return json.replaceAll(/"([$A-Z_a-z][\w$]*)"\s*:/g, "$1:");
+};
+var MAX_INLINE_KEYS = 2;
+var isInlineable = (value) => {
+  if (typeof value !== "object" || value === null) return true;
+  if (Array.isArray(value)) return value.every((v) => typeof v !== "object" || v === null);
+  const entries = Object.entries(value);
+  return entries.length <= MAX_INLINE_KEYS && entries.every(([, v]) => typeof v !== "object" || v === null);
+};
+var prettyPrint = (value, indent) => {
+  if (value === void 0 || value === null) return String(value);
+  if (typeof value !== "object") return JSON.stringify(value);
+  const prefix = "  ".repeat(indent);
+  const childPrefix = "  ".repeat(indent + 1);
+  if (Array.isArray(value)) {
+    if (value.length === 0) return "[]";
+    if (value.every((v) => isInlineable(v))) {
+      const inline = `[${value.map((v) => prettyPrint(v, 0)).join(", ")}]`;
+      if (!inline.includes("\n")) return inline;
+    }
+    const items = value.map((v) => `${childPrefix}${prettyPrint(v, indent + 1)}`);
+    return `[
+${items.join(",\n")}
+${prefix}]`;
+  }
+  const entries = Object.entries(value);
+  if (entries.length === 0) return "{}";
+  if (indent > 0 && entries.length <= MAX_INLINE_KEYS && entries.every(([, v]) => isInlineable(v))) {
+    const inline = `{ ${entries.map(([k, v]) => `${JSON.stringify(k)}: ${prettyPrint(v, 0)}`).join(", ")} }`;
+    if (!inline.includes("\n")) return inline;
+  }
+  const parts = entries.map(
+    ([k, v]) => `${childPrefix}${JSON.stringify(k)}: ${prettyPrint(v, indent + 1)}`
+  );
+  return `{
+${parts.join(",\n")}
+${prefix}}`;
+};
+var toJsLiteral = (obj) => {
+  return jsonToJsLiteral(prettyPrint(obj, 0));
+};
 var formatUpstashErrorMessage = (error) => {
   if (error.name !== "UpstashError") return error.message;
   let message = error.message;
@@ -2795,7 +2837,7 @@ var DatabrowserProvider = ({
           removeItem: () => {
           }
         },
-        version: 7,
+        version: 8,
         migrate: (originalState, version) => {
           const state = originalState;
           if (version <= 1) {
@@ -2827,9 +2869,12 @@ var DatabrowserProvider = ({
           if (version <= 6) {
             state.tabs = state.tabs.map(([id, data]) => [
               id,
-              { ...data, valuesSearch: { index: "", queries: {} } }
+              { ...data, valuesSearch: { index: "", queries: {}, queryBuilderMode: "ui" } }
             ]);
           }
+          if (version <= 7) {
+            state.aiDataSharingConsent = _nullishCoalesce(state.aiDataSharingConsent, () => ( false));
+          }
           return state;
         }
       })
@@ -2861,7 +2906,7 @@ var storeCreator = (set, get) => ({
       id,
       selectedKeys: [],
       search: { key: "", type: void 0 },
-      valuesSearch: { index: "", queries: {} },
+      valuesSearch: { index: "", queries: {}, queryBuilderMode: "ui" },
       isValuesSearchSelected: false,
       pinned: false
     };
@@ -3078,9 +3123,29 @@ var storeCreator = (set, get) => ({
       return { ...old, tabs: newTabs };
     });
   },
+  setQueryBuilderMode: (tabId, mode) => {
+    set((old) => {
+      const tabIndex = old.tabs.findIndex(([id]) => id === tabId);
+      if (tabIndex === -1) return old;
+      const newTabs = [...old.tabs];
+      const [, tabData] = newTabs[tabIndex];
+      newTabs[tabIndex] = [
+        tabId,
+        {
+          ...tabData,
+          valuesSearch: { ...tabData.valuesSearch, queryBuilderMode: mode }
+        }
+      ];
+      return { ...old, tabs: newTabs };
+    });
+  },
   searchHistory: [],
   addSearchHistory: (key) => {
     set((old) => ({ ...old, searchHistory: [key, ...old.searchHistory] }));
+  },
+  aiDataSharingConsent: false,
+  setAiDataSharingConsent: (consent) => {
+    set({ aiDataSharingConsent: consent });
   }
 });
 
@@ -3111,7 +3176,8 @@ var useTab = () => {
     setValuesSearch,
     setValuesSearchIndex,
     setValuesSearchQuery,
-    setIsValuesSearchSelected
+    setIsValuesSearchSelected,
+    setQueryBuilderMode
   } = useDatabrowserStore();
   const tabId = useTabId();
   const tabData = _react.useMemo.call(void 0, () => _optionalChain([tabs, 'access', _20 => _20.find, 'call', _21 => _21(([id]) => id === tabId), 'optionalAccess', _22 => _22[1]]), [tabs, tabId]);
@@ -3130,6 +3196,7 @@ var useTab = () => {
         query: _nullishCoalesce(tabData.valuesSearch.queries[tabData.valuesSearch.index], () => ( ""))
       },
       isValuesSearchSelected: tabData.isValuesSearchSelected,
+      queryBuilderMode: _nullishCoalesce(tabData.valuesSearch.queryBuilderMode, () => ( "ui")),
       pinned: tabData.pinned,
       setSelectedKey: (key) => setSelectedKey(tabId, key),
       setSelectedKeys: (keys) => setSelectedKeys(tabId, keys),
@@ -3140,7 +3207,8 @@ var useTab = () => {
       setValuesSearch: (search) => setValuesSearch(tabId, search),
       setValuesSearchIndex: (index) => setValuesSearchIndex(tabId, index),
       setValuesSearchQuery: (query) => setValuesSearchQuery(tabId, query),
-      setIsValuesSearchSelected: (isSelected) => setIsValuesSearchSelected(tabId, isSelected)
+      setIsValuesSearchSelected: (isSelected) => setIsValuesSearchSelected(tabId, isSelected),
+      setQueryBuilderMode: (mode) => setQueryBuilderMode(tabId, mode)
     }),
     [selectedTab, tabs, tabId]
   );
@@ -3170,6 +3238,29 @@ var portalWrapper = wrapper;
 
 var _reactresizablepanels = require('react-resizable-panels');
 
+// src/components/ui/resize-handle.tsx
+
+
+var ResizeHandle = ({
+  direction = "horizontal"
+}) => {
+  const isHorizontal = direction === "horizontal";
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+    _reactresizablepanels.PanelResizeHandle,
+    {
+      className: cn(
+        "group flex items-center justify-center gap-1 rounded-md transition-colors hover:bg-zinc-300/10",
+        isHorizontal ? "mx-[2px] h-full flex-col px-[8px]" : "my-[2px] w-full flex-row py-[8px]"
+      ),
+      children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[3px] w-[3px] rounded-full bg-zinc-300" }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[3px] w-[3px] rounded-full bg-zinc-300" }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[3px] w-[3px] rounded-full bg-zinc-300" })
+      ]
+    }
+  );
+};
+
 // src/components/ui/segmented.tsx
 
 var Segmented = ({
@@ -3181,21 +3272,30 @@ var Segmented = ({
   selectedClassName,
   unselectedClassName
 }) => {
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: cn("flex w-fit gap-[2px] rounded-lg bg-zinc-200 p-[2px] text-sm", className), children: options.map((option) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-    "button",
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    "div",
     {
       className: cn(
-        "h-7 rounded-md px-3 transition-all",
-        value === option.key ? _nullishCoalesce(selectedClassName, () => ( "bg-white text-zinc-950")) : _nullishCoalesce(unselectedClassName, () => ( "text-zinc-700")),
-        buttonClassName
+        "flex w-fit select-none gap-[2px] rounded-lg bg-zinc-200 p-[2px] text-sm",
+        className
       ),
-      onClick: () => {
-        _optionalChain([onChange, 'optionalCall', _25 => _25(option.key)]);
-      },
-      children: option.label
-    },
-    option.key
-  )) });
+      children: options.map((option) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        "button",
+        {
+          className: cn(
+            "h-7 rounded-md px-3 transition-all",
+            value === option.key ? _nullishCoalesce(selectedClassName, () => ( "bg-white text-zinc-950")) : _nullishCoalesce(unselectedClassName, () => ( "text-zinc-700")),
+            buttonClassName
+          ),
+          onClick: () => {
+            _optionalChain([onChange, 'optionalCall', _25 => _25(option.key)]);
+          },
+          children: option.label
+        },
+        option.key
+      ))
+    }
+  );
 };
 
 // src/components/ui/toaster.tsx
@@ -3367,6 +3467,33 @@ function Toaster() {
 
 // src/components/databrowser/hooks/use-fetch-search-indexes.tsx
 
+
+// src/lib/scan-keys.ts
+async function scanKeys(redis, {
+  match,
+  type,
+  count: count2 = 100,
+  limit
+} = {}) {
+  let cursor = "0";
+  const result = [];
+  while (true) {
+    const [newCursor, keys] = await redis.scan(cursor, {
+      count: count2,
+      type,
+      match
+    });
+    result.push(...keys);
+    if (limit && result.length >= limit) {
+      return result.slice(0, limit);
+    }
+    if (newCursor === "0") break;
+    cursor = newCursor;
+  }
+  return result;
+}
+
+// src/components/databrowser/hooks/use-fetch-search-indexes.tsx
 var FETCH_SEARCH_INDEXES_QUERY_KEY = "fetch-search-indexes";
 var useFetchSearchIndexes = ({
   match,
@@ -3376,21 +3503,7 @@ var useFetchSearchIndexes = ({
   return _reactquery.useQuery.call(void 0, {
     queryKey: [FETCH_SEARCH_INDEXES_QUERY_KEY],
     enabled: _nullishCoalesce(enabled, () => ( true)),
-    queryFn: async () => {
-      let cursor = "0";
-      const finalResult = [];
-      while (true) {
-        const [newCursor, results] = await redis.scan(cursor, {
-          count: 100,
-          type: "search",
-          match
-        });
-        finalResult.push(...results);
-        if (newCursor === "0") break;
-        cursor = newCursor;
-      }
-      return finalResult;
-    }
+    queryFn: () => scanKeys(redis, { match, type: "search" })
   });
 };
 
@@ -3677,6 +3790,7 @@ Label.displayName = LabelPrimitive.Root.displayName;
 // src/components/ui/select.tsx
 
 var _reactselect = require('@radix-ui/react-select'); var SelectPrimitive = _interopRequireWildcard(_reactselect);
+var _reactdom = require('react-dom'); var ReactDOM = _interopRequireWildcard(_reactdom);
 
 var Select = SelectPrimitive.Root;
 var SelectGroup = SelectPrimitive.Group;
@@ -3732,7 +3846,7 @@ var SelectContent = React6.forwardRef(({ className, children, position = "popper
       SelectPrimitive.Viewport,
       {
         className: cn(
-          "p-1",
+          "max-h-[min(var(--radix-select-content-available-height),20rem)] overflow-y-auto p-1",
           position === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
         ),
         children
@@ -3750,40 +3864,76 @@ var SelectLabel = React6.forwardRef(({ className, ...props }, ref) => /* @__PURE
   }
 ));
 SelectLabel.displayName = SelectPrimitive.Label.displayName;
-var SelectItem = React6.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-  SelectPrimitive.Item,
-  {
-    ref,
-    className: cn(
-      "relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-2 pr-8 text-sm outline-none hover:bg-zinc-100 focus:bg-zinc-100 focus:text-zinc-900 data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
-      className
+var SelectItemTooltip = ({
+  description,
+  itemRef
+}) => {
+  const [pos, setPos] = React6.useState();
+  React6.useEffect(() => {
+    const el = itemRef.current;
+    if (!el) return;
+    const rect = el.getBoundingClientRect();
+    setPos({ top: rect.top + rect.height / 2, left: rect.right + 8 });
+  }, [itemRef]);
+  if (!pos) return;
+  return ReactDOM.createPortal(
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      "div",
+      {
+        className: "pointer-events-none fixed z-[100] -translate-y-1/2 whitespace-nowrap rounded-md bg-zinc-900 px-3 py-1.5 text-xs text-zinc-50 shadow-md animate-in fade-in-0",
+        style: { top: pos.top, left: pos.left },
+        children: description
+      }
     ),
-    ...props,
-    children: [
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "absolute right-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-        "svg",
-        {
-          width: "15",
-          height: "15",
-          viewBox: "0 0 15 15",
-          fill: "none",
-          xmlns: "http://www.w3.org/2000/svg",
-          className: "h-4 w-4",
-          children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-            "path",
-            {
-              d: "M11.4669 3.72684C11.7558 3.91574 11.8369 4.30308 11.648 4.59198L7.39799 11.092C7.29783 11.2452 7.13556 11.3467 6.95402 11.3699C6.77247 11.3931 6.58989 11.3355 6.45446 11.2124L3.70446 8.71241C3.44905 8.48022 3.43023 8.08494 3.66242 7.82953C3.89461 7.57412 4.28989 7.55529 4.5453 7.78749L6.75292 9.79441L10.6018 3.90792C10.7907 3.61902 11.178 3.53795 11.4669 3.72684Z",
-              fill: "currentColor",
-              fillRule: "evenodd",
-              clipRule: "evenodd"
-            }
-          )
-        }
-      ) }) }),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectPrimitive.ItemText, { children })
-    ]
-  }
-));
+    _nullishCoalesce(portalRoot, () => ( document.body))
+  );
+};
+var SelectItem = React6.forwardRef(({ className, children, description, ...props }, ref) => {
+  const [isHovered, setIsHovered] = React6.useState(false);
+  const itemRef = React6.useRef(null);
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+    SelectPrimitive.Item,
+    {
+      ref: (node) => {
+        ;
+        itemRef.current = node;
+        if (typeof ref === "function") ref(node);
+        else if (ref) ref.current = node;
+      },
+      className: cn(
+        "relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-2 pr-8 text-sm outline-none hover:bg-zinc-100 focus:bg-zinc-100 focus:text-zinc-900 data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+        className
+      ),
+      onMouseEnter: () => setIsHovered(true),
+      onMouseLeave: () => setIsHovered(false),
+      ...props,
+      children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "absolute right-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          "svg",
+          {
+            width: "15",
+            height: "15",
+            viewBox: "0 0 15 15",
+            fill: "none",
+            xmlns: "http://www.w3.org/2000/svg",
+            className: "h-4 w-4",
+            children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+              "path",
+              {
+                d: "M11.4669 3.72684C11.7558 3.91574 11.8369 4.30308 11.648 4.59198L7.39799 11.092C7.29783 11.2452 7.13556 11.3467 6.95402 11.3699C6.77247 11.3931 6.58989 11.3355 6.45446 11.2124L3.70446 8.71241C3.44905 8.48022 3.43023 8.08494 3.66242 7.82953C3.89461 7.57412 4.28989 7.55529 4.5453 7.78749L6.75292 9.79441L10.6018 3.90792C10.7907 3.61902 11.178 3.53795 11.4669 3.72684Z",
+                fill: "currentColor",
+                fillRule: "evenodd",
+                clipRule: "evenodd"
+              }
+            )
+          }
+        ) }) }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectPrimitive.ItemText, { children }),
+        description && isHovered && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectItemTooltip, { description, itemRef })
+      ]
+    }
+  );
+});
 SelectItem.displayName = SelectPrimitive.Item.displayName;
 var SelectSeparator = React6.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
   SelectPrimitive.Separator,
@@ -3890,16 +4040,22 @@ function parseFields(content, prefix, flatSchema) {
     if (fieldName.startsWith('"') && fieldName.endsWith('"') || fieldName.startsWith("'") && fieldName.endsWith("'")) {
       fieldName = fieldName.slice(1, -1);
     }
+    if (fieldName.length === 0) {
+      throw new Error("Field name cannot be empty");
+    }
     const valueStr = entry.slice(colonIndex + 1).trim();
     const fullKey = prefix ? `${prefix}.${fieldName}` : fieldName;
     if (valueStr.startsWith("s.object(")) {
       const nestedContent = extractObjectContent(valueStr);
-      if (nestedContent !== null) {
-        parseFields(nestedContent, fullKey, flatSchema);
-        continue;
+      if (nestedContent === void 0) {
+        throw new Error(
+          `Malformed s.object() for field "${fullKey}": missing closing brace or parenthesis`
+        );
       }
+      parseFields(nestedContent, fullKey, flatSchema);
+      continue;
     }
-    const fieldValue = parseFieldBuilder(valueStr);
+    const fieldValue = parseFieldBuilder(valueStr, fullKey);
     if (fieldValue) {
       flatSchema[fullKey] = fieldValue;
     }
@@ -3960,15 +4116,15 @@ function findColonIndex(entry) {
 }
 function extractObjectContent(str) {
   const match = str.match(/^s\.object\s*\(\s*{([\S\s]*)}\s*\)/);
-  return match ? match[1] : null;
+  return match ? match[1] : void 0;
 }
 function extractFromValue(str) {
   const fromIndex = str.indexOf(".from(");
-  if (fromIndex === -1) return null;
+  if (fromIndex === -1) return void 0;
   const start = fromIndex + 6;
-  if (start >= str.length) return null;
+  if (start >= str.length) return void 0;
   const quoteChar = str[start];
-  if (quoteChar !== '"' && quoteChar !== "'") return null;
+  if (quoteChar !== '"' && quoteChar !== "'") return void 0;
   let result = "";
   let i = start + 1;
   while (i < str.length) {
@@ -3984,151 +4140,61 @@ function extractFromValue(str) {
     result += char;
     i++;
   }
-  return null;
+  return void 0;
 }
-function parseFieldBuilder(str) {
+function parseFieldBuilder(str, fieldName) {
   str = str.trim().replace(/,\s*$/, "");
   if (str.startsWith("s.string()")) {
     const noTokenize = str.includes(".noTokenize()");
     const noStem = str.includes(".noStem()");
     const fromValue = extractFromValue(str);
-    if (!noTokenize && !noStem && fromValue === null) return "TEXT";
+    if (!noTokenize && !noStem && fromValue === void 0) return "TEXT";
     return {
       type: "TEXT",
       ...noTokenize && { noTokenize: true },
       ...noStem && { noStem: true },
-      ...fromValue !== null && { from: fromValue }
+      ...fromValue !== void 0 && { from: fromValue }
     };
   }
   if (str.startsWith("s.number(")) {
     const typeMatch = str.match(/s\.number\(\s*["']?(U64|I64|F64)?["']?\s*\)/);
     const numType = _optionalChain([typeMatch, 'optionalAccess', _31 => _31[1]]) || "F64";
     const fromValue = extractFromValue(str);
-    if (fromValue === null) return numType;
+    if (fromValue === void 0) return numType;
     return { type: numType, from: fromValue };
   }
   if (str.startsWith("s.boolean()")) {
     const fast = str.includes(".fast()");
     const fromValue = extractFromValue(str);
-    if (!fast && fromValue === null) return "BOOL";
+    if (!fast && fromValue === void 0) return "BOOL";
     return {
       type: "BOOL",
       ...fast && { fast: true },
-      ...fromValue !== null && { from: fromValue }
+      ...fromValue !== void 0 && { from: fromValue }
     };
   }
   if (str.startsWith("s.date()")) {
     const fast = str.includes(".fast()");
     const fromValue = extractFromValue(str);
-    if (!fast && fromValue === null) return "DATE";
+    if (!fast && fromValue === void 0) return "DATE";
     return {
       type: "DATE",
       ...fast && { fast: true },
-      ...fromValue !== null && { from: fromValue }
+      ...fromValue !== void 0 && { from: fromValue }
     };
   }
-  return null;
-}
-function schemaToEditorValue(flatSchema) {
-  const nested = unflattenSchema(flatSchema);
-  const body = renderObject(nested, 1);
-  return `const schema: Schema = s.object({
-${body}})`;
-}
-function unflattenSchema(flat) {
-  const result = {};
-  for (const [key, value] of Object.entries(flat)) {
-    const parts = key.split(".");
-    let current = result;
-    for (let i = 0; i < parts.length - 1; i++) {
-      const part = parts[i];
-      if (!current[part] || typeof current[part] !== "object") {
-        current[part] = {};
-      }
-      current = current[part];
-    }
-    current[parts.at(-1)] = value;
-  }
-  return result;
-}
-function renderObject(obj, indent) {
-  const pad = "  ".repeat(indent);
-  const lines = [];
-  for (const [key, value] of Object.entries(obj)) {
-    if (isFieldValue(value)) {
-      lines.push(`${pad}${key}: ${fieldToBuilder(value)},`);
-    } else {
-      const nested = renderObject(value, indent + 1);
-      lines.push(`${pad}${key}: s.object({`);
-      lines.push(nested.trimEnd());
-      lines.push(`${pad}}),`);
-    }
-  }
-  return lines.join("\n") + "\n";
-}
-function isFieldValue(value) {
-  if (typeof value === "string") return true;
-  if (typeof value === "object" && value !== null) {
-    return "type" in value;
-  }
-  return false;
-}
-function fieldToBuilder(value) {
-  if (typeof value === "string") {
-    switch (value) {
-      case "TEXT": {
-        return "s.string()";
-      }
-      case "BOOL": {
-        return "s.boolean()";
-      }
-      case "DATE": {
-        return "s.date()";
-      }
-      case "U64":
-      case "I64":
-      case "F64": {
-        return `s.number("${value}")`;
-      }
-      default: {
-        return "s.string()";
-      }
-    }
+  if (str.startsWith("s.keyword()")) {
+    return "KEYWORD";
   }
-  const v = value;
-  const type = v.type;
-  let builder = "";
-  switch (type) {
-    case "TEXT": {
-      builder = "s.string()";
-      if (v.noTokenize) builder += ".noTokenize()";
-      if (v.noStem) builder += ".noStem()";
-      break;
-    }
-    case "U64":
-    case "I64":
-    case "F64": {
-      builder = `s.number("${type}")`;
-      break;
-    }
-    case "BOOL": {
-      builder = "s.boolean()";
-      if (v.fast) builder += ".fast()";
-      break;
-    }
-    case "DATE": {
-      builder = "s.date()";
-      if (v.fast) builder += ".fast()";
-      break;
-    }
-    default: {
-      builder = "s.string()";
-    }
+  if (str.startsWith("s.facet()")) {
+    return "FACET";
   }
-  if (v.from) {
-    builder += `.from("${v.from}")`;
+  if (str.startsWith("s.")) {
+    const typeMatch = str.match(/^s\.(\w+)\(/);
+    const typeName = _nullishCoalesce(_optionalChain([typeMatch, 'optionalAccess', _32 => _32[1]]), () => ( "unknown"));
+    throw new Error(`Unknown field type "s.${typeName}()" for field "${fieldName}"`);
   }
-  return builder;
+  return void 0;
 }
 
 // src/components/databrowser/hooks/use-create-search-index-schema.tsx
@@ -4168,37 +4234,113 @@ var useCreateSearchIndexSchema = () => {
 // src/components/databrowser/components/display/display-header.tsx
 
 
-// src/components/ui/tooltip.tsx
-
+// src/components/ui/scroll-area.tsx
 
+var _reactscrollarea = require('@radix-ui/react-scroll-area'); var ScrollAreaPrimitive = _interopRequireWildcard(_reactscrollarea);
 
-var Tooltip = TooltipPrimitive.Root;
-var TooltipTrigger = TooltipPrimitive.Trigger;
-var TooltipContent = React7.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, TooltipPrimitive.Portal, { container: portalRoot, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-  TooltipPrimitive.Content,
-  {
-    ref,
-    sideOffset,
-    className: cn(
-      "z-50 overflow-hidden rounded-md bg-zinc-900 px-3 py-1.5 text-xs text-zinc-50 animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
-      className
-    ),
+var ScrollArea = React7.forwardRef(
+  ({
+    className,
+    scrollBarClassName,
+    scrollBarForceMount,
+    children,
+    onScroll,
+    disableRoundedInherit = false,
+    orientation = "vertical",
     ...props
-  }
-) }));
-TooltipContent.displayName = TooltipPrimitive.Content.displayName;
-var SimpleTooltip = ({
-  content,
-  children,
-  variant = "default"
-}) => {
-  if (!content) return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _jsxruntime.Fragment, { children });
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, Tooltip, { delayDuration: 100, children: [
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, TooltipTrigger, { asChild: true, children }),
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      TooltipContent,
-      {
-        side: "top",
+  }, ref) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+    ScrollAreaPrimitive.Root,
+    {
+      ref,
+      className: cn("relative overflow-hidden", className),
+      ...props,
+      children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          ScrollAreaPrimitive.Viewport,
+          {
+            onScroll,
+            className: cn(
+              "h-full w-full [&>div]:!block",
+              !disableRoundedInherit && "rounded-[inherit]"
+            ),
+            children
+          }
+        ),
+        (orientation === "vertical" || orientation === "both") && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          ScrollBar,
+          {
+            className: scrollBarClassName,
+            forceMount: scrollBarForceMount,
+            orientation: "vertical"
+          }
+        ),
+        (orientation === "horizontal" || orientation === "both") && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          ScrollBar,
+          {
+            className: scrollBarClassName,
+            forceMount: scrollBarForceMount,
+            orientation: "horizontal"
+          }
+        ),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ScrollAreaPrimitive.Corner, {})
+      ]
+    }
+  )
+);
+ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName;
+var ScrollBar = React7.forwardRef(({ className, orientation = "vertical", ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+  ScrollAreaPrimitive.ScrollAreaScrollbar,
+  {
+    ref,
+    orientation,
+    className: cn(
+      "flex touch-none select-none transition-colors",
+      orientation === "vertical" && "mr-1 h-full w-2",
+      orientation === "horizontal" && "mb-1 h-2 w-full flex-col",
+      className
+    ),
+    ...props,
+    children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      ScrollAreaPrimitive.ScrollAreaThumb,
+      {
+        className: cn("relative flex-1 rounded-full bg-zinc-400/70")
+      }
+    )
+  }
+));
+ScrollBar.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName;
+
+// src/components/ui/tooltip.tsx
+
+
+
+var Tooltip = TooltipPrimitive.Root;
+var TooltipTrigger = TooltipPrimitive.Trigger;
+var TooltipContent = React8.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, TooltipPrimitive.Portal, { container: portalRoot, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+  TooltipPrimitive.Content,
+  {
+    ref,
+    sideOffset,
+    className: cn(
+      "z-50 overflow-hidden rounded-md bg-zinc-900 px-3 py-1.5 text-xs text-zinc-50 animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+      className
+    ),
+    ...props
+  }
+) }));
+TooltipContent.displayName = TooltipPrimitive.Content.displayName;
+var SimpleTooltip = ({
+  content,
+  children,
+  variant = "default"
+}) => {
+  if (!content) return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _jsxruntime.Fragment, { children });
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, Tooltip, { delayDuration: 100, children: [
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, TooltipTrigger, { asChild: true, children }),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      TooltipContent,
+      {
+        side: "top",
         className: variant === "error" ? "bg-white text-red-500 shadow-md" : void 0,
         children: content
       }
@@ -4429,7 +4571,7 @@ var useFetchListItems = ({ dataKey, type }) => {
         // +1 since first message is the last one
         LIST_DISPLAY_PAGE_SIZE + 1
       );
-      const lastMessageId = messages.length > 0 ? _optionalChain([messages, 'access', _32 => _32.at, 'call', _33 => _33(-1), 'optionalAccess', _34 => _34[0]]) : void 0;
+      const lastMessageId = messages.length > 0 ? _optionalChain([messages, 'access', _33 => _33.at, 'call', _34 => _34(-1), 'optionalAccess', _35 => _35[0]]) : void 0;
       return {
         cursor: messages.length < LIST_DISPLAY_PAGE_SIZE ? void 0 : lastMessageId,
         keys: messages.map(([id, fields]) => ({
@@ -4466,7 +4608,6 @@ function transformArray(inputArray) {
 var FETCH_SIMPLE_KEY_QUERY_KEY = "fetch-simple-key";
 var useFetchSimpleKey = (dataKey, type) => {
   const { redisNoPipeline: redis } = useRedis();
-  const { deleteKeyCache } = useDeleteKeyCache();
   return _reactquery.useQuery.call(void 0, {
     queryKey: [FETCH_SIMPLE_KEY_QUERY_KEY, dataKey],
     queryFn: async () => {
@@ -4476,7 +4617,6 @@ var useFetchSimpleKey = (dataKey, type) => {
       else throw new Error(`Invalid type when fetching simple key: ${type}`);
       if (type === "json" && result !== null)
         result = JSON.stringify(sortObject(JSON.parse(result)));
-      if (result === null) deleteKeyCache(dataKey);
       return result;
     }
   });
@@ -4492,10 +4632,9 @@ var sortObject = (obj) => {
 
 // src/components/databrowser/hooks/use-delete-key-cache.ts
 var useDeleteKeyCache = () => {
-  const { setSelectedKey } = useTab();
+  const { isValuesSearchSelected, valuesSearch } = useTab();
   const deleteKeyCache = _react.useCallback.call(void 0, 
     (key) => {
-      setSelectedKey(void 0);
       queryClient.invalidateQueries({
         queryKey: [FETCH_KEYS_QUERY_KEY]
       });
@@ -4508,22 +4647,39 @@ var useDeleteKeyCache = () => {
       queryClient.invalidateQueries({
         queryKey: [FETCH_KEY_TYPE_QUERY_KEY, key]
       });
+      queryClient.invalidateQueries({
+        queryKey: [FETCH_SEARCH_INDEX_QUERY_KEY, key]
+      });
+      queryClient.invalidateQueries({
+        queryKey: [FETCH_SEARCH_INDEXES_QUERY_KEY]
+      });
+      if (isValuesSearchSelected && valuesSearch.index) {
+        queryClient.invalidateQueries({
+          queryKey: [FETCH_SEARCH_INDEX_QUERY_KEY, valuesSearch.index]
+        });
+      }
     },
-    [setSelectedKey]
+    [isValuesSearchSelected, valuesSearch.index]
   );
   return { deleteKeyCache };
 };
 
 // src/components/databrowser/hooks/use-delete-key.ts
 var useDeleteKey = () => {
-  const { redis } = useRedis();
+  const { redis, redisNoPipeline } = useRedis();
   const { deleteKeyCache } = useDeleteKeyCache();
+  const { isValuesSearchSelected, valuesSearch } = useTab();
   const deleteKey = _reactquery.useMutation.call(void 0, {
-    mutationFn: async (key) => {
-      return Boolean(await redis.del(key));
+    mutationFn: async ({ keys, reindex }) => {
+      await Promise.all(keys.map((key) => redis.del(key)));
+      if (reindex && isValuesSearchSelected && valuesSearch.index) {
+        await redisNoPipeline.search.index({ name: valuesSearch.index }).waitIndexing();
+      }
     },
-    onSuccess: (_, key) => {
-      deleteKeyCache(key);
+    onSuccess: (_, { keys }) => {
+      for (const key of keys) {
+        deleteKeyCache(key);
+      }
     }
   });
   return deleteKey;
@@ -4590,7 +4746,7 @@ var useEditListItem = () => {
         }
         case "stream": {
           if (!isNew || !newKey) throw new Error("Stream data type is not mutable");
-          const opts = transformArray(_nullishCoalesce(_optionalChain([newValue, 'optionalAccess', _35 => _35.split, 'call', _36 => _36("\n")]), () => ( []))).map(
+          const opts = transformArray(_nullishCoalesce(_optionalChain([newValue, 'optionalAccess', _36 => _36.split, 'call', _37 => _37("\n")]), () => ( []))).map(
             ({ key, value }) => [key, value]
           );
           pipe.xadd(dataKey, newKey, Object.fromEntries(opts));
@@ -4628,7 +4784,7 @@ var _reactpopover = require('@radix-ui/react-popover'); var PopoverPrimitive = _
 
 var Popover = PopoverPrimitive.Root;
 var PopoverTrigger = PopoverPrimitive.Trigger;
-var PopoverContent = React8.forwardRef(({ className, align = "center", sideOffset = 4, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, PopoverPrimitive.Portal, { container: portalRoot, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+var PopoverContent = React9.forwardRef(({ className, align = "center", sideOffset = 4, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, PopoverPrimitive.Portal, { container: portalRoot, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
   PopoverPrimitive.Content,
   {
     ref,
@@ -4897,7 +5053,7 @@ var LengthBadge = ({
   content
 }) => {
   const { data, isLoading } = useFetchKeyLength({ dataKey, type });
-  const length = _nullishCoalesce(_optionalChain([content, 'optionalAccess', _37 => _37.length]), () => ( data));
+  const length = _nullishCoalesce(_optionalChain([content, 'optionalAccess', _38 => _38.length]), () => ( data));
   return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Badge, { label: "Length:", children: isLoading ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Skeleton, { className: "ml-1 h-3 w-10 rounded-md opacity-50" }) : length });
 };
 var SizeBadge = ({ dataKey }) => {
@@ -4918,8 +5074,8 @@ var HeaderTTLBadge = ({ dataKey }) => {
     }
   );
 };
-var Badge = ({ children, label }) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex h-[26px] items-center gap-0.5 whitespace-nowrap rounded-md bg-zinc-200 px-2 text-xs text-zinc-700 dark:bg-zinc-200", children: [
-  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "text-zinc-500 dark:text-zinc-500", children: label }),
+var Badge = ({ children, label }) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex h-[26px] items-center gap-0.5 whitespace-nowrap rounded-md bg-zinc-200 px-2 text-xs text-zinc-700 dark:bg-zinc-300", children: [
+  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "text-zinc-500 dark:text-zinc-600", children: label }),
   /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "font-medium", children })
 ] });
 
@@ -4933,7 +5089,7 @@ var _reactdropdownmenu = require('@radix-ui/react-dropdown-menu'); var DropdownM
 
 var DropdownMenu = DropdownMenuPrimitive.Root;
 var DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;
-var DropdownMenuSubTrigger = React9.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+var DropdownMenuSubTrigger = React10.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
   DropdownMenuPrimitive.SubTrigger,
   {
     ref,
@@ -4950,7 +5106,7 @@ var DropdownMenuSubTrigger = React9.forwardRef(({ className, inset, children, ..
   }
 ));
 DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName;
-var DropdownMenuSubContent = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+var DropdownMenuSubContent = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
   DropdownMenuPrimitive.SubContent,
   {
     ref,
@@ -4962,7 +5118,7 @@ var DropdownMenuSubContent = React9.forwardRef(({ className, ...props }, ref) =>
   }
 ));
 DropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;
-var DropdownMenuContent = React9.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DropdownMenuPrimitive.Portal, { container: portalRoot, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+var DropdownMenuContent = React10.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DropdownMenuPrimitive.Portal, { container: portalRoot, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
   DropdownMenuPrimitive.Content,
   {
     ref,
@@ -4976,7 +5132,7 @@ var DropdownMenuContent = React9.forwardRef(({ className, sideOffset = 4, ...pro
   }
 ) }));
 DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;
-var DropdownMenuItem = React9.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+var DropdownMenuItem = React10.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
   DropdownMenuPrimitive.Item,
   {
     ref,
@@ -4989,7 +5145,7 @@ var DropdownMenuItem = React9.forwardRef(({ className, inset, ...props }, ref) =
   }
 ));
 DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;
-var DropdownMenuCheckboxItem = React9.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+var DropdownMenuCheckboxItem = React10.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
   DropdownMenuPrimitive.CheckboxItem,
   {
     ref,
@@ -5006,7 +5162,7 @@ var DropdownMenuCheckboxItem = React9.forwardRef(({ className, children, checked
   }
 ));
 DropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive.CheckboxItem.displayName;
-var DropdownMenuRadioItem = React9.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+var DropdownMenuRadioItem = React10.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
   DropdownMenuPrimitive.RadioItem,
   {
     ref,
@@ -5022,7 +5178,7 @@ var DropdownMenuRadioItem = React9.forwardRef(({ className, children, ...props }
   }
 ));
 DropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName;
-var DropdownMenuLabel = React9.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+var DropdownMenuLabel = React10.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
   DropdownMenuPrimitive.Label,
   {
     ref,
@@ -5031,7 +5187,7 @@ var DropdownMenuLabel = React9.forwardRef(({ className, inset, ...props }, ref)
   }
 ));
 DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName;
-var DropdownMenuSeparator = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+var DropdownMenuSeparator = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
   DropdownMenuPrimitive.Separator,
   {
     ref,
@@ -5045,80 +5201,134 @@ var DropdownMenuShortcut = ({ className, ...props }) => {
 };
 DropdownMenuShortcut.displayName = "DropdownMenuShortcut";
 
-// src/components/ui/alert-dialog.tsx
+// src/components/databrowser/components/delete-key-modal.tsx
+
 
-var _reactalertdialog = require('@radix-ui/react-alert-dialog'); var AlertDialogPrimitive = _interopRequireWildcard(_reactalertdialog);
+// src/components/ui/dialog.tsx
+
+var _reactdialog = require('@radix-ui/react-dialog'); var DialogPrimitive = _interopRequireWildcard(_reactdialog);
 
-var AlertDialog = AlertDialogPrimitive.Root;
-var AlertDialogTrigger = AlertDialogPrimitive.Trigger;
-var AlertDialogPortal = ({ ...props }) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, AlertDialogPrimitive.Portal, { container: portalRoot, ...props });
-AlertDialogPortal.displayName = AlertDialogPrimitive.Portal.displayName;
-var AlertDialogOverlay = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-  AlertDialogPrimitive.Overlay,
+var Dialog = DialogPrimitive.Root;
+var DialogTrigger = DialogPrimitive.Trigger;
+var DialogPortal = (props) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DialogPrimitive.Portal, { container: portalRoot, ...props });
+DialogPortal.displayName = DialogPrimitive.Portal.displayName;
+var DialogOverlay = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+  DialogPrimitive.Overlay,
   {
+    ref,
     className: cn(
-      "fixed inset-0 z-50 bg-white/80 backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
+      "data-[state=open]:animate-in data-[state=closed]:animate-out",
+      "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
+      "fixed inset-0 z-50 bg-black/50 backdrop-blur-sm",
       className
     ),
-    ...props,
-    ref
+    ...props
   }
 ));
-AlertDialogOverlay.displayName = AlertDialogPrimitive.Overlay.displayName;
-var AlertDialogContent = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, AlertDialogPortal, { children: [
-  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, AlertDialogOverlay, {}),
-  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-    AlertDialogPrimitive.Content,
+DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
+var DialogContent = React11.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, DialogPortal, { children: [
+  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DialogOverlay, {}),
+  /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+    DialogPrimitive.Content,
     {
       ref,
       className: cn(
-        "antialiased data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0  data-[state=open]:slide-in-from-top-[48%]sm:rounded-lg fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border border-zinc-200 bg-white p-6 shadow-lg duration-200 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 md:w-full",
+        "antialiased",
+        "data-[state=open]:animate-in data-[state=closed]:animate-out ",
+        "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 ",
+        "data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 ",
+        "data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%]",
+        "data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%]",
+        "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg ",
+        "translate-x-[-50%] translate-y-[-50%] gap-4",
+        "bg-white p-8 shadow-lg duration-200 ",
+        "rounded-2xl md:w-full",
         className
       ),
-      ...props
+      ...props,
+      children: [
+        children,
+        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, DialogPrimitive.Close, { className: "absolute right-4 top-4 text-zinc-400 transition-colors hover:text-zinc-600 focus:outline-none disabled:pointer-events-none", children: [
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            "svg",
+            {
+              width: "20",
+              height: "20",
+              viewBox: "0 0 15 15",
+              fill: "none",
+              xmlns: "http://www.w3.org/2000/svg",
+              className: "size-5",
+              children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                "path",
+                {
+                  d: "M11.7816 4.03157C12.0062 3.80702 12.0062 3.44295 11.7816 3.2184C11.5571 2.99385 11.193 2.99385 10.9685 3.2184L7.50005 6.68682L4.03164 3.2184C3.80708 2.99385 3.44301 2.99385 3.21846 3.2184C2.99391 3.44295 2.99391 3.80702 3.21846 4.03157L6.68688 7.49999L3.21846 10.9684C2.99391 11.193 2.99391 11.557 3.21846 11.7816C3.44301 12.0061 3.80708 12.0061 4.03164 11.7816L7.50005 8.31316L10.9685 11.7816C11.193 12.0061 11.5571 12.0061 11.7816 11.7816C12.0062 11.557 12.0062 11.193 11.7816 10.9684L8.31322 7.49999L11.7816 4.03157Z",
+                  fill: "currentColor",
+                  fillRule: "evenodd",
+                  clipRule: "evenodd"
+                }
+              )
+            }
+          ),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "sr-only", children: "Close" })
+        ] })
+      ]
     }
   )
 ] }));
-AlertDialogContent.displayName = AlertDialogPrimitive.Content.displayName;
-var AlertDialogHeader = ({ className, ...props }) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: cn("flex flex-col space-y-2 text-center sm:text-left", className), ...props });
-AlertDialogHeader.displayName = "AlertDialogHeader";
-var AlertDialogFooter = ({ className, ...props }) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+DialogContent.displayName = DialogPrimitive.Content.displayName;
+var DialogHeader = ({ className, ...props }) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: cn("flex flex-col space-y-1.5 text-center sm:text-left", className), ...props });
+DialogHeader.displayName = "DialogHeader";
+var DialogFooter = ({ className, ...props }) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
   "div",
   {
     className: cn("flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2", className),
     ...props
   }
 );
-AlertDialogFooter.displayName = "AlertDialogFooter";
-var AlertDialogTitle = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-  AlertDialogPrimitive.Title,
+DialogFooter.displayName = "DialogFooter";
+var DialogTitle = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+  DialogPrimitive.Title,
   {
     ref,
-    className: cn("text-lg font-semibold", className),
+    className: cn("text-base font-semibold text-zinc-950", className),
     ...props
   }
 ));
-AlertDialogTitle.displayName = AlertDialogPrimitive.Title.displayName;
-var AlertDialogDescription = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-  AlertDialogPrimitive.Description,
+DialogTitle.displayName = DialogPrimitive.Title.displayName;
+var DialogDescription = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+  DialogPrimitive.Description,
   {
     ref,
     className: cn("text-sm text-zinc-500", className),
     ...props
   }
 ));
-AlertDialogDescription.displayName = AlertDialogPrimitive.Description.displayName;
-var AlertDialogAction = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, AlertDialogPrimitive.Action, { ref, className: cn(buttonVariants(), className), ...props }));
-AlertDialogAction.displayName = AlertDialogPrimitive.Action.displayName;
-var AlertDialogCancel = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-  AlertDialogPrimitive.Cancel,
+DialogDescription.displayName = DialogPrimitive.Description.displayName;
+
+// src/components/ui/switch.tsx
+
+var _reactswitch = require('@radix-ui/react-switch'); var SwitchPrimitives = _interopRequireWildcard(_reactswitch);
+
+var Switch = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+  SwitchPrimitives.Root,
   {
+    className: cn(
+      "peer inline-flex h-5 w-9 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent shadow-sm transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-neutral-950 focus-visible:ring-offset-2 focus-visible:ring-offset-white disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-neutral-900 data-[state=unchecked]:bg-neutral-200 dark:focus-visible:ring-neutral-300 dark:focus-visible:ring-offset-neutral-950 dark:data-[state=checked]:bg-neutral-50 dark:data-[state=unchecked]:bg-neutral-800",
+      className
+    ),
+    ...props,
     ref,
-    className: cn(buttonVariants({ variant: "outline" }), "mt-2 sm:!mt-0", className),
-    ...props
+    children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      SwitchPrimitives.Thumb,
+      {
+        className: cn(
+          "pointer-events-none block h-4 w-4 rounded-full bg-white shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-4 data-[state=unchecked]:translate-x-0 dark:bg-neutral-950"
+        )
+      }
+    )
   }
 ));
-AlertDialogCancel.displayName = AlertDialogPrimitive.Cancel.displayName;
+Switch.displayName = SwitchPrimitives.Root.displayName;
 
 // src/components/databrowser/components/delete-key-modal.tsx
 
@@ -5128,17 +5338,24 @@ function DeleteKeyModal({
   open,
   onOpenChange,
   deletionType,
-  count: count2 = 1
+  count: count2 = 1,
+  showReindex
 }) {
   const isPlural = count2 > 1;
   const itemLabel = deletionType === "item" ? "Item" : "Key";
   const itemsLabel = deletionType === "item" ? "Items" : "Keys";
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, AlertDialog, { open, onOpenChange, children: [
-    children && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, AlertDialogTrigger, { asChild: true, children }),
-    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, AlertDialogContent, { children: [
-      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, AlertDialogHeader, { children: [
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, AlertDialogTitle, { children: isPlural ? `Delete ${count2} ${itemsLabel}` : `Delete ${itemLabel}` }),
-        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, AlertDialogDescription, { className: "mt-5", children: [
+  const [internalOpen, setInternalOpen] = _react.useState.call(void 0, false);
+  const [reindex, setReindex] = _react.useState.call(void 0, true);
+  const [isPending, setIsPending] = _react.useState.call(void 0, false);
+  const isControlled = open !== void 0;
+  const isOpen = isControlled ? open : internalOpen;
+  const setIsOpen = isControlled ? onOpenChange : setInternalOpen;
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, Dialog, { open: isOpen, onOpenChange: setIsOpen, children: [
+    children && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DialogTrigger, { asChild: true, children }),
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, DialogContent, { children: [
+      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, DialogHeader, { children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DialogTitle, { children: isPlural ? `Delete ${count2} ${itemsLabel}` : `Delete ${itemLabel}` }),
+        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, DialogDescription, { className: "mt-5", children: [
           "Are you sure you want to delete",
           " ",
           isPlural ? `these ${count2} ${deletionType}s` : `this ${deletionType}`,
@@ -5147,14 +5364,44 @@ function DeleteKeyModal({
           "This action cannot be undone."
         ] })
       ] }),
-      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, AlertDialogFooter, { children: [
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, AlertDialogCancel, { type: "button", children: "Cancel" }),
+      showReindex && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          Switch,
+          {
+            id: "reindex",
+            checked: reindex,
+            onCheckedChange: setReindex,
+            disabled: isPending
+          }
+        ),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Label, { htmlFor: "reindex", className: "cursor-pointer text-sm text-zinc-700", children: "Reindex after deletion" })
+      ] }),
+      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, DialogFooter, { children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          Button,
+          {
+            type: "button",
+            variant: "outline",
+            disabled: isPending,
+            onClick: () => _optionalChain([setIsOpen, 'optionalCall', _39 => _39(false)]),
+            children: "Cancel"
+          }
+        ),
         /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-          AlertDialogAction,
+          Button,
           {
+            variant: "primary",
             className: "bg-red-500 text-zinc-50 hover:bg-red-600",
-            onClick: onDeleteConfirm,
-            children: "Yes, Delete"
+            disabled: isPending,
+            onClick: async (e) => {
+              setIsPending(true);
+              try {
+                await onDeleteConfirm(e, { reindex });
+              } finally {
+                setIsPending(false);
+              }
+            },
+            children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Spinner, { isLoading: isPending, isLoadingText: "Deleting", children: "Yes, Delete" })
           }
         )
       ] })
@@ -5164,8 +5411,13 @@ function DeleteKeyModal({
 
 // src/components/databrowser/components/display/key-actions.tsx
 
-function KeyActions({ dataKey, content }) {
+function KeyActions({
+  dataKey,
+  content,
+  type
+}) {
   const { mutateAsync: deleteKey } = useDeleteKey();
+  const { isValuesSearchSelected } = useTab();
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, DropdownMenu, { modal: false, children: [
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Button, { size: "icon-sm", "aria-label": "Key actions", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
       _iconsreact.IconDotsVertical,
@@ -5196,14 +5448,24 @@ function KeyActions({ dataKey, content }) {
           children: "Copy key"
         }
       ),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DeleteKeyModal, { deletionType: "key", onDeleteConfirm: async () => await deleteKey(dataKey), children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-        DropdownMenuItem,
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        DeleteKeyModal,
         {
-          className: "text-red-500 focus:bg-red-500 focus:text-white",
-          onSelect: (e) => e.preventDefault(),
-          children: "Delete key"
+          deletionType: "key",
+          showReindex: isValuesSearchSelected && type !== "search",
+          onDeleteConfirm: async (_e, options) => {
+            await deleteKey({ keys: [dataKey], reindex: _optionalChain([options, 'optionalAccess', _40 => _40.reindex]) });
+          },
+          children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            DropdownMenuItem,
+            {
+              className: "text-red-500 focus:bg-red-500 focus:text-white",
+              onSelect: (e) => e.preventDefault(),
+              children: "Delete key"
+            }
+          )
         }
-      ) })
+      )
     ] })
   ] });
 }
@@ -5225,142 +5487,69 @@ var DisplayHeader = ({
       /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "h2", { className: "grow truncate text-sm", children: dataKey.trim() === "" ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "ml-1 text-zinc-500", children: "(Empty Key)" }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "font-medium text-zinc-950", children: dataKey }) }),
       /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center gap-1", children: [
         type !== "string" && type !== "json" && type !== "search" && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SimpleTooltip, { content: "Add item", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Button, { onClick: handleAddItem, size: "icon-sm", "aria-label": "Add item", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _iconsreact.IconPlus, { className: "size-4 text-zinc-500 dark:text-zinc-600" }) }) }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, KeyActions, { dataKey, content })
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, KeyActions, { dataKey, content, type })
       ] })
     ] }),
-    type === "search" && hideTypeTag ? void 0 : /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex h-10 items-center gap-1.5 overflow-scroll", children: [
+    type === "search" && hideTypeTag ? void 0 : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ScrollArea, { orientation: "horizontal", className: "w-full whitespace-nowrap", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex w-max items-center gap-1.5 pb-2 pt-1", children: [
       !hideTypeTag && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, TypeTag, { variant: type, type: "badge" }),
       type !== "search" && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SizeBadge, { dataKey }),
       type !== "search" && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, LengthBadge, { dataKey, type, content }),
       type !== "search" && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, HeaderTTLBadge, { dataKey })
-    ] })
+    ] }) })
   ] });
 };
 
+// src/components/databrowser/components/display/key-deleted.tsx
+
+var KeyDeleted = () => {
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex h-full items-center justify-center rounded-md border border-dashed border-zinc-300", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "text-zinc-500", children: "This key has been deleted" }) });
+};
+
+// src/components/databrowser/components/docs-link.tsx
+
+
+var DocsLink = ({ href, className }) => {
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+    "a",
+    {
+      href,
+      target: "_blank",
+      rel: "noopener noreferrer",
+      className: cn(
+        "inline-flex items-center gap-1 px-1 text-xs text-zinc-400 transition-colors hover:text-zinc-600",
+        className
+      ),
+      children: [
+        "Docs",
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _iconsreact.IconExternalLink, { size: 12 })
+      ]
+    }
+  );
+};
+
 // src/components/databrowser/components/search/save-schema-modal.tsx
 
 
-// src/components/ui/dialog.tsx
+// src/components/ui/progress.tsx
 
-var _reactdialog = require('@radix-ui/react-dialog'); var DialogPrimitive = _interopRequireWildcard(_reactdialog);
+var _reactprogress = require('@radix-ui/react-progress'); var ProgressPrimitive = _interopRequireWildcard(_reactprogress);
 
-var Dialog = DialogPrimitive.Root;
-var DialogTrigger = DialogPrimitive.Trigger;
-var DialogPortal = (props) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DialogPrimitive.Portal, { container: portalRoot, ...props });
-DialogPortal.displayName = DialogPrimitive.Portal.displayName;
-var DialogOverlay = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-  DialogPrimitive.Overlay,
+var Progress = React13.forwardRef(({ className, value, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+  ProgressPrimitive.Root,
   {
     ref,
     className: cn(
-      "data-[state=open]:animate-in data-[state=closed]:animate-out",
-      "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
-      "fixed inset-0 z-50 bg-black/50 backdrop-blur-sm",
+      "relative h-2 w-full overflow-hidden rounded-full bg-neutral-900/20 dark:bg-neutral-50/20",
       className
     ),
-    ...props
-  }
-));
-DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
-var DialogContent = React11.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, DialogPortal, { children: [
-  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DialogOverlay, {}),
-  /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-    DialogPrimitive.Content,
-    {
-      ref,
-      className: cn(
-        "antialiased",
-        "data-[state=open]:animate-in data-[state=closed]:animate-out ",
-        "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 ",
-        "data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 ",
-        "data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%]",
-        "data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%]",
-        "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg ",
-        "translate-x-[-50%] translate-y-[-50%] gap-4",
-        "bg-white p-6 shadow-lg duration-200 ",
-        "sm:rounded-lg md:w-full",
-        className
-      ),
-      ...props,
-      children: [
-        children,
-        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, DialogPrimitive.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-white transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-zinc-950 focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-zinc-100 data-[state=open]:text-zinc-500", children: [
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-            "svg",
-            {
-              width: "15",
-              height: "15",
-              viewBox: "0 0 15 15",
-              fill: "none",
-              xmlns: "http://www.w3.org/2000/svg",
-              className: "h-4 w-4",
-              children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                "path",
-                {
-                  d: "M11.7816 4.03157C12.0062 3.80702 12.0062 3.44295 11.7816 3.2184C11.5571 2.99385 11.193 2.99385 10.9685 3.2184L7.50005 6.68682L4.03164 3.2184C3.80708 2.99385 3.44301 2.99385 3.21846 3.2184C2.99391 3.44295 2.99391 3.80702 3.21846 4.03157L6.68688 7.49999L3.21846 10.9684C2.99391 11.193 2.99391 11.557 3.21846 11.7816C3.44301 12.0061 3.80708 12.0061 4.03164 11.7816L7.50005 8.31316L10.9685 11.7816C11.193 12.0061 11.5571 12.0061 11.7816 11.7816C12.0062 11.557 12.0062 11.193 11.7816 10.9684L8.31322 7.49999L11.7816 4.03157Z",
-                  fill: "currentColor",
-                  fillRule: "evenodd",
-                  clipRule: "evenodd"
-                }
-              )
-            }
-          ),
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "sr-only", children: "Close" })
-        ] })
-      ]
-    }
-  )
-] }));
-DialogContent.displayName = DialogPrimitive.Content.displayName;
-var DialogHeader = ({ className, ...props }) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: cn("flex flex-col space-y-1.5 text-center sm:text-left", className), ...props });
-DialogHeader.displayName = "DialogHeader";
-var DialogFooter = ({ className, ...props }) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-  "div",
-  {
-    className: cn("flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2", className),
-    ...props
-  }
-);
-DialogFooter.displayName = "DialogFooter";
-var DialogTitle = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-  DialogPrimitive.Title,
-  {
-    ref,
-    className: cn("text-lg font-semibold leading-none tracking-tight", className),
-    ...props
-  }
-));
-DialogTitle.displayName = DialogPrimitive.Title.displayName;
-var DialogDescription = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-  DialogPrimitive.Description,
-  {
-    ref,
-    className: cn("text-sm text-zinc-500", className),
-    ...props
-  }
-));
-DialogDescription.displayName = DialogPrimitive.Description.displayName;
-
-// src/components/ui/progress.tsx
-
-var _reactprogress = require('@radix-ui/react-progress'); var ProgressPrimitive = _interopRequireWildcard(_reactprogress);
-
-var Progress = React12.forwardRef(({ className, value, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-  ProgressPrimitive.Root,
-  {
-    ref,
-    className: cn(
-      "relative h-2 w-full overflow-hidden rounded-full bg-neutral-900/20 dark:bg-neutral-50/20",
-      className
-    ),
-    ...props,
-    children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      ProgressPrimitive.Indicator,
-      {
-        className: "h-full w-full flex-1 bg-neutral-900 transition-all dark:bg-neutral-50",
-        style: { transform: `translateX(-${100 - (value || 0)}%)` }
-      }
-    )
+    ...props,
+    children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      ProgressPrimitive.Indicator,
+      {
+        className: "h-full w-full flex-1 bg-neutral-900 transition-all dark:bg-neutral-50",
+        style: { transform: `translateX(-${100 - (value || 0)}%)` }
+      }
+    )
   }
 ));
 Progress.displayName = ProgressPrimitive.Root.displayName;
@@ -5491,16 +5680,18 @@ var MonacoEditorWithTypes = ({
   const monaco = _react2.useMonaco.call(void 0, );
   const editorRef = _react.useRef.call(void 0, null);
   const extraLibRef = _react.useRef.call(void 0, null);
+  const valueRef = _react.useRef.call(void 0, value);
+  valueRef.current = value;
   const theme = useTheme();
   _react.useEffect.call(void 0, () => {
     if (!monaco) return;
-    _optionalChain([extraLibRef, 'access', _38 => _38.current, 'optionalAccess', _39 => _39.dispose, 'call', _40 => _40()]);
+    _optionalChain([extraLibRef, 'access', _41 => _41.current, 'optionalAccess', _42 => _42.dispose, 'call', _43 => _43()]);
     extraLibRef.current = monaco.languages.typescript.typescriptDefaults.addExtraLib(
       typeDefinitions,
       `file:///${filePath.replace(".ts", "-types.d.ts")}`
     );
     requestAnimationFrame(() => {
-      const model = _optionalChain([editorRef, 'access', _41 => _41.current, 'optionalAccess', _42 => _42.getModel, 'optionalCall', _43 => _43()]);
+      const model = _optionalChain([editorRef, 'access', _44 => _44.current, 'optionalAccess', _45 => _45.getModel, 'optionalCall', _46 => _46()]);
       if (model) {
         const currentValue = model.getValue();
         model.setValue(currentValue);
@@ -5509,10 +5700,10 @@ var MonacoEditorWithTypes = ({
   }, [monaco, typeDefinitions, filePath]);
   _react.useEffect.call(void 0, () => {
     return () => {
-      _optionalChain([extraLibRef, 'access', _44 => _44.current, 'optionalAccess', _45 => _45.dispose, 'call', _46 => _46()]);
+      _optionalChain([extraLibRef, 'access', _47 => _47.current, 'optionalAccess', _48 => _48.dispose, 'call', _49 => _49()]);
       if (monaco) {
         const model = monaco.editor.getModel(monaco.Uri.parse(filePath));
-        _optionalChain([model, 'optionalAccess', _47 => _47.dispose, 'call', _48 => _48()]);
+        _optionalChain([model, 'optionalAccess', _50 => _50.dispose, 'call', _51 => _51()]);
       }
     };
   }, [monaco, filePath]);
@@ -5522,12 +5713,12 @@ var MonacoEditorWithTypes = ({
     } else if (newValue.trim() === "") {
       onChange(defaultValue);
     } else {
-      _optionalChain([editorRef, 'access', _49 => _49.current, 'optionalAccess', _50 => _50.setValue, 'optionalCall', _51 => _51(value)]);
+      _optionalChain([editorRef, 'access', _52 => _52.current, 'optionalAccess', _53 => _53.setValue, 'optionalCall', _54 => _54(valueRef.current)]);
     }
   };
   _react.useEffect.call(void 0, () => {
     if (!validateValue(value)) onChange(defaultValue);
-  }, [value, editorRef.current, onChange, validateValue, defaultValue]);
+  }, [value, onChange, validateValue, defaultValue]);
   return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
     "div",
     {
@@ -5664,7 +5855,7 @@ type TextFieldBuild<TNoTokenize extends Record<"noTokenize", boolean>, TNoStem e
 } : {}) : TFrom["from"] extends string ? {
     type: "TEXT";
     from: TFrom["from"];
-} : "TEXT";
+} : { type: "TEXT" };
 declare const BUILD: unique symbol;
 declare class TextFieldBuilder<TNoTokenize extends Record<"noTokenize", boolean> = {
     noTokenize: false;
@@ -5732,7 +5923,7 @@ declare class BoolFieldBuilder<Fast extends Record<"fast", boolean> = {
     } : TFrom["from"] extends string ? {
         type: "BOOL";
         from: TFrom["from"];
-    } : "BOOL";
+    } : { type: "BOOL" };
 }
 declare class DateFieldBuilder<Fast extends Record<"fast", boolean> = {
     fast: false;
@@ -5760,7 +5951,13 @@ declare class DateFieldBuilder<Fast extends Record<"fast", boolean> = {
     } : TFrom["from"] extends string ? {
         type: "DATE";
         from: TFrom["from"];
-    } : "DATE";
+    } : { type: "DATE" };
+}
+declare class KeywordFieldBuilder {
+    [BUILD](): { type: "KEYWORD" };
+}
+declare class FacetFieldBuilder {
+    [BUILD](): { type: "FACET" };
 }
 type FieldBuilder = TextFieldBuilder<{
     noTokenize: boolean;
@@ -5778,12 +5975,14 @@ type FieldBuilder = TextFieldBuilder<{
     fast: boolean;
 }, {
     from: string | null;
-}>;
+}> | KeywordFieldBuilder | FacetFieldBuilder;
 declare const s: {
     string(): TextFieldBuilder;
     number<T extends NumericField["type"] = "F64">(type?: T): NumericFieldBuilder<T>;
     boolean(): BoolFieldBuilder;
     date(): DateFieldBuilder;
+    keyword(): KeywordFieldBuilder;
+    facet(): FacetFieldBuilder;
     object<T extends ObjectFieldRecord<T>>(fields: T): { [K in keyof T]: T[K] extends FieldBuilder ? ReturnType<T[K][typeof BUILD]> : T[K]; };
 };
 type ObjectFieldRecord<T> = {
@@ -5804,7 +6003,7 @@ type Schema = NestedIndexSchema | FlatIndexSchema;
 
 var SCHEMA_PREFIX = "const schema: Schema = s.object({";
 var SCHEMA_SUFFIX = "})";
-var SCHEMA_DEFAULT = "const schema: Schema = s.object({\n  \n})";
+var SCHEMA_DEFAULT = "const schema: Schema = s.object({\n  name: s.string(),\n})";
 var isSchemaStringValid = (value) => {
   return value.startsWith(SCHEMA_PREFIX) && value.endsWith(SCHEMA_SUFFIX);
 };
@@ -5826,6 +6025,123 @@ var SchemaEditor = ({ value, onChange, height }) => {
   );
 };
 
+// src/components/databrowser/components/search/schema-stringify.ts
+function schemaToEditorValue(flatSchema) {
+  const nested = unflattenSchema(flatSchema);
+  const body = renderObject(nested, 1);
+  return `const schema: Schema = s.object({
+${body}})`;
+}
+function unflattenSchema(flat) {
+  const result = {};
+  for (const [key, value] of Object.entries(flat)) {
+    const parts = key.split(".");
+    let current = result;
+    for (let i = 0; i < parts.length - 1; i++) {
+      const part = parts[i];
+      if (!current[part] || typeof current[part] !== "object") {
+        current[part] = {};
+      }
+      current = current[part];
+    }
+    current[parts.at(-1)] = value;
+  }
+  return result;
+}
+function renderObject(obj, indent) {
+  const pad = "  ".repeat(indent);
+  const lines = [];
+  for (const [key, value] of Object.entries(obj)) {
+    if (isFieldValue(value)) {
+      lines.push(`${pad}${key}: ${fieldToBuilder(value)},`);
+    } else {
+      const nested = renderObject(value, indent + 1);
+      lines.push(`${pad}${key}: s.object({`);
+      lines.push(nested.trimEnd());
+      lines.push(`${pad}}),`);
+    }
+  }
+  return lines.join("\n") + "\n";
+}
+function isFieldValue(value) {
+  if (typeof value === "string") return true;
+  if (typeof value === "object" && value !== null) {
+    return "type" in value;
+  }
+  return false;
+}
+function fieldToBuilder(value) {
+  if (typeof value === "string") {
+    switch (value) {
+      case "TEXT": {
+        return "s.string()";
+      }
+      case "BOOL": {
+        return "s.boolean()";
+      }
+      case "DATE": {
+        return "s.date()";
+      }
+      case "U64":
+      case "I64":
+      case "F64": {
+        return `s.number("${value}")`;
+      }
+      case "KEYWORD": {
+        return "s.keyword()";
+      }
+      case "FACET": {
+        return "s.facet()";
+      }
+      default: {
+        return "s.string()";
+      }
+    }
+  }
+  const v = value;
+  const type = v.type;
+  let builder = "";
+  switch (type) {
+    case "TEXT": {
+      builder = "s.string()";
+      if (v.noTokenize) builder += ".noTokenize()";
+      if (v.noStem) builder += ".noStem()";
+      break;
+    }
+    case "U64":
+    case "I64":
+    case "F64": {
+      builder = `s.number("${type}")`;
+      break;
+    }
+    case "BOOL": {
+      builder = "s.boolean()";
+      if (v.fast) builder += ".fast()";
+      break;
+    }
+    case "DATE": {
+      builder = "s.date()";
+      if (v.fast) builder += ".fast()";
+      break;
+    }
+    case "KEYWORD": {
+      builder = "s.keyword()";
+      break;
+    }
+    case "FACET": {
+      builder = "s.facet()";
+      break;
+    }
+    default: {
+      builder = "s.string()";
+    }
+  }
+  if (v.from) {
+    builder += `.from("${v.from}")`;
+  }
+  return builder;
+}
+
 // src/components/databrowser/components/search/display-search.tsx
 
 var SearchDisplay = ({
@@ -5853,6 +6169,7 @@ var SearchDisplay = ({
   const currentIndexName = watch("indexName");
   const effectiveIndexName = isCreateModal ? currentIndexName : _nullishCoalesce(indexName, () => ( ""));
   const [pendingFormValues, setPendingFormValues] = _react.useState.call(void 0, );
+  const [parseError, setParseError] = _react.useState.call(void 0, );
   const { data, isLoading } = useFetchSearchIndex(indexName, {
     enabled: !isCreateModal
   });
@@ -5863,11 +6180,12 @@ var SearchDisplay = ({
       indexName: _nullishCoalesce(indexName, () => ( "")),
       editorValue: data.schema ? schemaToEditorValue(data.schema) : SCHEMA_DEFAULT,
       dataType: data.dataType || "string",
-      prefixes: _optionalChain([data, 'access', _52 => _52.prefixes, 'optionalAccess', _53 => _53.join, 'call', _54 => _54(", ")]) || "",
+      prefixes: _optionalChain([data, 'access', _55 => _55.prefixes, 'optionalAccess', _56 => _56.join, 'call', _57 => _57(", ")]) || "",
       language: data.language || "english"
     });
   }, [data, reset, indexName]);
   const onSubmit = (values) => {
+    setParseError(void 0);
     if (isCreateModal) {
       createSchema.mutate(
         {
@@ -5882,6 +6200,11 @@ var SearchDisplay = ({
         }
       );
     } else {
+      const result = parseSchemaFromEditorValue(values.editorValue);
+      if (!result.success) {
+        setParseError(result.error);
+        return;
+      }
       setPendingFormValues({ ...values, indexName });
     }
   };
@@ -5889,11 +6212,14 @@ var SearchDisplay = ({
     createSchema.reset();
     reset();
   };
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex h-full w-full min-w-0 flex-col gap-2", children: [
+  if (!isCreateModal && !isLoading && (data === null || data === void 0)) {
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, KeyDeleted, {});
+  }
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex h-full min-h-0 w-full min-w-0 flex-col gap-2", children: [
     !isCreateModal && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DisplayHeader, { dataKey: effectiveIndexName, type: "search", hideTypeTag: isEditModal }),
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex h-full min-w-0 grow flex-col gap-2 rounded-md", children: !isCreateModal && isLoading ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Spinner, { isLoadingText: "", isLoading: true }) : !isCreateModal && (data === null || data === void 0) ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex h-full items-center justify-center", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "text-zinc-500", children: "No data found" }) }) : /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex h-full w-full flex-col gap-3", children: [
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex min-h-0 min-w-0 grow flex-col gap-2 rounded-md", children: !isCreateModal && isLoading ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Spinner, { isLoadingText: "", isLoading: true }) : /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex min-h-0 w-full flex-1 flex-col gap-3", children: [
       isCreateModal && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col gap-1.5", children: [
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Label, { htmlFor: "index-name", children: "Key" }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Label, { htmlFor: "index-name", children: "Index Key" }),
         /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
           Input,
           {
@@ -5904,9 +6230,9 @@ var SearchDisplay = ({
         ),
         errors.indexName && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "text-xs text-red-500", children: errors.indexName.message })
       ] }),
-      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "rounded-md border border-zinc-300 bg-white p-3", children: [
+      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "shrink-0 rounded-md border border-zinc-300 bg-white p-3", children: [
         /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex items-center justify-between", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "h3", { className: "text-sm font-medium text-zinc-700", children: "Config" }) }),
-        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "mt-2 grid grid-cols-4 gap-4 text-sm", children: [
+        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "mt-2 grid grid-cols-2 gap-4 text-sm lg:grid-cols-4", children: [
           /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { children: [
             /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "mb-1.5 block text-xs font-medium text-zinc-500", children: "Data Type" }),
             /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
@@ -5930,7 +6256,7 @@ var SearchDisplay = ({
                 control,
                 render: ({ field }) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, Select, { value: field.value, onValueChange: field.onChange, children: [
                   /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectTrigger, { className: "h-8", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectValue, { placeholder: "Select language" }) }),
-                  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectContent, { children: LANGUAGES.map((lang) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectItem, { value: lang, children: lang }, lang)) })
+                  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectContent, { children: LANGUAGES.map((lang) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectItem, { value: lang, children: lang.charAt(0).toUpperCase() + lang.slice(1) }, lang)) })
                 ] })
               }
             )
@@ -5949,7 +6275,7 @@ var SearchDisplay = ({
           ] })
         ] })
       ] }),
-      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex min-h-0 flex-1 flex-col rounded-md border border-zinc-300 bg-white", children: [
+      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "relative flex min-h-0 flex-1 flex-col rounded-md border border-zinc-300 bg-white", children: [
         /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex items-center justify-between border-b border-zinc-200 px-3 py-2", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "h3", { className: "text-sm font-medium text-zinc-700", children: "Schema" }) }),
         /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "min-h-0 flex-1", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-full px-1", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
           _reacthookform.Controller,
@@ -5965,9 +6291,17 @@ var SearchDisplay = ({
               }
             )
           }
-        ) }) })
+        ) }) }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          DocsLink,
+          {
+            className: "absolute bottom-2 right-2 text-sm",
+            href: "https://upstash-search.mintlify.app/redis/search/schema-definition"
+          }
+        )
       ] }),
       isCreateModal && createSchema.error && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "w-full break-words text-xs text-red-500", children: createSchema.error.message.startsWith("ERR syntax error") ? "Invalid schema" : formatUpstashErrorMessage(createSchema.error) }),
+      parseError && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "w-full break-words text-xs text-red-500", children: parseError }),
       /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex shrink-0 items-center gap-2", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "ml-auto flex gap-2", children: [
         (isDirty || isCreateModal || isEditModal) && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
           Button,
@@ -5990,7 +6324,6 @@ var SearchDisplay = ({
           values: pendingFormValues,
           onClose: () => {
             setPendingFormValues(void 0);
-            reset();
             if (isEditModal && onClose) onClose();
           }
         }
@@ -6027,63 +6360,6 @@ var LANGUAGES = [
 
 
 
-// src/components/ui/scroll-area.tsx
-
-var _reactscrollarea = require('@radix-ui/react-scroll-area'); var ScrollAreaPrimitive = _interopRequireWildcard(_reactscrollarea);
-
-var ScrollArea = React13.forwardRef(
-  ({
-    className,
-    scrollBarClassName,
-    scrollBarForceMount,
-    children,
-    onScroll,
-    disableRoundedInherit = false,
-    ...props
-  }, ref) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-    ScrollAreaPrimitive.Root,
-    {
-      ref,
-      className: cn("relative overflow-hidden", className),
-      ...props,
-      children: [
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-          ScrollAreaPrimitive.Viewport,
-          {
-            onScroll,
-            className: cn(
-              "h-full w-full [&>div]:!block",
-              !disableRoundedInherit && "rounded-[inherit]"
-            ),
-            children
-          }
-        ),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ScrollBar, { className: scrollBarClassName, forceMount: scrollBarForceMount }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ScrollAreaPrimitive.Corner, {})
-      ]
-    }
-  )
-);
-ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName;
-var ScrollBar = React13.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-  ScrollAreaPrimitive.ScrollAreaScrollbar,
-  {
-    ref,
-    orientation: "vertical",
-    className: cn("mr-1 flex h-full w-2 touch-none select-none transition-colors", className),
-    ...props,
-    children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      ScrollAreaPrimitive.ScrollAreaThumb,
-      {
-        className: cn("relative flex-1 rounded-full bg-zinc-400/70")
-      }
-    )
-  }
-));
-ScrollBar.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName;
-
-// src/components/common/infinite-scroll.tsx
-
 var InfiniteScroll = ({
   query,
   children,
@@ -6121,7 +6397,7 @@ var InfiniteScroll = ({
       type: "always",
       onScroll: handleScroll,
       ...props,
-      className: cn("block h-full w-full overflow-visible transition-all", props.className),
+      className: cn("block h-full min-h-0 w-full overflow-hidden transition-all", props.className),
       ref: scrollRef,
       children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { ref: contentRef, children: [
         children,
@@ -6277,7 +6553,7 @@ var ItemContextMenu = ({
             editItem({
               type,
               dataKey,
-              itemKey: _optionalChain([data, 'optionalAccess', _55 => _55.key]),
+              itemKey: _optionalChain([data, 'optionalAccess', _58 => _58.key]),
               // For deletion
               newKey: void 0
             });
@@ -6312,7 +6588,7 @@ var ItemContextMenu = ({
           {
             onClick: () => {
               if (!data) return;
-              navigator.clipboard.writeText(_optionalChain([data, 'optionalAccess', _56 => _56.key]));
+              navigator.clipboard.writeText(_optionalChain([data, 'optionalAccess', _59 => _59.key]));
               toast({
                 description: "Key copied to clipboard"
               });
@@ -6324,11 +6600,11 @@ var ItemContextMenu = ({
             ]
           }
         ),
-        _optionalChain([data, 'optionalAccess', _57 => _57.value]) && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+        _optionalChain([data, 'optionalAccess', _60 => _60.value]) && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
           ContextMenuItem,
           {
             onClick: () => {
-              navigator.clipboard.writeText(_nullishCoalesce(_optionalChain([data, 'optionalAccess', _58 => _58.value]), () => ( "")));
+              navigator.clipboard.writeText(_nullishCoalesce(_optionalChain([data, 'optionalAccess', _61 => _61.value]), () => ( "")));
               toast({
                 description: "Value copied to clipboard"
               });
@@ -6440,7 +6716,7 @@ var useSetHashTTL = () => {
 var HashFieldTTLBadge = ({ dataKey, field }) => {
   const { data } = useFetchHashFieldExpires({ dataKey, fields: [field] });
   const { mutate: setTTL, isPending } = useSetHashTTL();
-  const expireAt = _optionalChain([data, 'optionalAccess', _59 => _59[field]]);
+  const expireAt = _optionalChain([data, 'optionalAccess', _62 => _62[field]]);
   return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
     TTLBadge,
     {
@@ -6537,7 +6813,7 @@ var MonacoEditor = ({
     if (!active || !monaco || !editorRef.current) {
       return;
     }
-    _optionalChain([monaco, 'optionalAccess', _60 => _60.editor, 'access', _61 => _61.setModelLanguage, 'call', _62 => _62(editorRef.current.getModel(), language)]);
+    _optionalChain([monaco, 'optionalAccess', _63 => _63.editor, 'access', _64 => _64.setModelLanguage, 'call', _65 => _65(editorRef.current.getModel(), language)]);
   }, [monaco, language, active]);
   const editor = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
     _react2.Editor,
@@ -6662,6 +6938,13 @@ var useField = ({
       }
     }
   };
+  _react.useLayoutEffect.call(void 0, () => {
+    if (!fieldState.isDirty && contentType === "JSON" && checkIsValidJSON(data)) {
+      form.setValue(name, formatJSON(data), {
+        shouldDirty: false
+      });
+    }
+  }, [data, fieldState.isDirty]);
   return {
     selector: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ContentTypeSelect, { value: contentType, onChange: handleTypeChange, data: field.value }),
     editor: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _jsxruntime.Fragment, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
@@ -6694,7 +6977,7 @@ var ListEditDisplay = ({
   type,
   item
 }) => {
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "grow rounded-md bg-zinc-100", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ListEditForm, { item, type, dataKey }, item.key) });
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "min-h-0 grow rounded-md", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ListEditForm, { item, type, dataKey }, item.key) });
 };
 var ListEditForm = ({
   type,
@@ -6706,7 +6989,7 @@ var ListEditForm = ({
     dataKey
   });
   const findValue = () => {
-    for (const page of _nullishCoalesce(_optionalChain([query, 'access', _63 => _63.data, 'optionalAccess', _64 => _64.pages]), () => ( []))) {
+    for (const page of _nullishCoalesce(_optionalChain([query, 'access', _66 => _66.data, 'optionalAccess', _67 => _67.pages]), () => ( []))) {
       const item = page.keys.find((item2) => item2.key === itemKey);
       if (item && "value" in item) return item.value;
     }
@@ -6733,8 +7016,8 @@ var ListEditForm = ({
     });
     setSelectedListItem(void 0);
   });
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reacthookform.FormProvider, { ...form, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "form", { onSubmit, className: "flex h-full flex-col gap-2", children: [
-    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex grow flex-col gap-2", children: [
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reacthookform.FormProvider, { ...form, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "form", { onSubmit, className: "flex h-full min-h-0 flex-col gap-2", children: [
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex min-h-0 grow flex-col gap-2", children: [
       type === "zset" && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, NumberFormItem, { name: "value", label: valueLabel }),
       type !== "list" && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, FormItem, { readOnly: type === "stream", name: "key", label: keyLabel, data: itemKey }),
       type !== "set" && type !== "zset" && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
@@ -6798,7 +7081,7 @@ var NumberFormItem = ({ name, label }) => {
         render: ({ field }) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
           "input",
           {
-            className: "plain-input rounded-md border border-zinc-300 px-3 py-1 shadow-sm",
+            className: "plain-input rounded-md border border-zinc-300 bg-white px-3 py-1 shadow-sm [appearance:textfield] [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none",
             type: "number",
             ...field
           }
@@ -6823,7 +7106,7 @@ var FormItem = ({
     readOnly,
     data
   });
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: cn("flex flex-col gap-1", !height && "h-full"), children: [
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: cn("flex flex-col gap-1", !height && "h-full min-h-0"), children: [
     /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center gap-1 text-xs", children: [
       /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "font-medium text-zinc-700", children: label }),
       " ",
@@ -6835,7 +7118,7 @@ var FormItem = ({
       {
         className: cn(
           "overflow-hidden rounded-md border border-zinc-300 bg-white p-2 shadow-sm",
-          !height && "h-full"
+          !height && "h-full min-h-0"
         ),
         children: editor
       }
@@ -6852,7 +7135,7 @@ var HashFieldTTLInfo = ({
   fields
 }) => {
   const { data } = useFetchHashFieldExpires({ dataKey, fields });
-  const expireAt = _optionalChain([data, 'optionalAccess', _65 => _65[field]]);
+  const expireAt = _optionalChain([data, 'optionalAccess', _68 => _68[field]]);
   const [ttl, setTTL] = _react.useState.call(void 0, () => calculateTTL(expireAt));
   _react.useEffect.call(void 0, () => {
     setTTL(calculateTTL(expireAt));
@@ -6877,7 +7160,11 @@ var headerLabels = {
 var ListDisplay = ({ dataKey, type }) => {
   const { selectedListItem } = useTab();
   const query = useFetchListItems({ dataKey, type });
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex h-full flex-col gap-2", children: [
+  const isEmpty = query.isFetched && _optionalChain([query, 'access', _69 => _69.data, 'optionalAccess', _70 => _70.pages, 'access', _71 => _71.every, 'call', _72 => _72((page) => page.keys.length === 0)]);
+  if (isEmpty) {
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, KeyDeleted, {});
+  }
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex h-full min-h-0 flex-col gap-2 overflow-hidden", children: [
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DisplayHeader, { dataKey, type }),
     selectedListItem && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ListEditDisplay, { dataKey, type, item: selectedListItem }),
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: cn("min-h-0 grow", selectedListItem && "hidden"), children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, InfiniteScroll, { query, className: "rounded-lg border border-zinc-200 bg-white", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "table", { className: "w-full", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ItemContextMenu, { dataKey, type, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "tbody", { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ListItems, { dataKey, type, query }) }) }) }) }) })
@@ -6889,7 +7176,7 @@ var ListItems = ({
   dataKey
 }) => {
   const { setSelectedListItem } = useTab();
-  const keys = _react.useMemo.call(void 0, () => _nullishCoalesce(_optionalChain([query, 'access', _66 => _66.data, 'optionalAccess', _67 => _67.pages, 'access', _68 => _68.flatMap, 'call', _69 => _69((page) => page.keys)]), () => ( [])), [query.data]);
+  const keys = _react.useMemo.call(void 0, () => _nullishCoalesce(_optionalChain([query, 'access', _73 => _73.data, 'optionalAccess', _74 => _74.pages, 'access', _75 => _75.flatMap, 'call', _76 => _76((page) => page.keys)]), () => ( [])), [query.data]);
   const fields = _react.useMemo.call(void 0, () => keys.map((key) => key.key), [keys]);
   const { mutate: editItem } = useEditListItem();
   return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _jsxruntime.Fragment, { children: keys.map(({ key, value }, i) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
@@ -6928,7 +7215,7 @@ var ListItems = ({
             onClick: (e) => {
               e.stopPropagation();
             },
-            children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center justify-end gap-2", children: [
+            children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center justify-end gap-2 pr-2", children: [
               type === "hash" && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, HashFieldTTLInfo, { dataKey, field: key, fields }),
               /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
                 DeleteKeyModal,
@@ -6971,9 +7258,12 @@ var ListItems = ({
 
 var EditorDisplay = ({ dataKey, type }) => {
   const { data } = useFetchSimpleKey(dataKey, type);
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex h-full w-full flex-col gap-2", children: [
+  if (data === null) {
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, KeyDeleted, {});
+  }
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex h-full min-h-0 w-full flex-col gap-2 overflow-hidden", children: [
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DisplayHeader, { dataKey, type, content: _nullishCoalesce(data, () => ( void 0)) }),
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex h-full grow flex-col gap-2 rounded-md", children: data === void 0 ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Spinner, { isLoadingText: "", isLoading: true }) : data === null ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _jsxruntime.Fragment, {}) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, EditorDisplayForm, { dataKey, type, data }, dataKey) })
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex min-h-0 grow flex-col gap-2 rounded-md", children: data === void 0 ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Spinner, { isLoadingText: "", isLoading: true }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, EditorDisplayForm, { dataKey, type, data }, dataKey) })
   ] });
 };
 var EditorDisplayForm = ({
@@ -6990,12 +7280,12 @@ var EditorDisplayForm = ({
   const { editor, selector } = useField({ name: "value", form, data });
   const { mutateAsync: setKey, isPending: isSettingKey } = useSetSimpleKey(dataKey, type);
   const handleCancel = () => {
-    form.reset({ value: data });
+    form.reset();
   };
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
-    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex grow flex-col gap-1", children: [
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex min-h-0 grow flex-col gap-1", children: [
       /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex shrink-0 items-center gap-2", children: type === "json" ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", {}) : selector }),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "grow rounded-md border border-zinc-300 bg-white p-2", children: editor })
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "min-h-0 grow rounded-md border border-zinc-300 bg-white p-2", children: editor })
     ] }),
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex shrink-0 items-center gap-2", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "ml-auto flex gap-2", children: [
       form.formState.isDirty && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Button, { onClick: handleCancel, children: "Cancel" }),
@@ -7036,33 +7326,6 @@ var DataDisplay = () => {
 
 
 
-// src/components/common/reload-button.tsx
-
-
-
-var ReloadButton = ({
-  onClick,
-  isLoading: isLoadingProp
-}) => {
-  const [isLoading, setIsLoading] = _react.useState.call(void 0, false);
-  const handleClick = () => {
-    setIsLoading(true);
-    onClick();
-    setTimeout(() => {
-      setIsLoading(false);
-    }, 350);
-  };
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SimpleTooltip, { content: "Refresh", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-    Button,
-    {
-      variant: "outline",
-      size: "icon",
-      onClick: handleClick,
-      disabled: isLoading || isLoadingProp,
-      children: isLoading ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _iconsreact.IconLoader2, { className: "size-5 animate-spin text-zinc-500" }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _iconsreact.IconRefresh, { className: "size-5 text-zinc-500 dark:text-zinc-600" })
-    }
-  ) }) });
-};
 
 // src/components/databrowser/components/add-key-modal.tsx
 
@@ -7085,7 +7348,7 @@ function AddKeyModal() {
     setSelectedKey(key);
     setOpen(false);
     setTimeout(() => {
-      _optionalChain([window, 'access', _70 => _70.document, 'access', _71 => _71.querySelector, 'call', _72 => _72(`[data-key="${key}"]`), 'optionalAccess', _73 => _73.scrollIntoView, 'call', _74 => _74({
+      _optionalChain([window, 'access', _77 => _77.document, 'access', _78 => _78.querySelector, 'call', _79 => _79(`[data-key="${key}"]`), 'optionalAccess', _80 => _80.scrollIntoView, 'call', _81 => _81({
         behavior: "smooth",
         block: "start",
         inline: "nearest"
@@ -7106,7 +7369,7 @@ function AddKeyModal() {
           {
             variant: "primary",
             "data-testid": "add-key-button",
-            className: "flex h-8 items-center gap-1 rounded-lg pl-2 pr-3 text-sm font-medium",
+            className: "flex h-8 select-none items-center gap-1 rounded-lg pl-2 pr-3 text-sm font-medium",
             children: [
               /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _iconsreact.IconPlus, { className: "size-5" }),
               "Key"
@@ -7141,7 +7404,7 @@ function AddKeyModal() {
                 }
               )
             ] }),
-            formState.errors.key && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "mb-3 mt-2 text-xs text-red-500", children: _optionalChain([formState, 'access', _75 => _75.errors, 'access', _76 => _76.key, 'optionalAccess', _77 => _77.message]) }),
+            formState.errors.key && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "mb-3 mt-2 text-xs text-red-500", children: _optionalChain([formState, 'access', _82 => _82.errors, 'access', _83 => _83.key, 'optionalAccess', _84 => _84.message]) }),
             /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "mt-2 text-xs text-zinc-500", children: "After creating the key, you can edit the value" }),
             /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "mt-6 flex justify-end gap-2", children: [
               /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
@@ -7164,427 +7427,84 @@ function AddKeyModal() {
   );
 }
 
-// src/components/databrowser/components/search/create-index-modal.tsx
-
-var CreateIndexModal = ({
-  open,
-  onOpenChange
-}) => {
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Dialog, { open, onOpenChange, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, DialogContent, { className: "max-w-2xl", children: [
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DialogHeader, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DialogTitle, { children: "Create new Index" }) }),
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "sr-only", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DialogDescription, { children: "Create new search index" }) }),
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SearchDisplay, { isCreateModal: true, onClose: () => onOpenChange(false) })
-  ] }) });
-};
+// src/components/databrowser/components/query-wizard/query-wizard-popover.tsx
 
-// src/components/databrowser/components/search/edit-index-modal.tsx
 
-var EditIndexModal = ({
-  open,
-  onOpenChange,
-  indexName
-}) => {
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Dialog, { open, onOpenChange, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, DialogContent, { className: "max-w-2xl", children: [
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DialogHeader, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DialogTitle, { children: "Edit Index" }) }),
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "sr-only", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DialogDescription, { children: "Edit search index schema" }) }),
-    indexName && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SearchDisplay, { indexName, isEditModal: true, onClose: () => onOpenChange(false) })
-  ] }) });
-};
 
-// src/components/databrowser/components/header/search-input.tsx
 
+// src/components/databrowser/components/query-wizard/consent-prompt.tsx
 
 
-var dedupeSearchHistory = (history) => {
-  const seen = /* @__PURE__ */ new Set();
-  return history.filter((item) => {
-    if (!item || seen.has(item)) return false;
-    seen.add(item);
-    return true;
-  });
-};
-var SearchInput = () => {
-  const { setSearchKey, search } = useTab();
-  const { searchHistory, addSearchHistory } = useDatabrowserStore();
-  const [state, setState] = _react.useState.call(void 0, search.key);
-  const [isFocus, setIsFocus] = _react.useState.call(void 0, false);
-  const [focusedIndex, setFocusedIndex] = _react.useState.call(void 0, -1);
-  const inputRef = _react.useRef.call(void 0, null);
-  const historyItemRefs = _react.useRef.call(void 0, []);
-  const handleSubmit = (value) => {
-    if (value.trim() !== "" && !value.includes("*")) value = `${value}*`;
-    addSearchHistory(value);
-    setSearchKey(value);
-    setState(value);
-  };
-  const filteredHistory = dedupeSearchHistory(
-    searchHistory.filter((item) => item.trim() !== "" && item.trim() !== "*").filter((item) => item.includes(state) && item !== state)
-  ).slice(0, 5).map((item) => item.endsWith("*") ? item.slice(0, -1) : item);
-  _react.useEffect.call(void 0, () => {
-    setFocusedIndex(-1);
-  }, [filteredHistory.length]);
-  const handleKeyDown = (e) => {
-    if (e.key === "Enter") {
-      const text = focusedIndex >= 0 && focusedIndex < filteredHistory.length ? filteredHistory[focusedIndex] : e.currentTarget.value;
-      handleSubmit(text);
-    } else if (e.key === "Escape") {
-      setState("");
-      setFocusedIndex(-1);
-      _optionalChain([inputRef, 'access', _78 => _78.current, 'optionalAccess', _79 => _79.blur, 'call', _80 => _80()]);
-    } else if (e.key === "ArrowDown" || e.key === "Tab" && !e.shiftKey) {
-      e.preventDefault();
-      if (focusedIndex < filteredHistory.length - 1) {
-        setFocusedIndex(focusedIndex + 1);
-      } else if (filteredHistory.length > 0) {
-        setFocusedIndex(0);
-      }
-    } else if (e.key === "ArrowUp" || e.key === "Tab" && e.shiftKey) {
-      e.preventDefault();
-      if (focusedIndex > 0) {
-        setFocusedIndex(focusedIndex - 1);
-      } else if (filteredHistory.length > 0 && focusedIndex === 0) {
-        setFocusedIndex(-1);
-        _optionalChain([inputRef, 'access', _81 => _81.current, 'optionalAccess', _82 => _82.focus, 'call', _83 => _83()]);
-      } else if (filteredHistory.length > 0) {
-        setFocusedIndex(filteredHistory.length - 1);
-      }
-    }
+var ConsentPrompt = ({ onClose }) => {
+  const store = useDatabrowserStore();
+  const handleContinue = () => {
+    store.setAiDataSharingConsent(true);
   };
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "relative grow", children: [
-    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, Popover, { open: isFocus && filteredHistory.length > 0, children: [
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, PopoverTrigger, { asChild: true, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-8 rounded-md border border-zinc-300 font-normal", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-        Input,
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex max-w-[500px] flex-col gap-6 rounded-2xl p-6 shadow-lg", children: [
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "h3", { className: "text-base font-semibold text-zinc-950", children: "AI Query Builder" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex items-center justify-center rounded-md bg-purple-100 px-1.5 py-0.5", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "text-sm font-medium text-purple-700", children: "BETA" }) })
+    ] }),
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex gap-3 rounded-xl border border-yellow-300 bg-yellow-50 p-5", children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _iconsreact.IconAlertCircleFilled, { className: "size-5 shrink-0 text-yellow-800" }),
+      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col gap-1.5", children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "text-sm font-semibold text-yellow-800", children: "AI Query Builder requires data sharing" }),
+        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "p", { className: "text-sm text-yellow-800", children: [
+          "To generate accurate queries, we'll send your",
+          " ",
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "font-semibold", children: "index schema" }),
+          " and a",
+          " ",
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "font-semibold", children: "small sample of your data" }),
+          " to AI models. This may include field names and example values."
+        ] }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "text-sm text-yellow-800", children: "Only used to generate the query you request." })
+      ] })
+    ] }),
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center justify-end gap-2", children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        "button",
         {
-          ref: inputRef,
-          placeholder: "Search",
-          className: "h-full border-none pr-6",
-          onKeyDown: handleKeyDown,
-          onChange: (e) => {
-            setState(e.currentTarget.value);
-            if (e.currentTarget.value.trim() === "") handleSubmit("");
-          },
-          value: state,
-          onFocus: () => {
-            setIsFocus(true);
-            setFocusedIndex(-1);
-          },
-          onBlur: () => setIsFocus(false)
+          onClick: onClose,
+          className: "flex h-8 items-center justify-center rounded-md border border-zinc-300 bg-white px-4 text-sm text-zinc-950 hover:bg-zinc-50",
+          children: "Cancel"
         }
-      ) }) }),
+      ),
       /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-        PopoverContent,
+        "button",
         {
-          className: "w-[--radix-popover-trigger-width] divide-y px-3 py-2 text-[13px] text-zinc-900",
-          autoFocus: false,
-          onOpenAutoFocus: (e) => {
-            e.preventDefault();
-            e.stopPropagation();
-          },
-          children: filteredHistory.map((item, index) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "w-full py-[3px]", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-            "button",
-            {
-              ref: (el) => {
-                historyItemRefs.current[index] = el;
-              },
-              onClick: () => handleSubmit(item),
-              onMouseEnter: () => setFocusedIndex(index),
-              className: `block w-full truncate rounded-sm p-1 text-left transition-colors ${focusedIndex === index ? "bg-zinc-100" : "hover:bg-zinc-100"}`,
-              children: item
-            }
-          ) }, item))
+          onClick: handleContinue,
+          className: "flex h-8 items-center justify-center rounded-md bg-purple-500 px-4 text-sm text-white hover:bg-purple-600",
+          children: "I agree & Continue"
         }
       )
-    ] }),
-    state && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-      Button,
-      {
-        type: "button",
-        variant: "link",
-        size: "icon",
-        className: "absolute right-1 top-1/2 h-5 w-5 -translate-y-1/2 text-zinc-500 hover:text-zinc-900",
-        onClick: () => {
-          setSearchKey("");
-          setState("");
-        },
-        children: [
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _iconsreact.IconX, { size: 16 }),
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "sr-only", children: "Clear" })
-        ]
-      }
-    ),
-    " "
+    ] })
   ] });
 };
 
-// src/components/databrowser/components/header/type-selector.tsx
+// src/components/databrowser/components/query-wizard/use-query-wizard.tsx
 
-var ALL_TYPES_KEY = "all";
-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__ */ _jsxruntime.jsxs.call(void 0, 
-    Select,
-    {
-      onValueChange: (type) => {
-        if (type === ALL_TYPES_KEY) {
-          setSearchType(void 0);
-        } else {
-          setSearchType(type);
-        }
-      },
-      value: search.type === void 0 ? ALL_TYPES_KEY : search.type,
-      children: [
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectTrigger, { className: "!w-auto shrink-0 select-none whitespace-nowrap border-zinc-300 pr-8", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectValue, {}) }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectContent, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectGroup, { children: entries.map(([key, value]) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectItem, { value: key, children: value }, key)) }) })
-      ]
-    }
-  );
-}
 
-// src/components/databrowser/components/header/index.tsx
 
-var Header = ({ tabType, allowSearch }) => {
-  const { isValuesSearchSelected, setIsValuesSearchSelected } = useTab();
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center justify-between gap-1.5", children: [
-    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex grow items-center gap-1.5", children: [
-      tabType === "all" && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-        Segmented,
-        {
-          options: [
-            {
-              key: "keys",
-              label: "Keys"
-            },
-            {
-              key: "values",
-              label: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center gap-1", children: [
-                "Search",
-                /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex h-[18px] items-center rounded-md bg-emerald-100 px-[5px] text-[11px] text-emerald-700", children: "NEW" })
-              ] })
-            }
-          ],
-          value: isValuesSearchSelected ? "values" : "keys",
-          onChange: (value) => {
-            setIsValuesSearchSelected(value === "values");
-          },
-          className: "bg-emerald-800",
-          unselectedClassName: "text-emerald-100",
-          selectedClassName: "bg-emerald-50 text-emerald-800"
-        }
-      ),
-      isValuesSearchSelected ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, IndexSelector, {}) : /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DataTypeSelector, { allowSearch }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SearchInput, {})
-      ] })
-    ] }),
-    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center gap-1.5", children: [
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, RefreshButton, {}),
-      isValuesSearchSelected ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, AddIndexButton, {}) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, AddKeyModal, {})
-    ] })
-  ] });
-};
-var IndexSelector = () => {
-  const {
-    valuesSearch: { index },
-    setValuesSearchIndex
-  } = useTab();
-  const { data: indexes, isLoading } = useFetchSearchIndexes();
-  const [open, setOpen] = _react.useState.call(void 0, false);
-  _react.useEffect.call(void 0, () => {
-    if (!indexes || isLoading) return;
-    if (index && !indexes.includes(index)) {
-      setValuesSearchIndex("");
-    }
-  }, [indexes, index, isLoading, setValuesSearchIndex]);
-  const [search, setSearch] = _react.useState.call(void 0, "");
-  const [editingIndex, setEditingIndex] = _react.useState.call(void 0, null);
-  const filteredIndexes = _optionalChain([indexes, 'optionalAccess', _84 => _84.filter, 'call', _85 => _85((idx) => idx.toLowerCase().includes(search.toLowerCase()))]);
-  const handleEditIndex = (indexName) => {
-    setOpen(false);
-    setEditingIndex(indexName);
-  };
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex", children: [
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex items-center rounded-l-lg border border-r-0 border-zinc-300 bg-white px-3 text-sm text-zinc-700", children: "Index" }),
-    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-      Popover,
-      {
-        open,
-        onOpenChange: (isOpen) => {
-          setOpen(isOpen);
-          if (!isOpen) setSearch("");
-        },
-        modal: false,
-        children: [
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, PopoverTrigger, { asChild: true, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "button", { className: "flex min-w-[140px] items-center justify-between gap-2 rounded-r-lg border border-zinc-300 bg-emerald-50 px-3 py-[5px] text-sm font-medium text-emerald-800 transition-colors hover:bg-emerald-100", children: [
-            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "truncate", children: index || "Select an index" }),
-            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _iconsreact.IconChevronDown, { className: "size-4 shrink-0 opacity-50" })
-          ] }) }),
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, PopoverContent, { className: "p-2", align: "center", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col gap-2", children: [
-            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, CreateIndexButton, {}),
-            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-px bg-zinc-100" }),
-            /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex h-9 items-center rounded-md border border-zinc-300 px-2", children: [
-              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _iconsreact.IconSearch, { className: "size-5 text-zinc-400" }),
-              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                "input",
-                {
-                  value: search,
-                  onChange: (e) => setSearch(e.target.value),
-                  placeholder: "Search Index",
-                  className: "flex h-full w-full bg-transparent px-2 py-3 text-sm outline-none placeholder:text-zinc-400"
-                }
-              )
-            ] }),
-            /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "max-h-[200px] overflow-y-auto", children: [
-              _optionalChain([filteredIndexes, 'optionalAccess', _86 => _86.length]) === 0 && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "py-4 text-center text-sm text-zinc-500", children: "No indexes found" }),
-              _optionalChain([filteredIndexes, 'optionalAccess', _87 => _87.map, 'call', _88 => _88((idx) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-                "div",
-                {
-                  className: "flex h-9 items-center rounded-md px-2 transition-colors hover:bg-zinc-100",
-                  children: [
-                    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-                      "button",
-                      {
-                        onClick: () => {
-                          setValuesSearchIndex(idx);
-                          setOpen(false);
-                        },
-                        className: "flex flex-1 items-center gap-2 text-left text-sm",
-                        children: [
-                          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                            "span",
-                            {
-                              className: cn(
-                                "flex size-5 items-center justify-center",
-                                idx === index ? "text-emerald-600" : "text-transparent"
-                              ),
-                              children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _iconsreact.IconCircleCheck, { className: "size-5" })
-                            }
-                          ),
-                          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "truncate", children: idx })
-                        ]
-                      }
-                    ),
-                    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                      "button",
-                      {
-                        onClick: (event) => {
-                          event.stopPropagation();
-                          event.preventDefault();
-                          handleEditIndex(idx);
-                        },
-                        className: "ml-2 text-sm text-zinc-500 underline hover:text-zinc-700",
-                        children: "Edit"
-                      }
-                    )
-                  ]
-                },
-                idx
-              ))])
-            ] })
-          ] }) })
-        ]
-      }
-    ),
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      EditIndexModal,
-      {
-        open: Boolean(editingIndex),
-        onOpenChange: (isOpen) => !isOpen && setEditingIndex(null),
-        indexName: editingIndex
-      }
-    )
-  ] });
-};
-var CreateIndexButton = () => {
-  const [open, setOpen] = _react.useState.call(void 0, false);
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
-    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-      "button",
-      {
-        onClick: (e) => {
-          e.stopPropagation();
-          setOpen(true);
-        },
-        className: "flex h-9 w-full items-center gap-2 rounded-md px-2 text-sm text-emerald-600 transition-colors hover:bg-zinc-50",
-        children: [
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _iconsreact.IconCirclePlus, { className: "size-5" }),
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "underline", children: "Create a new Index" })
-        ]
-      }
-    ),
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, CreateIndexModal, { open, onOpenChange: setOpen })
-  ] });
-};
-var AddIndexButton = () => {
-  const [open, setOpen] = _react.useState.call(void 0, false);
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SimpleTooltip, { content: "Add index", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-      Button,
-      {
-        variant: "primary",
-        onClick: () => setOpen(true),
-        className: "flex h-8 items-center gap-1 rounded-lg pl-2 pr-3 text-sm font-medium",
-        children: [
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _iconsreact.IconPlus, { className: "size-5" }),
-          "Index"
-        ]
-      }
-    ) }),
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, CreateIndexModal, { open, onOpenChange: setOpen })
-  ] });
-};
-var RefreshButton = () => {
-  const { query } = useKeys();
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-    ReloadButton,
-    {
-      onClick: () => {
-        queryClient.invalidateQueries({
-          queryKey: [FETCH_KEYS_QUERY_KEY]
-        });
-        queryClient.invalidateQueries({
-          queryKey: [FETCH_LIST_ITEMS_QUERY_KEY]
-        });
-        queryClient.invalidateQueries({
-          queryKey: [FETCH_SIMPLE_KEY_QUERY_KEY]
-        });
-        queryClient.invalidateQueries({
-          queryKey: [FETCH_KEY_TYPE_QUERY_KEY]
-        });
-      },
-      isLoading: query.isFetching
-    }
-  );
-};
-
-// src/components/databrowser/components/header-error.tsx
-
-var HeaderError = () => {
-  const { query } = useKeys();
-  if (!query.error) return null;
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "text-sm text-red-600 dark:text-red-400", children: formatUpstashErrorMessage(query.error) });
-};
-
-// src/components/databrowser/components/query-builder.tsx
-
-
-// src/components/databrowser/components/search/query-editor.tsx
-
-
-// src/components/databrowser/components/search/search-types-file.ts
-var SEARCH_TYPES = `
-
-export const FIELD_TYPES = ["TEXT", "U64", "I64", "F64", "BOOL", "DATE"] as const;
-export type FieldType = (typeof FIELD_TYPES)[number];
-
-export type TextField = {
-  type: "TEXT";
-  noTokenize?: boolean;
-  noStem?: boolean;
-  from?: string;
+// src/components/databrowser/components/search/search-types-file.ts
+var SEARCH_TYPES = `
+export const FIELD_TYPES = [
+  "TEXT",
+  "U64",
+  "I64",
+  "F64",
+  "BOOL",
+  "DATE",
+  "KEYWORD",
+  "FACET",
+] as const;
+export type FieldType = (typeof FIELD_TYPES)[number];
+
+export type TextField = {
+  type: "TEXT";
+  noTokenize?: boolean;
+  noStem?: boolean;
+  from?: string;
 };
 
 export type NumericField = {
@@ -7605,7 +7525,21 @@ export type DateField = {
   from?: string;
 };
 
-export type DetailedField = TextField | NumericField | BoolField | DateField;
+export type KeywordField = {
+  type: "KEYWORD";
+};
+
+export type FacetField = {
+  type: "FACET";
+};
+
+export type DetailedField =
+  | TextField
+  | NumericField
+  | BoolField
+  | DateField
+  | KeywordField
+  | FacetField;
 export type NestedIndexSchema = {
   [key: string]: FieldType | DetailedField | NestedIndexSchema;
 };
@@ -7653,7 +7587,11 @@ type FieldValueType<T extends FieldType> = T extends "TEXT"
       ? boolean
       : T extends "DATE"
         ? string
-        : never;
+        : T extends "KEYWORD"
+          ? string
+          : T extends "FACET"
+            ? string
+            : never;
 
 type GetFieldValueType<TSchema, Path extends string> =
   GetFieldAtPath<TSchema, Path> extends infer Field
@@ -7760,7 +7698,7 @@ type PathToNestedObject<
   TSchema,
   Path extends string,
   Value,
-> = Path extends \`\${ infer First }.\${ infer Rest }\`
+> = Path extends \`\${infer First}.\${infer Rest}\`
   ? { [K in First]: PathToNestedObject<TSchema, Rest, Value> }
   : { [K in Path]: Value };
 
@@ -7837,7 +7775,6 @@ export type PublicQueryResult<
 // These are the operations that can be used for each field type
 type StringOperationMap<T extends string> = {
   $eq: T;
-  $ne: T;
   $in: T[];
   $fuzzy: T | { value: T; distance?: number; transpositionCostOne?: boolean };
   $phrase:
@@ -7851,7 +7788,15 @@ type StringOperationMap<T extends string> = {
 
 type NumberOperationMap<T extends number> = {
   $eq: T;
-  $ne: T;
+  $in: T[];
+  $gt: T;
+  $gte: T;
+  $lt: T;
+  $lte: T;
+};
+
+type KeywordOperationMap<T extends string> = {
+  $eq: T;
   $in: T[];
   $gt: T;
   $gte: T;
@@ -7861,13 +7806,11 @@ type NumberOperationMap<T extends number> = {
 
 type BooleanOperationMap<T extends boolean> = {
   $eq: T;
-  $ne: T;
   $in: T[];
 };
 
 type DateOperationMap<T extends string | Date> = {
   $eq: T;
-  $ne: T;
   $in: T[];
   $gt: T;
   $gte: T;
@@ -7875,6 +7818,11 @@ type DateOperationMap<T extends string | Date> = {
   $lt: T;
 };
 
+type FacetOperationMap<T extends string> = {
+  $eq: T;
+  $in: T[];
+};
+
 // Create union types for each field type
 type StringOperations = {
   [K in keyof StringOperationMap<string>]: { [P in K]: StringOperationMap<string>[K] } & {
@@ -7900,6 +7848,18 @@ type DateOperations = {
   };
 }[keyof DateOperationMap<string | Date>];
 
+type KeywordOperations = {
+  [K in keyof KeywordOperationMap<string>]: { [P in K]: KeywordOperationMap<string>[K] } & {
+    $boost?: number;
+  };
+}[keyof KeywordOperationMap<string>];
+
+type FacetOperations = {
+  [K in keyof FacetOperationMap<string>]: { [P in K]: FacetOperationMap<string>[K] } & {
+    $boost?: number;
+  };
+}[keyof FacetOperationMap<string>];
+
 // Create a union type for all operations for a given field type
 type OperationsForFieldType<T extends FieldType> = T extends "TEXT"
   ? StringOperations
@@ -7909,7 +7869,11 @@ type OperationsForFieldType<T extends FieldType> = T extends "TEXT"
       ? BooleanOperations
       : T extends "DATE"
         ? DateOperations
-        : never;
+        : T extends "KEYWORD"
+          ? KeywordOperations
+          : T extends "FACET"
+            ? FacetOperations
+            : never;
 
 // Create a union type for all operations for a given path
 type PathOperations<TSchema, TPath extends string> =
@@ -8077,45 +8041,1016 @@ type RootOrNode<TSchema extends NestedIndexSchema | FlatIndexSchema> = {
   $and?: never;
   $must?: never;
   $should?: never;
-  $mustNot?: never;
+  $mustNot?: QueryFilter<TSchema> | QueryFilter<TSchema>[];
+};
+
+export type DescribeFieldInfo = {
+  type: FieldType;
+  noTokenize?: boolean;
+  noStem?: boolean;
+  fast?: boolean;
+};
+
+export type IndexDescription<TSchema extends NestedIndexSchema | FlatIndexSchema> = {
+  name: string;
+  dataType: "hash" | "string" | "json";
+  prefixes: string[];
+  language?: Language;
+  schema: Record<SchemaPaths<TSchema>, DescribeFieldInfo>;
+};
+
+export type Language =
+  | "english"
+  | "arabic"
+  | "danish"
+  | "dutch"
+  | "finnish"
+  | "french"
+  | "german"
+  | "greek"
+  | "hungarian"
+  | "italian"
+  | "norwegian"
+  | "portuguese"
+  | "romanian"
+  | "russian"
+  | "spanish"
+  | "swedish"
+  | "tamil"
+  | "turkish";
+
+// Helper type to extract only FACET field paths from schema
+export type FacetPaths<T, Prefix extends string = ""> = {
+  [K in keyof T]: K extends string
+    ? T[K] extends "FACET" | { type: "FACET" }
+      ? Prefix extends ""
+        ? K
+        : \`\${Prefix}\${K}\`
+      : T[K] extends FieldType | DetailedField
+        ? never
+        : T[K] extends object
+          ? FacetPaths<T[K], \`\${Prefix}\${K}.\`>
+          : never
+    : never;
+}[keyof T];
+
+// Aggregate Types
+export type AggregateOptions<TSchema extends NestedIndexSchema | FlatIndexSchema> = {
+  filter?: RootQueryFilter<TSchema>;
+  aggregations: {
+    [key: string]: Aggregation<TSchema>;
+  };
+};
+
+export type Aggregation<TSchema extends NestedIndexSchema | FlatIndexSchema> =
+  | TermsAggregation<TSchema>
+  | RangeAggregation<TSchema>
+  | HistogramAggregation<TSchema>
+  | StatsAggregation<TSchema>
+  | AvgAggregation<TSchema>
+  | SumAggregation<TSchema>
+  | MinAggregation<TSchema>
+  | MaxAggregation<TSchema>
+  | CountAggregation<TSchema>
+  | ExtendedStatsAggregation<TSchema>
+  | PercentilesAggregation<TSchema>
+  | CardinalityAggregation<TSchema>
+  | FacetAggregation<TSchema>;
+
+type BaseAggregation<TSchema extends NestedIndexSchema | FlatIndexSchema> = {
+  $aggs?: {
+    [key: string]: Aggregation<TSchema>;
+  };
+};
+
+export type TermsAggregation<TSchema extends NestedIndexSchema | FlatIndexSchema> =
+  BaseAggregation<TSchema> & {
+    $terms: {
+      field: SchemaPaths<TSchema>;
+      size?: number;
+    };
+  };
+
+export type RangeAggregation<TSchema extends NestedIndexSchema | FlatIndexSchema> =
+  BaseAggregation<TSchema> & {
+    $range: {
+      field: SchemaPaths<TSchema>;
+      ranges: { from?: number; to?: number }[];
+    };
+  };
+
+export type HistogramAggregation<TSchema extends NestedIndexSchema | FlatIndexSchema> =
+  BaseAggregation<TSchema> & {
+    $histogram: {
+      field: SchemaPaths<TSchema>;
+      interval: number;
+    };
+  };
+
+export type StatsAggregation<TSchema extends NestedIndexSchema | FlatIndexSchema> =
+  BaseAggregation<TSchema> & {
+    $stats: {
+      field: SchemaPaths<TSchema>;
+      missing?: number;
+    };
+  };
+
+export type AvgAggregation<TSchema extends NestedIndexSchema | FlatIndexSchema> =
+  BaseAggregation<TSchema> & {
+    $avg: {
+      field: SchemaPaths<TSchema>;
+      missing?: number;
+    };
+  };
+
+export type SumAggregation<TSchema extends NestedIndexSchema | FlatIndexSchema> =
+  BaseAggregation<TSchema> & {
+    $sum: {
+      field: SchemaPaths<TSchema>;
+      missing?: number;
+    };
+  };
+
+export type MinAggregation<TSchema extends NestedIndexSchema | FlatIndexSchema> =
+  BaseAggregation<TSchema> & {
+    $min: {
+      field: SchemaPaths<TSchema>;
+      missing?: number;
+    };
+  };
+
+export type MaxAggregation<TSchema extends NestedIndexSchema | FlatIndexSchema> =
+  BaseAggregation<TSchema> & {
+    $max: {
+      field: SchemaPaths<TSchema>;
+      missing?: number;
+    };
+  };
+
+export type CountAggregation<TSchema extends NestedIndexSchema | FlatIndexSchema> =
+  BaseAggregation<TSchema> & {
+    $count: {
+      field: SchemaPaths<TSchema>;
+    };
+  };
+
+export type ExtendedStatsAggregation<TSchema extends NestedIndexSchema | FlatIndexSchema> =
+  BaseAggregation<TSchema> & {
+    $extendedStats: {
+      field: SchemaPaths<TSchema>;
+      sigma?: number;
+      missing?: number;
+    };
+  };
+
+export type PercentilesAggregation<TSchema extends NestedIndexSchema | FlatIndexSchema> =
+  BaseAggregation<TSchema> & {
+    $percentiles: {
+      field: SchemaPaths<TSchema>;
+      percents?: number[];
+      keyed?: boolean;
+      missing?: number;
+    };
+  };
+
+export type CardinalityAggregation<TSchema extends NestedIndexSchema | FlatIndexSchema> =
+  BaseAggregation<TSchema> & {
+    $cardinality: {
+      field: SchemaPaths<TSchema>;
+    };
+  };
+
+export type FacetAggregation<TSchema extends NestedIndexSchema | FlatIndexSchema> =
+  BaseAggregation<TSchema> & {
+    $facet: {
+      field: FacetPaths<TSchema>;
+      path: string;
+      depth?: number;
+      size?: number;
+      minDocCount?: number;
+      order?: { count: "desc" | "asc" };
+    };
+  };
+
+export type AggregateResult<
+  TSchema extends NestedIndexSchema | FlatIndexSchema,
+  TOpts extends AggregateOptions<TSchema>,
+> = BuildAggregateResult<TSchema, TOpts["aggregations"]>;
+
+type BuildAggregateResult<
+  TSchema extends NestedIndexSchema | FlatIndexSchema,
+  TAggs extends { [key: string]: Aggregation<TSchema> },
+> = {
+  [K in keyof TAggs]: TAggs[K] extends TermsAggregation<TSchema>
+    ? TermsResult<TSchema, TAggs[K]>
+    : TAggs[K] extends RangeAggregation<TSchema>
+      ? RangeResult<TSchema, TAggs[K]>
+      : TAggs[K] extends HistogramAggregation<TSchema>
+        ? HistogramResult<TSchema, TAggs[K]>
+        : TAggs[K] extends StatsAggregation<TSchema>
+          ? StatsResult
+          : TAggs[K] extends AvgAggregation<TSchema>
+            ? MetricValueResult
+            : TAggs[K] extends SumAggregation<TSchema>
+              ? MetricValueResult
+              : TAggs[K] extends MinAggregation<TSchema>
+                ? MetricValueResult
+                : TAggs[K] extends MaxAggregation<TSchema>
+                  ? MetricValueResult
+                  : TAggs[K] extends CountAggregation<TSchema>
+                    ? MetricValueResult
+                    : TAggs[K] extends CardinalityAggregation<TSchema>
+                      ? MetricValueResult
+                      : TAggs[K] extends ExtendedStatsAggregation<TSchema>
+                        ? ExtendedStatsResult<TAggs[K]>
+                        : TAggs[K] extends PercentilesAggregation<TSchema>
+                          ? PercentilesResult<TAggs[K]>
+                          : TAggs[K] extends FacetAggregation<TSchema>
+                            ? FacetResult
+                            : never;
+};
+
+type Bucket<T> = {
+  key: T;
+  docCount: number;
+  from?: number;
+  to?: number;
+};
+
+type TermsResult<
+  TSchema extends NestedIndexSchema | FlatIndexSchema,
+  TAgg extends TermsAggregation<TSchema>,
+> = TAgg["$aggs"] extends { [key: string]: Aggregation<TSchema> }
+  ? {
+      buckets: (Bucket<GetFieldValueType<TSchema, TAgg["$terms"]["field"]>> &
+        BuildAggregateResult<TSchema, TAgg["$aggs"]>)[];
+      sumOtherDocCount: number;
+      docCountErrorUpperBound: number;
+    }
+  : {
+      buckets: Bucket<GetFieldValueType<TSchema, TAgg["$terms"]["field"]>>[];
+      sumOtherDocCount: number;
+      docCountErrorUpperBound: number;
+    };
+
+type RangeResult<
+  TSchema extends NestedIndexSchema | FlatIndexSchema,
+  TAgg extends RangeAggregation<TSchema>,
+> = TAgg["$aggs"] extends { [key: string]: Aggregation<TSchema> }
+  ? {
+      buckets: (Bucket<string> & BuildAggregateResult<TSchema, TAgg["$aggs"]>)[];
+    }
+  : {
+      buckets: Bucket<string>[];
+    };
+
+type HistogramResult<
+  TSchema extends NestedIndexSchema | FlatIndexSchema,
+  TAgg extends HistogramAggregation<TSchema>,
+> = TAgg["$aggs"] extends { [key: string]: Aggregation<TSchema> }
+  ? {
+      buckets: (Bucket<number> & BuildAggregateResult<TSchema, TAgg["$aggs"]>)[];
+    }
+  : {
+      buckets: Bucket<number>[];
+    };
+
+type MetricValueResult = {
+  value: number;
+};
+
+type StatsResult = {
+  count: number;
+  min: number;
+  max: number;
+  sum: number;
+  avg: number;
+};
+
+type ExtendedStatsResult<_TAgg> = {
+  count: number;
+  min: number;
+  max: number;
+  avg: number;
+  sum: number;
+  sumOfSquares: number;
+  variance: number;
+  variancePopulation: number;
+  varianceSampling: number;
+  stdDeviation: number;
+  stdDeviationPopulation: number;
+  stdDeviationSampling: number;
+  stdDeviationBounds: {
+    upper: number;
+    lower: number;
+    upperSampling: number;
+    lowerSampling: number;
+    upperPopulation: number;
+    lowerPopulation: number;
+  };
+};
+
+type PercentilesResult<TAgg> = TAgg extends { $percentiles: { keyed: false } }
+  ? {
+      values: Array<{ key: number; value: number }>;
+    }
+  : {
+      values: { [key: string]: number };
+    };
+
+type FacetChildNode = {
+  path: string;
+  docCount: number;
+  sumOtherDocCount: number;
+  children?: FacetChildNode[];
+};
+
+type FacetResult = {
+  path: string;
+  sumOtherDocCount: number;
+  children: FacetChildNode[];
+};
+
+`;
+
+// src/components/databrowser/components/query-wizard/use-query-wizard.tsx
+var QueryWizardContext = _react.createContext.call(void 0, void 0);
+var QueryWizardProvider = QueryWizardContext.Provider;
+var useQueryWizardFn = () => {
+  return _react.useContext.call(void 0, QueryWizardContext);
+};
+var useGenerateQuery = () => {
+  const queryWizard = useQueryWizardFn();
+  return _reactquery.useMutation.call(void 0, {
+    mutationFn: async ({
+      prompt,
+      searchIndex,
+      sampleData
+    }) => {
+      if (!queryWizard) {
+        throw new Error(
+          "Query Wizard is not configured. Please provide a useQueryWizard prop to RedisBrowser component."
+        );
+      }
+      const result = await queryWizard({
+        prompt,
+        searchIndex,
+        sampleData,
+        searchTypes: SEARCH_TYPES
+      });
+      return result;
+    }
+  });
+};
+
+// src/components/databrowser/components/query-wizard/query-wizard-popover.tsx
+
+var QueryWizardPopover = ({ onClose }) => {
+  const { valuesSearch, setValuesSearchQuery, setQueryBuilderMode } = useTab();
+  const { redisNoPipeline: redis } = useRedis();
+  const [input, setInput] = _react.useState.call(void 0, "");
+  const [sampleData, setSampleData] = _react.useState.call(void 0, []);
+  const [showIndexFields, setShowIndexFields] = _react.useState.call(void 0, false);
+  const { aiDataSharingConsent } = useDatabrowserStore();
+  const { data: indexData, isLoading: isLoadingIndex } = useFetchSearchIndex(valuesSearch.index);
+  const generateQuery = useGenerateQuery();
+  const fetchSampleKeys = _reactquery.useMutation.call(void 0, {
+    mutationFn: async (index) => {
+      const firstTenKeys = await scanKeys(redis, {
+        match: `${_optionalChain([index, 'access', _85 => _85.prefixes, 'optionalAccess', _86 => _86[0]])}*`,
+        type: index.dataType,
+        limit: 10
+      });
+      const dataPromises = firstTenKeys.map(async (key) => {
+        try {
+          if (index.dataType === "json") {
+            const data = await redis.json.get(key);
+            return { key, data };
+          } else if (index.dataType === "hash") {
+            const data = await redis.hgetall(key);
+            return { key, data };
+          } else {
+            const data = await redis.get(key);
+            return { key, data };
+          }
+        } catch (e5) {
+          return null;
+        }
+      });
+      const results = await Promise.all(dataPromises);
+      const filtered = results.filter(Boolean);
+      setSampleData(filtered);
+      return filtered;
+    }
+  });
+  const handleGenerate = async () => {
+    if (!input.trim() || !valuesSearch.index) return;
+    try {
+      let samples = sampleData;
+      if (samples.length === 0 && _optionalChain([indexData, 'optionalAccess', _87 => _87.prefixes, 'optionalAccess', _88 => _88[0]])) {
+        samples = await fetchSampleKeys.mutateAsync(indexData);
+      }
+      const result = await generateQuery.mutateAsync({
+        prompt: input,
+        searchIndex: _nullishCoalesce(indexData, () => ( void 0)),
+        sampleData: samples
+      });
+      const queryString = toJsLiteral(result.query);
+      setValuesSearchQuery(queryString);
+      setQueryBuilderMode("code");
+      _optionalChain([onClose, 'optionalCall', _89 => _89()]);
+    } catch (error) {
+      console.error("Error generating query:", error);
+    }
+  };
+  if (isLoadingIndex) {
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex h-[100px] w-[340px] items-center justify-center rounded-2xl bg-white", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Spinner, { isLoading: true, isLoadingText: "Loading index..." }) });
+  }
+  if (!valuesSearch.index) {
+    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex w-[340px] flex-col items-center gap-2 rounded-2xl bg-white p-8", children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "text-sm font-medium text-zinc-700", children: "No index selected" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "text-center text-xs text-zinc-500", children: "Create a new index to use the Query Wizard." })
+    ] });
+  }
+  if (aiDataSharingConsent === false) {
+    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ConsentPrompt, { onClose });
+  }
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex w-[500px] flex-col gap-6 rounded-2xl bg-white p-6", children: [
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "h3", { className: "text-base font-semibold text-zinc-950", children: "AI Query Builder" }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex items-center justify-center rounded-md bg-purple-100 px-1.5 py-0.5", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "!text-sm font-medium text-purple-700", children: "BETA" }) })
+    ] }),
+    generateQuery.error && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "mt-2 rounded-md border border-yellow-300 bg-yellow-50 p-4", children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "!text-sm font-medium !text-yellow-800", children: generateQuery.error.name }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "mt-0.5 !text-sm !text-yellow-800 opacity-90", children: generateQuery.error.message })
+    ] }),
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col gap-5", children: [
+      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+        "button",
+        {
+          onClick: () => setShowIndexFields(!showIndexFields),
+          className: "flex h-8 items-center gap-1.5 rounded-md border border-zinc-300 bg-zinc-50 px-3 hover:bg-zinc-100",
+          children: [
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+              _iconsreact.IconChevronRight,
+              {
+                className: `size-5 text-zinc-700 transition-transform ${showIndexFields ? "rotate-90" : ""}`
+              }
+            ),
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "text-sm font-medium text-zinc-700", children: "Show Index fields" })
+          ]
+        }
+      ),
+      showIndexFields && indexData && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "rounded-md border border-zinc-200 bg-zinc-50 p-3", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "pre", { className: "max-h-40 overflow-auto text-xs text-zinc-700", children: JSON.stringify(indexData.schema, null, 2) }) }),
+      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col gap-1", children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Label, { htmlFor: "query-input", className: "text-sm font-medium text-zinc-950", children: "Describe" }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+          "textarea",
+          {
+            id: "query-input",
+            value: input,
+            onChange: (e) => setInput(e.target.value),
+            placeholder: "",
+            className: "h-[58px] w-full resize-none rounded-md border border-zinc-300 bg-white px-3 py-3 text-sm text-zinc-950 shadow-sm focus:border-purple-500 focus:outline-none focus:ring-1 focus:ring-purple-500 disabled:cursor-not-allowed disabled:opacity-50",
+            disabled: generateQuery.isPending || fetchSampleKeys.isPending,
+            autoFocus: true
+          }
+        ),
+        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { children: [
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "text-xs text-zinc-500", children: 'Example: Find people named "John", boost if older than 20.' }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DocsLink, { href: "https://upstash-search.mintlify.app/redis/search/query-operators/boolean-operators/overview" })
+        ] })
+      ] })
+    ] }),
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center justify-end gap-2", children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        "button",
+        {
+          onClick: onClose,
+          disabled: generateQuery.isPending || fetchSampleKeys.isPending,
+          className: "flex h-8 items-center justify-center rounded-md border border-zinc-300 bg-white px-4 text-sm text-zinc-950 shadow-[0_1px_1px_rgba(0,0,0,0.05)] hover:bg-zinc-50 disabled:cursor-not-allowed disabled:opacity-50",
+          children: "Cancel"
+        }
+      ),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        "button",
+        {
+          onClick: handleGenerate,
+          disabled: !input.trim() || generateQuery.isPending || fetchSampleKeys.isPending,
+          className: "flex h-8 items-center justify-center gap-2 rounded-md bg-purple-500 px-4 text-sm text-white shadow-[0_1px_1px_rgba(0,0,0,0.05)] hover:bg-purple-600 disabled:cursor-not-allowed disabled:opacity-50 disabled:hover:bg-purple-500",
+          children: fetchSampleKeys.isPending ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Spinner, { isLoading: true }),
+            "Sampling keys..."
+          ] }) : generateQuery.isPending ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Spinner, { isLoading: true }),
+            "Generating..."
+          ] }) : "Generate Query"
+        }
+      )
+    ] })
+  ] });
+};
+
+// src/components/databrowser/components/search/create-index-modal.tsx
+
+var CreateIndexModal = ({
+  open,
+  onOpenChange
+}) => {
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Dialog, { open, onOpenChange, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+    DialogContent,
+    {
+      className: "max-w-2xl",
+      onEscapeKeyDown: (e) => {
+        const active = document.activeElement;
+        if (_optionalChain([active, 'optionalAccess', _90 => _90.closest, 'call', _91 => _91(".monaco-editor")]) || _optionalChain([active, 'optionalAccess', _92 => _92.tagName]) === "TEXTAREA") {
+          e.preventDefault();
+        }
+      },
+      children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DialogHeader, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DialogTitle, { children: "Create new Index" }) }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "sr-only", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DialogDescription, { children: "Create new search index" }) }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SearchDisplay, { isCreateModal: true, onClose: () => onOpenChange(false) })
+      ]
+    }
+  ) });
+};
+
+// src/components/databrowser/components/search/edit-index-modal.tsx
+
+
+var EditIndexModal = ({
+  open,
+  onOpenChange,
+  indexName
+}) => {
+  const { data: indexData, isLoading: isIndexLoading } = useFetchSearchIndex(indexName, {
+    enabled: open
+  });
+  _react.useEffect.call(void 0, () => {
+    if (open && !isIndexLoading && indexData === null) {
+      onOpenChange(false);
+    }
+  }, [indexData, onOpenChange, isIndexLoading, open]);
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Dialog, { open, onOpenChange, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+    DialogContent,
+    {
+      className: "min-h-[500px] max-w-2xl",
+      onEscapeKeyDown: (e) => {
+        const active = document.activeElement;
+        if (_optionalChain([active, 'optionalAccess', _93 => _93.closest, 'call', _94 => _94(".monaco-editor")]) || _optionalChain([active, 'optionalAccess', _95 => _95.tagName]) === "TEXTAREA") {
+          e.preventDefault();
+        }
+      },
+      children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DialogHeader, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DialogTitle, { children: "Edit Index" }) }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "sr-only", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DialogDescription, { children: "Edit search index schema" }) }),
+        indexName && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SearchDisplay, { indexName, isEditModal: true, onClose: () => onOpenChange(false) })
+      ]
+    }
+  ) });
+};
+
+// src/components/databrowser/components/header/refresh-button.tsx
+
+
+// src/components/common/reload-button.tsx
+
+
+
+var ReloadButton = ({
+  onClick,
+  isLoading: isLoadingProp,
+  tooltip = "Refresh"
+}) => {
+  const [isLoading, setIsLoading] = _react.useState.call(void 0, false);
+  const handleClick = () => {
+    setIsLoading(true);
+    onClick();
+    setTimeout(() => {
+      setIsLoading(false);
+    }, 350);
+  };
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SimpleTooltip, { content: tooltip, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    Button,
+    {
+      variant: "outline",
+      size: "icon",
+      onClick: handleClick,
+      disabled: isLoading || isLoadingProp,
+      children: isLoading ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _iconsreact.IconLoader2, { className: "size-5 animate-spin text-zinc-500" }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _iconsreact.IconRefresh, { className: "size-5 text-zinc-500 dark:text-zinc-600" })
+    }
+  ) }) });
+};
+
+// src/components/databrowser/components/header/refresh-button.tsx
+
+var invalidateAll = () => {
+  queryClient.invalidateQueries({ queryKey: [FETCH_KEYS_QUERY_KEY] });
+  queryClient.invalidateQueries({ queryKey: [FETCH_LIST_ITEMS_QUERY_KEY] });
+  queryClient.invalidateQueries({ queryKey: [FETCH_SIMPLE_KEY_QUERY_KEY] });
+  queryClient.invalidateQueries({ queryKey: [FETCH_KEY_TYPE_QUERY_KEY] });
+};
+var RefreshButton = () => {
+  const { query } = useKeys();
+  const { isValuesSearchSelected, valuesSearch } = useTab();
+  const { redisNoPipeline: redis } = useRedis();
+  const reindex = _reactquery.useMutation.call(void 0, {
+    mutationFn: async () => {
+      if (isValuesSearchSelected && valuesSearch.index) {
+        await redis.search.index({ name: valuesSearch.index }).waitIndexing();
+      }
+    },
+    onSettled: invalidateAll
+  });
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    ReloadButton,
+    {
+      onClick: () => reindex.mutate(),
+      isLoading: query.isFetching || reindex.isPending,
+      tooltip: isValuesSearchSelected ? "Reindex & Refresh Query" : "Refresh Scan"
+    }
+  );
+};
+
+// src/components/databrowser/components/header/search-input.tsx
+
+
+
+var dedupeSearchHistory = (history) => {
+  const seen = /* @__PURE__ */ new Set();
+  return history.filter((item) => {
+    if (!item || seen.has(item)) return false;
+    seen.add(item);
+    return true;
+  });
+};
+var SearchInput = () => {
+  const { setSearchKey, search } = useTab();
+  const { searchHistory, addSearchHistory } = useDatabrowserStore();
+  const [state, setState] = _react.useState.call(void 0, search.key);
+  const [isFocus, setIsFocus] = _react.useState.call(void 0, false);
+  const [focusedIndex, setFocusedIndex] = _react.useState.call(void 0, -1);
+  const inputRef = _react.useRef.call(void 0, null);
+  const historyItemRefs = _react.useRef.call(void 0, []);
+  const handleSubmit = (value) => {
+    if (value.trim() !== "" && !value.includes("*")) value = `${value}*`;
+    addSearchHistory(value);
+    setSearchKey(value);
+    setState(value);
+  };
+  const filteredHistory = dedupeSearchHistory(
+    searchHistory.filter((item) => item.trim() !== "" && item.trim() !== "*").filter((item) => item.includes(state) && item !== state)
+  ).slice(0, 5).map((item) => item.endsWith("*") ? item.slice(0, -1) : item);
+  _react.useEffect.call(void 0, () => {
+    setFocusedIndex(-1);
+  }, [filteredHistory.length]);
+  const handleKeyDown = (e) => {
+    if (e.key === "Enter") {
+      const text = focusedIndex >= 0 && focusedIndex < filteredHistory.length ? filteredHistory[focusedIndex] : e.currentTarget.value;
+      handleSubmit(text);
+    } else if (e.key === "Escape") {
+      setState("");
+      setFocusedIndex(-1);
+      _optionalChain([inputRef, 'access', _96 => _96.current, 'optionalAccess', _97 => _97.blur, 'call', _98 => _98()]);
+    } else if (e.key === "ArrowDown" || e.key === "Tab" && !e.shiftKey) {
+      e.preventDefault();
+      if (focusedIndex < filteredHistory.length - 1) {
+        setFocusedIndex(focusedIndex + 1);
+      } else if (filteredHistory.length > 0) {
+        setFocusedIndex(0);
+      }
+    } else if (e.key === "ArrowUp" || e.key === "Tab" && e.shiftKey) {
+      e.preventDefault();
+      if (focusedIndex > 0) {
+        setFocusedIndex(focusedIndex - 1);
+      } else if (filteredHistory.length > 0 && focusedIndex === 0) {
+        setFocusedIndex(-1);
+        _optionalChain([inputRef, 'access', _99 => _99.current, 'optionalAccess', _100 => _100.focus, 'call', _101 => _101()]);
+      } else if (filteredHistory.length > 0) {
+        setFocusedIndex(filteredHistory.length - 1);
+      }
+    }
+  };
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "relative grow", children: [
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, Popover, { open: isFocus && filteredHistory.length > 0, children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, PopoverTrigger, { asChild: true, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-8 rounded-md border border-zinc-300 font-normal", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        Input,
+        {
+          ref: inputRef,
+          placeholder: "Search",
+          className: "h-full border-none pr-6",
+          onKeyDown: handleKeyDown,
+          onChange: (e) => {
+            setState(e.currentTarget.value);
+            if (e.currentTarget.value.trim() === "") handleSubmit("");
+          },
+          value: state,
+          onFocus: () => {
+            setIsFocus(true);
+            setFocusedIndex(-1);
+          },
+          onBlur: () => setIsFocus(false)
+        }
+      ) }) }),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        PopoverContent,
+        {
+          className: "w-[--radix-popover-trigger-width] divide-y px-3 py-2 text-[13px] text-zinc-900",
+          autoFocus: false,
+          onOpenAutoFocus: (e) => {
+            e.preventDefault();
+            e.stopPropagation();
+          },
+          children: filteredHistory.map((item, index) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "w-full py-[3px]", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            "button",
+            {
+              ref: (el) => {
+                historyItemRefs.current[index] = el;
+              },
+              onClick: () => handleSubmit(item),
+              onMouseEnter: () => setFocusedIndex(index),
+              className: `block w-full truncate rounded-sm p-1 text-left transition-colors ${focusedIndex === index ? "bg-zinc-100" : "hover:bg-zinc-100"}`,
+              children: item
+            }
+          ) }, item))
+        }
+      )
+    ] }),
+    state && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+      Button,
+      {
+        type: "button",
+        variant: "link",
+        size: "icon",
+        className: "absolute right-1 top-1/2 h-5 w-5 -translate-y-1/2 text-zinc-500 hover:text-zinc-900",
+        onClick: () => {
+          setSearchKey("");
+          setState("");
+        },
+        children: [
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _iconsreact.IconX, { size: 16 }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "sr-only", children: "Clear" })
+        ]
+      }
+    ),
+    " "
+  ] });
+};
+
+// src/components/databrowser/components/header/type-selector.tsx
+
+var ALL_TYPES_KEY = "all";
+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__ */ _jsxruntime.jsxs.call(void 0, 
+    Select,
+    {
+      onValueChange: (type) => {
+        if (type === ALL_TYPES_KEY) {
+          setSearchType(void 0);
+        } else {
+          setSearchType(type);
+        }
+      },
+      value: search.type === void 0 ? ALL_TYPES_KEY : search.type,
+      children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectTrigger, { className: "!w-auto shrink-0 select-none whitespace-nowrap border-zinc-300 pr-8", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectValue, {}) }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectContent, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectGroup, { children: entries.map(([key, value]) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectItem, { value: key, children: value }, key)) }) })
+      ]
+    }
+  );
+}
+
+// src/components/databrowser/components/header/index.tsx
+
+var Header = ({ tabType, allowSearch }) => {
+  const { isValuesSearchSelected, setIsValuesSearchSelected } = useTab();
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center justify-between gap-1.5", children: [
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex grow items-center gap-1.5", children: [
+      tabType === "all" && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+        Segmented,
+        {
+          options: [
+            {
+              key: "keys",
+              label: "Keys"
+            },
+            {
+              key: "values",
+              label: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center gap-1", children: [
+                "Search",
+                /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex h-[18px] items-center rounded-md bg-emerald-100 px-[5px] text-[11px] text-emerald-700", children: "NEW" })
+              ] })
+            }
+          ],
+          value: isValuesSearchSelected ? "values" : "keys",
+          onChange: (value) => {
+            setIsValuesSearchSelected(value === "values");
+          },
+          className: "bg-emerald-800",
+          unselectedClassName: "text-emerald-100",
+          selectedClassName: "bg-emerald-50 text-emerald-800"
+        }
+      ),
+      isValuesSearchSelected ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, IndexSelector, {}) : /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DataTypeSelector, { allowSearch }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SearchInput, {})
+      ] })
+    ] }),
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center gap-1.5", children: [
+      isValuesSearchSelected && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, WizardButton, {}),
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, RefreshButton, {}),
+      isValuesSearchSelected ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, AddIndexButton, {}) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, AddKeyModal, {})
+    ] })
+  ] });
+};
+var IndexSelector = () => {
+  const {
+    valuesSearch: { index },
+    setValuesSearchIndex
+  } = useTab();
+  const { data: indexes, isLoading } = useFetchSearchIndexes();
+  const [open, setOpen] = _react.useState.call(void 0, false);
+  _react.useEffect.call(void 0, () => {
+    if (!indexes || isLoading) return;
+    if (index && !indexes.includes(index)) {
+      setValuesSearchIndex("");
+    } else if (!index && indexes.length > 0) {
+      setValuesSearchIndex(indexes[0]);
+    }
+  }, [indexes, index, isLoading, setValuesSearchIndex]);
+  const [search, setSearch] = _react.useState.call(void 0, "");
+  const [editingIndex, setEditingIndex] = _react.useState.call(void 0, );
+  const filteredIndexes = _optionalChain([indexes, 'optionalAccess', _102 => _102.filter, 'call', _103 => _103((idx) => idx.toLowerCase().includes(search.toLowerCase()))]);
+  const handleEditIndex = (indexName) => {
+    setOpen(false);
+    setEditingIndex(indexName);
+  };
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex", children: [
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex items-center rounded-l-lg border border-r-0 border-zinc-300 bg-white px-3 text-sm text-zinc-700", children: "Index" }),
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+      Popover,
+      {
+        open,
+        onOpenChange: (isOpen) => {
+          setOpen(isOpen);
+          if (!isOpen) setSearch("");
+        },
+        modal: false,
+        children: [
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, PopoverTrigger, { asChild: true, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "button", { className: "flex min-w-[140px] items-center justify-between gap-2 rounded-r-lg border border-zinc-300 bg-emerald-50 px-3 py-[5px] text-sm font-medium text-emerald-800 transition-colors hover:bg-emerald-100", children: [
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "truncate", children: index || "Select an index" }),
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _iconsreact.IconChevronDown, { className: "size-4 shrink-0 opacity-50" })
+          ] }) }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, PopoverContent, { className: "p-2", align: "center", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex flex-col gap-2", children: [
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, CreateIndexButton, {}),
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-px bg-zinc-100" }),
+            /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex h-9 items-center rounded-md border border-zinc-300 px-2", children: [
+              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _iconsreact.IconSearch, { className: "size-5 text-zinc-400" }),
+              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                "input",
+                {
+                  value: search,
+                  onChange: (e) => setSearch(e.target.value),
+                  placeholder: "Search Index",
+                  className: "flex h-full w-full bg-transparent px-2 py-3 text-sm outline-none placeholder:text-zinc-400"
+                }
+              )
+            ] }),
+            /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "max-h-[200px] overflow-y-auto", children: [
+              _optionalChain([filteredIndexes, 'optionalAccess', _104 => _104.length]) === 0 && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "py-4 text-center text-sm text-zinc-500", children: "No indexes found" }),
+              _optionalChain([filteredIndexes, 'optionalAccess', _105 => _105.map, 'call', _106 => _106((idx) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+                "div",
+                {
+                  className: "flex h-9 items-center rounded-md px-2 transition-colors hover:bg-zinc-100 dark:hover:bg-zinc-200",
+                  children: [
+                    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+                      "button",
+                      {
+                        onClick: () => {
+                          setValuesSearchIndex(idx);
+                          setOpen(false);
+                        },
+                        className: "flex flex-1 items-center gap-2 text-left text-sm",
+                        children: [
+                          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                            "span",
+                            {
+                              className: cn(
+                                "flex size-5 items-center justify-center",
+                                idx === index ? "text-emerald-600" : "text-transparent"
+                              ),
+                              children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _iconsreact.IconCircleCheck, { className: "size-5" })
+                            }
+                          ),
+                          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "truncate", children: idx })
+                        ]
+                      }
+                    ),
+                    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                      "button",
+                      {
+                        onClick: (event) => {
+                          event.stopPropagation();
+                          event.preventDefault();
+                          handleEditIndex(idx);
+                        },
+                        className: "ml-2 text-sm text-zinc-500 underline hover:text-zinc-700",
+                        children: "Edit"
+                      }
+                    )
+                  ]
+                },
+                idx
+              ))])
+            ] })
+          ] }) })
+        ]
+      }
+    ),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      EditIndexModal,
+      {
+        open: Boolean(editingIndex),
+        onOpenChange: (isOpen) => !isOpen && setEditingIndex(void 0),
+        indexName: editingIndex
+      }
+    )
+  ] });
+};
+var CreateIndexButton = () => {
+  const [open, setOpen] = _react.useState.call(void 0, false);
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+      "button",
+      {
+        onClick: (e) => {
+          e.stopPropagation();
+          setOpen(true);
+        },
+        className: "flex h-9 w-full items-center gap-2 rounded-md px-2 text-sm text-emerald-600 transition-colors hover:bg-zinc-100 dark:hover:bg-zinc-200",
+        children: [
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _iconsreact.IconCirclePlus, { className: "size-5" }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "underline", children: "Create a new Index" })
+        ]
+      }
+    ),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, CreateIndexModal, { open, onOpenChange: setOpen })
+  ] });
 };
-
-export type DescribeFieldInfo = {
-  type: FieldType;
-  noTokenize?: boolean;
-  noStem?: boolean;
-  fast?: boolean;
+var AddIndexButton = () => {
+  const [open, setOpen] = _react.useState.call(void 0, false);
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SimpleTooltip, { content: "Create new Index", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+      Button,
+      {
+        variant: "primary",
+        onClick: () => setOpen(true),
+        className: "flex h-8 select-none items-center gap-1 rounded-lg pl-2 pr-3 text-sm font-medium",
+        children: [
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _iconsreact.IconPlus, { className: "size-5" }),
+          "Index"
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, CreateIndexModal, { open, onOpenChange: setOpen })
+  ] });
+};
+var WizardButton = () => {
+  const queryWizard = useQueryWizardFn();
+  const [open, setOpen] = _react.useState.call(void 0, false);
+  if (!queryWizard) return null;
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, Popover, { open, onOpenChange: setOpen, modal: false, children: [
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SimpleTooltip, { content: "Query Wizard", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, PopoverTrigger, { asChild: true, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Button, { size: "icon", "aria-label": "Query Wizard", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _iconsreact.IconSparkles, { className: "size-4 text-zinc-500" }) }) }) }),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      PopoverContent,
+      {
+        side: "bottom",
+        align: "end",
+        alignOffset: -124,
+        avoidCollisions: false,
+        className: "w-auto p-0",
+        children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, QueryWizardPopover, { onClose: () => setOpen(false) })
+      }
+    )
+  ] });
 };
 
-export type IndexDescription<TSchema extends NestedIndexSchema | FlatIndexSchema> = {
-  name: string;
-  dataType: "hash" | "string" | "json";
-  prefixes: string[];
-  language?: Language;
-  schema: Record<SchemaPaths<TSchema>, DescribeFieldInfo>;
+// src/components/databrowser/components/header-error.tsx
+
+var HeaderError = () => {
+  const { query } = useKeys();
+  if (!query.error) return null;
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "text-sm text-red-600 dark:text-red-400", children: formatUpstashErrorMessage(query.error) });
 };
 
-export type Language =
-  | "english"
-  | "arabic"
-  | "danish"
-  | "dutch"
-  | "finnish"
-  | "french"
-  | "german"
-  | "greek"
-  | "hungarian"
-  | "italian"
-  | "norwegian"
-  | "portuguese"
-  | "romanian"
-  | "russian"
-  | "spanish"
-  | "swedish"
-  | "tamil"
-  | "turkish";
+// src/components/databrowser/components/search/query-editor.tsx
 
-`;
 
 // src/components/databrowser/components/search/generate-query-type-definitions.tsx
 var buildNestedSchema = (flatSchema) => {
@@ -8148,7 +9083,7 @@ var generateNestedInterface = (obj, indent = "  ") => {
 var toAmbientTypes = (types) => types.replaceAll(/export const (\w+) = (\[.*?]) as const;/g, "declare const $1: readonly $2;").replaceAll("export ", "");
 var generateTypeDefinitions = (schema) => {
   let schemaFieldsInterface = "";
-  const schemaFields = _optionalChain([schema, 'optionalAccess', _89 => _89.schema]);
+  const schemaFields = _optionalChain([schema, 'optionalAccess', _107 => _107.schema]);
   if (schemaFields && Object.keys(schemaFields).length > 0) {
     const nested = buildNestedSchema(schemaFields);
     const fieldLines = generateNestedInterface(nested);
@@ -8203,32 +9138,57 @@ var QueryBuilder = () => {
   const { valuesSearch, setValuesSearchQuery } = useTab();
   const { data: indexDetails } = useFetchSearchIndex(valuesSearch.index);
   const editorValue = PREFIX + (valuesSearch.query || "{}");
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex h-full flex-col rounded-lg border border-zinc-300 bg-white px-[6px]", children: [
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "min-h-0 flex-1", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      QueryEditor,
-      {
-        value: editorValue,
-        onChange: (value) => {
-          const queryPart = value.slice(PREFIX.length);
-          setValuesSearchQuery(queryPart);
-        },
-        schema: indexDetails
-      }
-    ) }),
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex items-center justify-end px-2 pb-1.5", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-      "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__ */ _jsxruntime.jsx.call(void 0, _iconsreact.IconExternalLink, { size: 12 })
-        ]
+  if (!indexDetails) return;
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex h-full flex-col rounded-lg border border-zinc-300 bg-white px-[6px]", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "relative min-h-0 flex-1", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "absolute inset-0", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    QueryEditor,
+    {
+      value: editorValue,
+      onChange: (value) => {
+        const queryPart = value.slice(PREFIX.length);
+        setValuesSearchQuery(queryPart);
+      },
+      schema: indexDetails
+    }
+  ) }) }) });
+};
+
+// src/components/databrowser/components/query-builder-error.tsx
+
+
+var ERROR_TIMEOUT = 5e3;
+var QueryBuilderError = ({
+  error,
+  autoHide
+}) => {
+  const [visible, setVisible] = _react.useState.call(void 0, false);
+  const [displayedError, setDisplayedError] = _react.useState.call(void 0, );
+  _react.useEffect.call(void 0, () => {
+    let timeout;
+    if (error) {
+      setDisplayedError(error);
+      setVisible(true);
+      if (autoHide) {
+        timeout = setTimeout(() => setVisible(false), ERROR_TIMEOUT);
       }
-    ) })
-  ] });
+    } else {
+      setVisible(false);
+    }
+    return () => clearTimeout(timeout);
+  }, [error, autoHide]);
+  if (!displayedError) return;
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    "p",
+    {
+      className: cn(
+        "absolute bottom-2 left-2 z-[2] max-w-[70%] rounded-md bg-red-50 px-3 py-1.5 text-sm text-red-600 shadow-sm",
+        visible ? "duration-200 animate-in fade-in slide-in-from-bottom-1" : "duration-200 animate-out fade-out slide-out-to-bottom-1 fill-mode-forwards"
+      ),
+      onAnimationEnd: () => {
+        if (!visible) setDisplayedError(void 0);
+      },
+      children: displayedError
+    }
+  );
 };
 
 // src/components/databrowser/components/search-empty-state.tsx
@@ -8389,7 +9349,7 @@ var ImportSampleDatasetModal = ({
         if (await index.describe()) {
           await index.drop();
         }
-      } catch (e5) {
+      } catch (e6) {
       }
       await redis.search.createIndex({
         dataType: "string",
@@ -8483,7 +9443,7 @@ var ImportSampleDatasetModal = ({
 
 var SearchEmptyState = () => {
   const [importModalOpen, setImportModalOpen] = _react.useState.call(void 0, false);
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "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: [
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "mx-auto flex h-full w-full gap-8 rounded-xl border border-zinc-200 bg-gradient-to-b from-zinc-50 to-white p-8", children: [
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ImportSampleDatasetModal, { open: importModalOpen, onOpenChange: setImportModalOpen }),
     /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex-1", children: [
       /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "h2", { className: "mb-2 text-lg font-semibold text-zinc-900", children: "Redis Search" }),
@@ -8525,7 +9485,7 @@ var SearchEmptyState = () => {
         }
       )
     ] }),
-    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "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__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex w-[350px] flex-col items-center justify-center rounded-lg border bg-gradient-to-b from-zinc-50 to-white p-6 shadow-sm", children: [
       /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "mb-4 flex h-12 w-12 items-center justify-center rounded-xl bg-emerald-100 text-emerald-600", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _iconsreact.IconSparkles, { size: 24 }) }),
       /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "h3", { className: "mb-1 text-sm font-medium text-zinc-900", children: "Try it out" }),
       /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "mb-4 text-center text-xs text-zinc-500", children: "Load a sample dataset to explore Redis Search" }),
@@ -8560,7 +9520,7 @@ var Empty = () => {
 
 
 var SidebarContextMenu = ({ children }) => {
-  const { mutate: deleteKey } = useDeleteKey();
+  const { mutateAsync: deleteKey } = useDeleteKey();
   const [isAlertOpen, setAlertOpen] = _react.useState.call(void 0, false);
   const [contextKeys, setContextKeys] = _react.useState.call(void 0, []);
   const {
@@ -8569,7 +9529,7 @@ var SidebarContextMenu = ({ children }) => {
     selectTab,
     setSearch
   } = useDatabrowserStore();
-  const { search: currentSearch, selectedKeys } = useTab();
+  const { search: currentSearch, selectedKeys, isValuesSearchSelected } = useTab();
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
       DeleteKeyModal,
@@ -8578,11 +9538,10 @@ var SidebarContextMenu = ({ children }) => {
         count: contextKeys.length,
         open: isAlertOpen,
         onOpenChange: setAlertOpen,
-        onDeleteConfirm: (e) => {
+        showReindex: isValuesSearchSelected,
+        onDeleteConfirm: async (e, options) => {
           e.stopPropagation();
-          for (const key of contextKeys) {
-            deleteKey(key);
-          }
+          await deleteKey({ keys: contextKeys, reindex: _optionalChain([options, 'optionalAccess', _108 => _108.reindex]) });
           setAlertOpen(false);
         }
       }
@@ -8745,14 +9704,14 @@ var LoadingSkeleton = () => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div",
 
 function Sidebar() {
   const { keys, query } = useKeys();
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "flex h-full flex-col gap-2", children: query.isLoading && keys.length === 0 ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, LoadingSkeleton, {}) : keys.length > 0 ? (
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "relative flex h-full flex-col gap-2", children: query.isLoading && keys.length === 0 ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, LoadingSkeleton, {}) : keys.length > 0 ? (
     // Infinite scroll already has a loader at the bottom
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
       InfiniteScroll,
       {
         query,
         disableRoundedInherit: true,
-        className: "min-h-0 rounded-xl bg-zinc-100 px-2 py-5 pr-4 dark:bg-zinc-200",
+        className: "h-full min-h-0 rounded-xl bg-zinc-100 px-2 py-5 pr-4 dark:bg-zinc-200",
         scrollBarClassName: "py-5",
         children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, KeysList, {})
       }
@@ -8767,21 +9726,13 @@ function Sidebar() {
 
 
 // src/components/databrowser/components/ui-query-builder/types.ts
-var STRING_OPERATORS = [
-  "eq",
-  "ne",
-  "in",
-  "phrase",
-  "regex",
-  "fuzzy",
-  "smart"
-];
-var NUMBER_OPERATORS = ["eq", "ne", "gt", "gte", "lt", "lte", "in"];
-var BOOLEAN_OPERATORS = ["eq", "ne", "in"];
-var DATE_OPERATORS = ["eq", "ne", "gt", "gte", "lt", "lte", "in"];
+var STRING_OPERATORS = ["smart", "eq", "in", "phrase", "regex", "fuzzy"];
+var NUMBER_OPERATORS = ["eq", "gt", "gte", "lt", "lte"];
+var BOOLEAN_OPERATORS = ["eq"];
+var DATE_OPERATORS = NUMBER_OPERATORS;
 var ALL_OPERATORS = [
+  "smart",
   "eq",
-  "ne",
   "gt",
   "gte",
   "lt",
@@ -8789,12 +9740,23 @@ var ALL_OPERATORS = [
   "in",
   "phrase",
   "regex",
-  "fuzzy",
-  "smart"
+  "fuzzy"
 ];
+var OPERATOR_DESCRIPTIONS = {
+  eq: "Equals",
+  gt: "Greater than",
+  gte: "Greater than or equal",
+  lt: "Less than",
+  lte: "Less than or equal",
+  in: "Matches any of the given values, comma separated",
+  phrase: "Matches an exact phrase",
+  regex: "Matches a regular expression pattern",
+  fuzzy: "Approximate match with custom edit distance",
+  smart: "Default opinionated matching algorithm"
+};
 var OPERATOR_OPTIONS = [
+  { value: "smart", label: "smart" },
   { value: "eq", label: "eq" },
-  { value: "ne", label: "ne" },
   { value: "gt", label: "gt" },
   { value: "gte", label: "gte" },
   { value: "lt", label: "lt" },
@@ -8802,8 +9764,7 @@ var OPERATOR_OPTIONS = [
   { value: "in", label: "in" },
   { value: "phrase", label: "phrase" },
   { value: "regex", label: "regex" },
-  { value: "fuzzy", label: "fuzzy" },
-  { value: "smart", label: "smart" }
+  { value: "fuzzy", label: "fuzzy" }
 ];
 var getOperatorsForFieldType = (fieldType) => {
   switch (fieldType) {
@@ -8845,7 +9806,7 @@ var hasMustShouldCombination = (queryString) => {
     const obj = parseJSObjectLiteral(queryString);
     if (!obj) return false;
     return hasMustShouldCombinationInObject(obj);
-  } catch (e6) {
+  } catch (e7) {
     return false;
   }
 };
@@ -8871,12 +9832,13 @@ var isFieldConditionObject = (obj) => {
 };
 var parseFieldCondition = (field, fieldValue) => {
   if (!isFieldConditionObject(fieldValue)) {
+    const operator2 = typeof fieldValue === "boolean" || typeof fieldValue === "number" ? "eq" : "smart";
     return {
       id: generateId(),
       type: "condition",
       condition: {
         field,
-        operator: "eq",
+        operator: operator2,
         value: fieldValue
       }
     };
@@ -8907,20 +9869,23 @@ var parseFieldCondition = (field, fieldValue) => {
       break;
     }
   }
+  if (operator === "smart" && (typeof value === "boolean" || typeof value === "number")) {
+    operator = "eq";
+  }
   if ("$boost" in fieldObj) {
     boost = fieldObj.$boost;
   }
   return {
     id: generateId(),
     type: "condition",
+    boost,
     condition: {
       field,
       operator,
       value,
       fuzzyDistance,
       phraseSlop,
-      phrasePrefix,
-      boost
+      phrasePrefix
     }
   };
 };
@@ -8930,6 +9895,10 @@ var parseMultiFieldObject = (obj, operator) => {
   for (const [key, value] of Object.entries(obj)) {
     if (key === "$boost") {
       boost = value;
+    } else if (key === "$and" || key === "$or") {
+      const nestedOp = key === "$and" ? "and" : "or";
+      const nestedGroup = parseGroup(value, nestedOp);
+      if (nestedGroup) children.push(nestedGroup);
     } else if (!isOperatorKey(key)) {
       children.push(parseFieldCondition(key, value));
     }
@@ -9000,11 +9969,29 @@ var objectToQueryNode = (obj) => {
     const operator = "$and" in obj ? "and" : "or";
     const groupValue = _nullishCoalesce(obj["$and"], () => ( obj["$or"]));
     const boost = "$boost" in obj ? obj.$boost : void 0;
-    const groupNode = parseGroup(groupValue, operator, boost);
+    const groupNode = parseGroup(
+      groupValue,
+      operator,
+      nonOperatorKeys.length === 0 ? boost : void 0
+    );
     if (groupNode && groupNode.type === "group" && hasMustNot) {
       addMustNotChildren(groupNode, obj.$mustNot);
     }
-    return groupNode;
+    if (!groupNode || nonOperatorKeys.length === 0) {
+      return groupNode;
+    }
+    const fieldChildren = nonOperatorKeys.map((key) => parseFieldCondition(key, obj[key]));
+    const group = {
+      id: generateId(),
+      type: "group",
+      groupOperator: "and",
+      children: [...fieldChildren, groupNode],
+      boost
+    };
+    if (hasMustNot) {
+      addMustNotChildren(group, obj.$mustNot);
+    }
+    return group;
   }
   if (hasMustNot) {
     if (nonOperatorKeys.length > 0) {
@@ -9053,7 +10040,7 @@ var parseQueryStringWithError = (queryString) => {
       }
       return { success: true, state: { root: root2 } };
     }
-  } catch (e7) {
+  } catch (e8) {
   }
   return { success: false, error: "Failed to parse query" };
 };
@@ -9240,8 +10227,7 @@ var moveNodeInTree = (root2, nodeId, newParentId, newIndex) => {
 
 
 
-// src/components/databrowser/components/ui-query-builder/condition-common.tsx
-
+// src/components/databrowser/components/ui-query-builder/boost-badge.tsx
 
 
 // src/components/databrowser/components/ui-query-builder/dynamic-width-input.tsx
@@ -9294,7 +10280,7 @@ var DynamicWidthInput = ({
   );
 };
 
-// src/components/databrowser/components/ui-query-builder/condition-common.tsx
+// src/components/databrowser/components/ui-query-builder/boost-badge.tsx
 
 var BoostBadge = ({
   node,
@@ -9325,7 +10311,13 @@ var BoostBadge = ({
   const labelBg = isNegative ? "bg-red-50" : "bg-purple-50";
   const textColor = isNegative ? "text-red-800" : "text-purple-800";
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "span", { className: "relative flex h-[26px] items-center overflow-hidden rounded-md border border-zinc-300 text-sm font-medium", children: [
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: `flex h-full items-center px-2 ${labelBg} ${textColor}`, children: isNegative ? "Demote" : "Boost" }),
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, Tooltip, { delayDuration: 200, children: [
+      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, TooltipTrigger, { asChild: true, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: `flex h-full cursor-default items-center px-2 ${labelBg} ${textColor}`, children: isNegative ? "Demote" : "Boost" }) }),
+      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, TooltipContent, { side: "bottom", className: "max-w-xs", children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { children: isNegative ? `Multiplies this condition's score by ${_nullishCoalesce(node.boost, () => ( 0))}, subtracting from the total.` : `Multiplies this condition's score by ${_nullishCoalesce(node.boost, () => ( 0))}.` }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DocsLink, { href: "https://upstash-search.mintlify.app/redis/search/query-operators/boolean-operators/boost" })
+      ] })
+    ] }),
     isStatic ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: `px-2 ${textColor}`, children: node.boost }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "flex h-full items-center bg-white px-2", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
       DynamicWidthInput,
       {
@@ -9339,7 +10331,33 @@ var BoostBadge = ({
     ) })
   ] });
 };
+
+// src/components/databrowser/components/ui-query-builder/dnd-context.tsx
+
+
+
+
+
+
+
+var _core = require('@dnd-kit/core');
+
+// src/components/databrowser/components/ui-query-builder/drag-overlay.tsx
+
+
+
+// src/components/databrowser/components/ui-query-builder/not-badge.tsx
+
 var NotBadge = () => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "flex h-[26px] items-center rounded-md border border-zinc-300 bg-amber-50 px-2 text-sm font-medium text-amber-800", children: "Not" });
+
+// src/components/databrowser/components/ui-query-builder/query-condition.tsx
+
+
+
+// src/components/databrowser/components/ui-query-builder/node-actions-menu.tsx
+
+
+
 var NodeActionsMenu = ({ node }) => {
   const { updateNode } = useQueryBuilderUI();
   const [open, setOpen] = _react.useState.call(void 0, false);
@@ -9393,24 +10411,8 @@ var NodeActionsMenu = ({ node }) => {
   ] });
 };
 
-// src/components/databrowser/components/ui-query-builder/dnd-context.tsx
-
-
-
-
-
-
-
-var _core = require('@dnd-kit/core');
-
-// src/components/databrowser/components/ui-query-builder/drag-overlay.tsx
-
-
-
 // src/components/databrowser/components/ui-query-builder/query-condition.tsx
 
-
-
 var formatValueForDisplay = (value) => {
   if (Array.isArray(value)) {
     return value.join(", ");
@@ -9435,7 +10437,7 @@ var QueryCondition = ({
     setLocalValue(formattedConditionValue);
   }
   const currentFieldInfo = fieldInfos.find((f) => f.name === condition.field);
-  const currentFieldType = _nullishCoalesce(_optionalChain([currentFieldInfo, 'optionalAccess', _90 => _90.type]), () => ( "unknown"));
+  const currentFieldType = _nullishCoalesce(_optionalChain([currentFieldInfo, 'optionalAccess', _109 => _109.type]), () => ( "unknown"));
   const isUnknownField = condition.field && !fieldNames.includes(condition.field);
   const getValueTypeError = () => {
     if (isUnknownField || currentFieldType === "unknown" || currentFieldType === "string") {
@@ -9493,8 +10495,8 @@ var QueryCondition = ({
     }
   }, [currentFieldType, condition.value]);
   const handleFieldChange = (value) => {
-    const newFieldInfo = _optionalChain([fieldInfos, 'optionalAccess', _91 => _91.find, 'call', _92 => _92((f) => f.name === value)]);
-    const newFieldType = _nullishCoalesce(_optionalChain([newFieldInfo, 'optionalAccess', _93 => _93.type]), () => ( "unknown"));
+    const newFieldInfo = _optionalChain([fieldInfos, 'optionalAccess', _110 => _110.find, 'call', _111 => _111((f) => f.name === value)]);
+    const newFieldType = _nullishCoalesce(_optionalChain([newFieldInfo, 'optionalAccess', _112 => _112.type]), () => ( "unknown"));
     const validOperators = getOperatorsForFieldType(newFieldType);
     const isOperatorValid = validOperators.includes(condition.operator);
     let newValue = condition.value;
@@ -9635,10 +10637,10 @@ var QueryCondition = ({
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
       "div",
       {
-        ref: _optionalChain([dragHandleProps, 'optionalAccess', _94 => _94.ref]),
+        ref: _optionalChain([dragHandleProps, 'optionalAccess', _113 => _113.ref]),
         className: "flex cursor-grab items-center px-1 text-zinc-400 hover:text-zinc-600",
-        ..._optionalChain([dragHandleProps, 'optionalAccess', _95 => _95.attributes]),
-        ..._optionalChain([dragHandleProps, 'optionalAccess', _96 => _96.listeners]),
+        ..._optionalChain([dragHandleProps, 'optionalAccess', _114 => _114.attributes]),
+        ..._optionalChain([dragHandleProps, 'optionalAccess', _115 => _115.listeners]),
         children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _iconsreact.IconGripVertical, { size: 16 })
       }
     ),
@@ -9681,7 +10683,15 @@ var QueryCondition = ({
             },
             condition.operator
           ),
-          filteredOperators.map((op) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectItem, { value: op.value, children: op.label }, op.value))
+          filteredOperators.map((op) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            SelectItem,
+            {
+              value: op.value,
+              description: OPERATOR_DESCRIPTIONS[op.value],
+              children: op.label
+            },
+            op.value
+          ))
         ] })
       ] }),
       currentFieldType === "boolean" && condition.operator === "in" ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "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: [
@@ -9763,8 +10773,15 @@ var QueryCondition = ({
         children: [
           /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectTrigger, { className: "h-[26px] w-16 gap-3 border-zinc-200 bg-white px-2 text-sm", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectValue, {}) }),
           /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, SelectContent, { children: [
-            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectItem, { value: "1", children: "1" }),
-            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectItem, { value: "2", children: "2" })
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+              SelectItem,
+              {
+                value: "1",
+                description: "Matches words with 1 character edit (e.g. 'teh' \u2192 'the')",
+                children: "1"
+              }
+            ),
+            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectItem, { value: "2", description: "Matches words with up to 2 character edits", children: "2" })
           ] })
         ]
       }
@@ -9773,9 +10790,23 @@ var QueryCondition = ({
       /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, Select, { value: phraseMode, onValueChange: handlePhraseModeChange, children: [
         /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectTrigger, { className: "h-[26px] w-20 gap-3 border-zinc-200 bg-white px-2 text-sm font-normal", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectValue, {}) }),
         /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, SelectContent, { children: [
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectItem, { value: "exact", children: "exact" }),
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectItem, { value: "slop", children: "slop" }),
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectItem, { value: "prefix", children: "prefix" })
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectItem, { value: "exact", description: "Terms must appear adjacent to each other", children: "exact" }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            SelectItem,
+            {
+              value: "slop",
+              description: "Allow custom number of intervening words between terms",
+              children: "slop"
+            }
+          ),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            SelectItem,
+            {
+              value: "prefix",
+              description: "Last term matches as a prefix (e.g. 'wireless head' \u2192 'headphones')",
+              children: "prefix"
+            }
+          )
         ] })
       ] }),
       phraseMode === "slop" && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
@@ -9791,6 +10822,7 @@ var QueryCondition = ({
         }
       )
     ] }),
+    node.not && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, NotBadge, {}),
     node.boost !== void 0 && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, BoostBadge, { node }),
     /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
       "div",
@@ -10027,6 +11059,7 @@ var DraggableItem = ({
 // src/components/databrowser/components/ui-query-builder/drop-zone.tsx
 
 
+
 var DropIndicator = ({ id, isOver }) => {
   const { setNodeRef } = _core.useDroppable.call(void 0, { id });
   return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { ref: setNodeRef, className: `relative flex h-2 items-center`, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
@@ -10039,14 +11072,26 @@ var DropIndicator = ({ id, isOver }) => {
     }
   ) });
 };
-var EmptyGroupDropZone = ({ groupId, isOver }) => {
+var EmptyGroupDropZone = ({
+  groupId,
+  isOver,
+  onAddCondition
+}) => {
   const { setNodeRef } = _core.useDroppable.call(void 0, { id: `drop-${groupId}-end` });
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-    "div",
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+    "button",
     {
+      type: "button",
       ref: setNodeRef,
-      className: `mt-2 flex h-8 items-center justify-center rounded-md border border-dashed text-sm transition-all ${isOver ? "border-blue-500 bg-blue-50 text-blue-600" : "border-zinc-300 text-zinc-400"}`,
-      children: "Add a condition to start"
+      onClick: onAddCondition,
+      className: cn(
+        "mt-2 flex h-8 w-full items-center justify-center gap-1.5 rounded-md border border-dashed text-sm transition-all",
+        isOver ? "border-blue-500 bg-blue-50 text-blue-600" : "border-zinc-300 text-zinc-400 hover:border-zinc-400 hover:bg-zinc-50 hover:text-zinc-500"
+      ),
+      children: [
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _iconsreact.IconPlus, { size: 14 }),
+        "Add a condition"
+      ]
     }
   );
 };
@@ -10093,9 +11138,7 @@ var InnerGroup = ({
     addChildToGroup(node.id, createEmptyCondition(fieldInfos));
   };
   const handleAddGroup = () => {
-    const newGroup = createEmptyGroup("and");
-    newGroup.children = [createEmptyCondition(fieldInfos)];
-    addChildToGroup(node.id, newGroup);
+    addChildToGroup(node.id, createEmptyGroup("and"));
   };
   const handleDeleteGroup = () => {
     deleteNode(node.id);
@@ -10105,10 +11148,10 @@ var InnerGroup = ({
       !isRoot && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
         "div",
         {
-          ref: _optionalChain([dragHandleProps, 'optionalAccess', _97 => _97.ref]),
+          ref: _optionalChain([dragHandleProps, 'optionalAccess', _116 => _116.ref]),
           className: "flex cursor-grab items-center px-1 text-zinc-400",
-          ..._optionalChain([dragHandleProps, 'optionalAccess', _98 => _98.attributes]),
-          ..._optionalChain([dragHandleProps, 'optionalAccess', _99 => _99.listeners]),
+          ..._optionalChain([dragHandleProps, 'optionalAccess', _117 => _117.attributes]),
+          ..._optionalChain([dragHandleProps, 'optionalAccess', _118 => _118.listeners]),
           children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _iconsreact.IconGripVertical, { size: 16 })
         }
       ),
@@ -10134,6 +11177,7 @@ var InnerGroup = ({
           /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DropdownMenuItem, { onClick: handleAddGroup, children: "Add Group" })
         ] })
       ] }),
+      node.not && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, NotBadge, {}),
       node.boost !== void 0 && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, BoostBadge, { node }),
       !isRoot && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
         "div",
@@ -10154,7 +11198,14 @@ var InnerGroup = ({
         }
       )
     ] }),
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: `min-h-[20px] ${isRoot ? "" : "ml-[15px] border-l-2 border-zinc-200 pl-3"}`, children: node.children.length === 0 ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, EmptyGroupDropZone, { groupId: node.id, isOver: activeOverId === `drop-${node.id}-end` }) : /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: `min-h-[20px] ${isRoot ? "" : "ml-[15px] border-l-2 border-zinc-200 pl-3"}`, children: node.children.length === 0 ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      EmptyGroupDropZone,
+      {
+        groupId: node.id,
+        isOver: activeOverId === `drop-${node.id}-end`,
+        onAddCondition: fieldInfos.length > 0 ? handleAddCondition : void 0
+      }
+    ) : /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
       node.children.map(
         (child) => !child.not && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
           ChildRow,
@@ -10170,20 +11221,10 @@ var InnerGroup = ({
       ),
       node.children.some((child) => child.not) && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, Tooltip, { delayDuration: 200, children: [
         /* @__PURE__ */ _jsxruntime.jsx.call(void 0, TooltipTrigger, { asChild: true, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "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__ */ _jsxruntime.jsx.call(void 0, TooltipContent, { side: "right", className: "max-w-xs", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "p", { children: [
-          "Keys matching any of the conditions below are excluded from the results.",
-          " ",
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-            "a",
-            {
-              href: "https://upstash-search.mintlify.app/redis/search/query-operators/boolean-operators/must-not",
-              target: "_blank",
-              rel: "noopener noreferrer",
-              className: "underline",
-              children: "Learn more"
-            }
-          )
-        ] }) })
+        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, TooltipContent, { side: "right", className: "max-w-xs", children: [
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { children: "Keys matching any of the conditions below are excluded from the results." }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DocsLink, { href: "https://upstash-search.mintlify.app/redis/search/query-operators/boolean-operators/must-not" })
+        ] })
       ] }),
       node.children.map(
         (child) => child.not && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
@@ -10248,12 +11289,6 @@ var QueryGroup = ({ node, isRoot = false, depth }) => {
 
 
 // src/components/databrowser/components/ui-query-builder/query-stringify.ts
-var jsonToJsLiteral = (json) => {
-  return json.replaceAll(/"([$A-Z_a-z][\w$]*)"\s*:/g, "$1:");
-};
-var toJsLiteral = (obj) => {
-  return jsonToJsLiteral(JSON.stringify(obj, null, 2));
-};
 var buildOperatorValue = (operator, value, fuzzyDistance, phraseSlop, phrasePrefix) => {
   if (operator === "fuzzy" && fuzzyDistance) {
     return { value, distance: fuzzyDistance };
@@ -10279,7 +11314,8 @@ var conditionToObject = (node) => {
     phrasePrefix
   } = node.condition;
   const effectiveBoost = _nullishCoalesce(node.boost, () => ( conditionBoost));
-  if (operator === "eq" && !effectiveBoost) {
+  const isCollapsibleEq = operator === "eq" && (typeof value === "boolean" || typeof value === "number");
+  if ((operator === "smart" || isCollapsibleEq) && !effectiveBoost) {
     return { [field]: value };
   }
   const fieldCondition = {
@@ -10292,15 +11328,15 @@ var conditionToObject = (node) => {
   return { [field]: fieldCondition };
 };
 var canMergeChildren = (children) => {
-  return children.every(
-    (child) => child.type === "condition" && !child.not && !child.boost && child.condition.operator === "eq" && !child.condition.boost
-  );
+  if (!children.every((child) => child.type === "condition" && !child.not)) return false;
+  const fields = children.map((c) => c.condition.field);
+  return new Set(fields).size === fields.length;
 };
 var mergeConditions = (children, boost) => {
   const merged = {};
   for (const child of children) {
     if (child.type === "condition") {
-      merged[child.condition.field] = child.condition.value;
+      Object.assign(merged, conditionToObject(child));
     }
   }
   if (boost && boost !== 1) {
@@ -10308,7 +11344,14 @@ var mergeConditions = (children, boost) => {
   }
   return merged;
 };
-var groupToObject = (node, isRoot) => {
+var buildMustNot = (negatedChildren) => {
+  const negatedObjects = negatedChildren.map((child) => {
+    const withoutNot = { ...child, not: void 0 };
+    return queryNodeToObject(withoutNot, false);
+  });
+  return negatedObjects.length === 1 ? negatedObjects[0] : negatedObjects;
+};
+var groupToObject = (node, isRoot, forArray = false) => {
   const { groupOperator, children, boost, not } = node;
   const normalChildren = children.filter((c) => !c.not);
   const negatedChildren = children.filter((c) => c.not);
@@ -10324,41 +11367,84 @@ var groupToObject = (node, isRoot) => {
     }
     return { $mustNot: [inner] };
   }
-  if (isRoot && groupOperator === "and" && normalChildren.length === 1 && negatedChildren.length === 0 && !boost) {
-    return queryNodeToObject(normalChildren[0], false);
+  if (isRoot && groupOperator === "and" && negatedChildren.length === 0) {
+    if (normalChildren.length === 1) {
+      const result2 = queryNodeToObject(normalChildren[0], false);
+      if (boost && boost !== 1) result2.$boost = boost;
+      return result2;
+    }
+    const conditionChildren = normalChildren.filter((c) => c.type === "condition");
+    const groupChildren = normalChildren.filter((c) => c.type === "group");
+    const hasConflictingGroupChild = groupChildren.some(
+      (c) => c.groupOperator === groupOperator && c.children.length > 1 && c.boost
+    );
+    if (!hasConflictingGroupChild) {
+      const fields = conditionChildren.map(
+        (c) => c.condition.field
+      );
+      const groupOps = groupChildren.map((c) => `$${c.groupOperator}`);
+      const allKeys = [...fields, ...groupOps];
+      const hasConflicts = new Set(allKeys).size !== allKeys.length;
+      if (!hasConflicts) {
+        const result2 = {};
+        for (const child of conditionChildren) {
+          Object.assign(result2, conditionToObject(child));
+        }
+        for (const child of groupChildren) {
+          Object.assign(result2, groupToObject(child, false));
+        }
+        if (boost && boost !== 1) result2.$boost = boost;
+        return result2;
+      }
+    }
   }
-  if (normalChildren.length > 0 && negatedChildren.length === 0 && canMergeChildren(normalChildren)) {
-    const merged = mergeConditions(normalChildren, boost);
-    if (isRoot && groupOperator === "and") {
-      return merged;
+  if (normalChildren.length > 0 && canMergeChildren(normalChildren)) {
+    if (isRoot && groupOperator === "and" && negatedChildren.length === 0) {
+      return mergeConditions(normalChildren, boost);
+    }
+    const result2 = {};
+    if (forArray) {
+      result2[`$${groupOperator}`] = mergeConditions(normalChildren);
+      if (boost && boost !== 1) result2.$boost = boost;
+    } else {
+      result2[`$${groupOperator}`] = mergeConditions(normalChildren, boost);
     }
-    const result2 = { [`$${groupOperator}`]: merged };
-    if (boost && boost !== 1) {
-      result2.$boost = boost;
+    if (negatedChildren.length > 0) {
+      result2.$mustNot = buildMustNot(negatedChildren);
     }
     return result2;
   }
   const result = {};
   if (normalChildren.length > 0) {
-    result[`$${groupOperator}`] = normalChildren.map((child) => queryNodeToObject(child, false));
+    result[`$${groupOperator}`] = normalChildren.map((child) => {
+      if (child.type === "group") {
+        const groupChild = child;
+        const gc = groupChild.children;
+        const gcNormal = gc.filter((c) => !c.not);
+        const gcNegated = gc.filter((c) => c.not);
+        if (groupChild.groupOperator === groupOperator && gc.length > 1 && gcNegated.length === 0 && canMergeChildren(gcNormal)) {
+          return mergeConditions(gcNormal, groupChild.boost);
+        }
+      }
+      return queryNodeToObject(child, false, true);
+    });
+  } else if (negatedChildren.length > 0) {
+    result[`$${groupOperator}`] = {};
   }
   if (negatedChildren.length > 0) {
-    result.$mustNot = negatedChildren.map((child) => {
-      const withoutNot = { ...child, not: void 0 };
-      return queryNodeToObject(withoutNot, false);
-    });
+    result.$mustNot = buildMustNot(negatedChildren);
   }
   if (boost && boost !== 1) {
     result.$boost = boost;
   }
   return result;
 };
-var queryNodeToObject = (node, isRoot = false) => {
+var queryNodeToObject = (node, isRoot = false, forArray = false) => {
   if (node.type === "condition") {
     return conditionToObject(node);
   }
   if (node.type === "group") {
-    return groupToObject(node, isRoot);
+    return groupToObject(node, isRoot, forArray);
   }
   return {};
 };
@@ -10414,7 +11500,7 @@ var UIQueryBuilder = () => {
   const { valuesSearch } = useTab();
   const { data: indexDetails } = useFetchSearchIndex(valuesSearch.index);
   const { queryState, setQueryState } = useQueryStateSync();
-  const fieldInfos = _optionalChain([indexDetails, 'optionalAccess', _100 => _100.schema]) ? extractFieldInfo(indexDetails.schema) : [];
+  const fieldInfos = _optionalChain([indexDetails, 'optionalAccess', _119 => _119.schema]) ? extractFieldInfo(indexDetails.schema) : [];
   const hasNormalized = _react.useRef.call(void 0, false);
   _react.useEffect.call(void 0, () => {
     if (hasNormalized.current || fieldInfos.length === 0) return;
@@ -10433,7 +11519,7 @@ var UIQueryBuilder = () => {
     setHasBottomShadow(scrollTop + clientHeight < scrollHeight - 1);
   }, []);
   _react.useEffect.call(void 0, () => {
-    viewportRef.current = _optionalChain([scrollAreaRef, 'access', _101 => _101.current, 'optionalAccess', _102 => _102.querySelector, 'call', _103 => _103(
+    viewportRef.current = _optionalChain([scrollAreaRef, 'access', _120 => _120.current, 'optionalAccess', _121 => _121.querySelector, 'call', _122 => _122(
       "[data-radix-scroll-area-viewport]"
     )]);
     recomputeShadows();
@@ -10443,7 +11529,7 @@ var UIQueryBuilder = () => {
     obs.observe(el);
     return () => obs.disconnect();
   }, [recomputeShadows]);
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, QueryBuilderUIProvider, { fieldInfos, setQueryState, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "relative h-full rounded-lg bg-zinc-50", children: [
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, QueryBuilderUIProvider, { fieldInfos, setQueryState, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "relative h-full min-h-0 rounded-lg bg-zinc-50 dark:bg-zinc-50/40", children: [
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
       "div",
       {
@@ -10539,41 +11625,47 @@ var extractFieldInfo = (schema) => {
 
 var PREFIX = "const query: Query = ";
 var QueryBuilderContent = () => {
-  const { valuesSearch } = useTab();
-  const [mode, setMode] = _react.useState.call(void 0, "builder");
-  const [switchError, setSwitchError] = _react.useState.call(void 0, null);
+  const { valuesSearch, queryBuilderMode, setQueryBuilderMode } = useTab();
+  const { query } = useKeys();
+  const [switchError, setSwitchError] = _react.useState.call(void 0, );
   const handleModeChange = (value) => {
     const newMode = value;
-    if (newMode === "builder") {
+    if (newMode === "ui") {
       if (hasMustShouldCombination(valuesSearch.query)) {
         setSwitchError(
           "Queries using both $must and $should are not supported in the UI query builder"
         );
         return;
       }
-      setSwitchError(null);
+      setSwitchError(void 0);
     } else {
-      setSwitchError(null);
+      setSwitchError(void 0);
     }
-    setMode(newMode);
+    setQueryBuilderMode(newMode);
   };
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { children: [
-    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "relative h-[200px] max-h-[40vh] min-h-[150px] resize-y overflow-hidden", children: [
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "absolute right-4 top-4 z-10", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-        Segmented,
-        {
-          options: [
-            { key: "builder", label: "Query Builder" },
-            { key: "code", label: "Code Editor" }
-          ],
-          value: mode,
-          onChange: handleModeChange,
-          buttonClassName: "h-6"
-        }
-      ) }),
-      mode === "builder" ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, UIQueryBuilder, {}) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, QueryBuilder, {})
-    ] }),
-    switchError && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "p", { className: "mt-3 text-sm text-red-500", children: switchError })
+  const errorMessage = _nullishCoalesce(switchError, () => ( (query.error ? formatUpstashErrorMessage(query.error) : void 0)));
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "relative flex h-full min-h-0 flex-col", children: [
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "absolute right-4 top-4 z-[2]", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      Segmented,
+      {
+        options: [
+          { key: "ui", label: "Query Builder" },
+          { key: "code", label: "Code Editor" }
+        ],
+        value: queryBuilderMode,
+        onChange: handleModeChange,
+        buttonClassName: "h-6"
+      }
+    ) }),
+    queryBuilderMode === "ui" ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, UIQueryBuilder, {}) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, QueryBuilder, {}),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, QueryBuilderError, { error: errorMessage, autoHide: Boolean(switchError) }),
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+      DocsLink,
+      {
+        className: "absolute bottom-2 right-2 text-sm",
+        href: "https://upstash-search.mintlify.app/redis/search/query-operators/boolean-operators/overview"
+      }
+    )
   ] });
 };
 var SearchContent = () => {
@@ -10590,7 +11682,7 @@ var DatabrowserInstance = ({
   tabType,
   allowSearch
 }) => {
-  const { isValuesSearchSelected, setIsValuesSearchSelected } = useTab();
+  const { isValuesSearchSelected, queryBuilderMode, setIsValuesSearchSelected } = useTab();
   const { data: indexes, isLoading } = useFetchSearchIndexes({
     enabled: tabType === "search"
   });
@@ -10606,16 +11698,40 @@ var DatabrowserInstance = ({
     "div",
     {
       className: cn(
-        "flex min-h-0 grow flex-col rounded-md bg-white px-5 pb-5",
+        "flex min-h-0 grow flex-col rounded-[10px] bg-white px-5 pb-5",
         hidden && "hidden"
       ),
       children: [
         /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "space-y-3 py-5", children: [
           /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Header, { tabType, allowSearch }),
-          isValuesSearchSelected && !showEmptyState && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SearchContent, {}),
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, HeaderError, {})
+          !isValuesSearchSelected && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, HeaderError, {})
         ] }),
-        showEmptyState ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SearchEmptyState, {}) : /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+        showEmptyState ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SearchEmptyState, {}) : isValuesSearchSelected ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+          _reactresizablepanels.PanelGroup,
+          {
+            autoSaveId: "search-layout",
+            direction: "vertical",
+            className: "h-full w-full !overflow-visible text-sm antialiased",
+            children: [
+              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                _reactresizablepanels.Panel,
+                {
+                  defaultSize: 30,
+                  minSize: 15,
+                  maxSize: 60,
+                  className: queryBuilderMode === "code" ? "!overflow-visible" : "",
+                  children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SearchContent, {})
+                }
+              ),
+              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ResizeHandle, { direction: "vertical" }),
+              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactresizablepanels.Panel, { minSize: 30, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _reactresizablepanels.PanelGroup, { autoSaveId: "persistence", direction: "horizontal", className: "h-full w-full", children: [
+                /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactresizablepanels.Panel, { defaultSize: 30, minSize: 30, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Sidebar, {}) }),
+                /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ResizeHandle, {}),
+                /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactresizablepanels.Panel, { minSize: 40, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DataDisplay, {}) })
+              ] }) })
+            ]
+          }
+        ) : /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
           _reactresizablepanels.PanelGroup,
           {
             autoSaveId: "persistence",
@@ -10623,11 +11739,7 @@ var DatabrowserInstance = ({
             className: "h-full w-full text-sm antialiased",
             children: [
               /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactresizablepanels.Panel, { defaultSize: 30, minSize: 30, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Sidebar, {}) }),
-              /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _reactresizablepanels.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__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[3px] w-[3px] rounded-full bg-zinc-300" }),
-                /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[3px] w-[3px] rounded-full bg-zinc-300" }),
-                /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "h-[3px] w-[3px] rounded-full bg-zinc-300" })
-              ] }),
+              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ResizeHandle, {}),
               /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactresizablepanels.Panel, { minSize: 40, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DataDisplay, {}) })
             ]
           }
@@ -10756,7 +11868,7 @@ var useOverflow = () => {
     }
     if (!node) return;
     observerRef.current = new ResizeObserver((entries) => {
-      const el = _optionalChain([entries, 'access', _104 => _104.at, 'call', _105 => _105(0), 'optionalAccess', _106 => _106.target]);
+      const el = _optionalChain([entries, 'access', _123 => _123.at, 'call', _124 => _124(0), 'optionalAccess', _125 => _125.target]);
       if (!el) return;
       setIsOverflow(el.scrollWidth > el.clientWidth);
     });
@@ -10764,7 +11876,7 @@ var useOverflow = () => {
   }, []);
   _react.useEffect.call(void 0, () => {
     return () => {
-      _optionalChain([observerRef, 'access', _107 => _107.current, 'optionalAccess', _108 => _108.disconnect, 'call', _109 => _109()]);
+      _optionalChain([observerRef, 'access', _126 => _126.current, 'optionalAccess', _127 => _127.disconnect, 'call', _128 => _128()]);
     };
   }, []);
   return { ref, isOverflow };
@@ -10882,8 +11994,8 @@ var SortableTab = ({ id }) => {
   const [originalWidth, setOriginalWidth] = _react.useState.call(void 0, null);
   const textRef = _react.useRef.call(void 0, null);
   const { tabs } = useDatabrowserStore();
-  const tabData = _optionalChain([tabs, 'access', _110 => _110.find, 'call', _111 => _111(([tabId]) => tabId === id), 'optionalAccess', _112 => _112[1]]);
-  const isPinned = _optionalChain([tabData, 'optionalAccess', _113 => _113.pinned]);
+  const tabData = _optionalChain([tabs, 'access', _129 => _129.find, 'call', _130 => _130(([tabId]) => tabId === id), 'optionalAccess', _131 => _131[1]]);
+  const isPinned = _optionalChain([tabData, 'optionalAccess', _132 => _132.pinned]);
   const { attributes, listeners: listeners2, setNodeRef, transform, transition, isDragging } = _sortable.useSortable.call(void 0, {
     id,
     disabled: isPinned,
@@ -11028,7 +12140,7 @@ var DatabrowserTabs = ({ onFullScreenClick }) => {
       reorderTabs(oldIndex, newIndex);
     }
   };
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "relative shrink-0 overflow-hidden rounded-t-lg bg-zinc-300", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center gap-1", children: [
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "relative shrink-0 overflow-hidden rounded-t-[10px] bg-zinc-300", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center gap-1", children: [
     /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "relative min-w-0 flex-1", children: [
       /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
         "div",
@@ -11076,7 +12188,7 @@ var DatabrowserTabs = ({ onFullScreenClick }) => {
         }
       )
     ] }),
-    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center gap-1 pl-1", children: [
+    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center gap-1 px-1", children: [
       isOverflow && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, AddTabButton, {}),
       tabs.length > 1 && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, TabsListButton, { tabs, onSelectTab: selectTab }),
       onFullScreenClick && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
@@ -11084,9 +12196,8 @@ var DatabrowserTabs = ({ onFullScreenClick }) => {
         {
           "aria-label": "Toggle fullscreen",
           variant: "secondary",
-          size: "icon-sm",
           onClick: onFullScreenClick,
-          className: "flex-shrink-0 bg-white text-zinc-500 dark:bg-zinc-100",
+          className: "h-[34px] w-[34px] flex-shrink-0 rounded-lg bg-white text-zinc-500 dark:bg-zinc-100",
           children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _iconsreact.IconWindowMaximize, { size: 16 })
         }
       )
@@ -11100,7 +12211,7 @@ function AddTabButton() {
     const tabsId = addTab();
     selectTab(tabsId);
     setTimeout(() => {
-      const tab = _optionalChain([rootRef, 'optionalAccess', _114 => _114.current, 'optionalAccess', _115 => _115.querySelector, 'call', _116 => _116(`#tab-${tabsId}`)]);
+      const tab = _optionalChain([rootRef, 'optionalAccess', _133 => _133.current, 'optionalAccess', _134 => _134.querySelector, 'call', _135 => _135(`#tab-${tabsId}`)]);
       if (!tab) return;
       tab.scrollIntoView({ behavior: "smooth" });
     }, 20);
@@ -11134,7 +12245,7 @@ function TabsListButton({
     onSelectTab(id);
     setOpen(false);
     setTimeout(() => {
-      const tab = _optionalChain([rootRef, 'optionalAccess', _117 => _117.current, 'optionalAccess', _118 => _118.querySelector, 'call', _119 => _119(`#tab-${id}`)]);
+      const tab = _optionalChain([rootRef, 'optionalAccess', _136 => _136.current, 'optionalAccess', _137 => _137.querySelector, 'call', _138 => _138(`#tab-${id}`)]);
       if (!tab) return;
       tab.scrollIntoView({ behavior: "smooth" });
     }, 20);
@@ -11144,8 +12255,7 @@ function TabsListButton({
       Button,
       {
         variant: "secondary",
-        size: "sm",
-        className: "gap-1 bg-white px-2",
+        className: "h-[34px] gap-1 rounded-lg bg-white px-2",
         "aria-label": "Search in tabs",
         children: [
           /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "text-xs text-zinc-600", children: tabs.length }),
@@ -11184,14 +12294,15 @@ var RedisBrowser = ({
   disableTelemetry,
   onFullScreenClick,
   theme = "light",
-  allowSearch = false
+  allowSearch = false,
+  useQueryWizard
 }) => {
   const credentials = _react.useMemo.call(void 0, () => ({ token, url }), [token, url]);
   const rootRef = _react.useRef.call(void 0, null);
   _react.useEffect.call(void 0, () => {
     queryClient.resetQueries();
   }, [credentials.url]);
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactquery.QueryClientProvider, { client: queryClient, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, RedisProvider, { redisCredentials: credentials, telemetry: !disableTelemetry, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DarkModeProvider, { theme, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DatabrowserProvider, { storage, rootRef, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reacttooltip.TooltipProvider, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactquery.QueryClientProvider, { client: queryClient, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, RedisProvider, { redisCredentials: credentials, telemetry: !disableTelemetry, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DarkModeProvider, { theme, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DatabrowserProvider, { storage, rootRef, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, QueryWizardProvider, { value: useQueryWizard, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reacttooltip.TooltipProvider, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
     RedisBrowserRoot,
     {
       allowSearch,
@@ -11200,7 +12311,7 @@ var RedisBrowser = ({
       rootRef,
       onFullScreenClick
     }
-  ) }) }) }) }) });
+  ) }) }) }) }) }) });
 };
 var RedisBrowserRoot = ({
   hideTabs,
@@ -11222,7 +12333,7 @@ var RedisBrowserRoot = ({
         className: `ups-db ${theme === "dark" ? "dark" : ""}`,
         style: { height: "100%" },
         ref: rootRef,
-        children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex h-full flex-col overflow-hidden rounded-[14px] border-[4px] border-zinc-300 text-zinc-700", children: [
+        children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex h-full flex-col rounded-[14px] border-[4px] border-zinc-300 text-zinc-700", children: [
           !hideTabs && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DatabrowserTabs, { onFullScreenClick }),
           /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DatabrowserInstances, { tabType, allowSearch })
         ] })