@upstash/react-redis-browser 0.1.2 → 0.1.4

package/dist/index.js

@@ -2790,13 +2790,21 @@ var units = {
   second: 1e3
 };
 function formatTime(seconds) {
+  let milliseconds = seconds * 1e3;
+  const parts = [];
   for (const [unit, value] of Object.entries(units)) {
-    const interval = seconds * 1e3 / value;
-    if (interval >= 1) {
-      return `${Math.floor(interval)} ${unit}${interval > 1 && unit !== "min" ? "s" : ""}`;
+    if (milliseconds >= value) {
+      const amount = Math.floor(milliseconds / value);
+      const plural = amount > 1 ? "s" : "";
+      const label = unit === "month" ? ` month${plural}` : unit === "year" ? ` year${plural}` : unit[0];
+      parts.push(`${amount}${label}`);
+      milliseconds %= value;
     }
   }
-  return "just now";
+  if (parts.length === 0) {
+    parts.push("0s");
+  }
+  return parts.slice(0, 2).join(" ");
 }
 
 // src/components/ui/toast.tsx
@@ -3037,14 +3045,7 @@ var PaginationCache = (_class = class {
 var KeysContext = _react.createContext.call(void 0, void 0);
 var FETCH_KEYS_QUERY_KEY = "use-fetch-keys";
 var KeysProvider = ({ children }) => {
-  const { search: searchState } = useDatabrowserStore();
-  const search = _react.useMemo.call(void 0, 
-    () => ({
-      key: searchState.key.includes("*") ? searchState.key : `*${searchState.key}*`,
-      type: searchState.type
-    }),
-    [searchState]
-  );
+  const { search } = useDatabrowserStore();
   const { fetchKeys, resetCache } = useFetchKeys(search);
   const pageRef = _react.useRef.call(void 0, 0);
   const query = _reactquery.useInfiniteQuery.call(void 0, {
@@ -5432,16 +5433,29 @@ var KeyItem = ({ data, nextKey }) => {
 // src/components/databrowser/components/sidebar/search-input.tsx
 
 
+
 var SearchInput = () => {
   const { setSearchKey, search } = useDatabrowserStore();
+  const [state, setState] = _react.useState.call(void 0, search.key);
+  const submit = (value) => {
+    if (value.trim() !== "" && !value.includes("*")) value = `${value}*`;
+    setSearchKey(value);
+    setState(value);
+  };
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "relative grow", children: [
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
       Input,
       {
         placeholder: "Search",
         className: "rounded-l-none border-zinc-300 font-normal",
-        onChange: (e) => setSearchKey(e.target.value),
-        value: search.key
+        onKeyDown: (e) => {
+          if (e.key === "Enter") submit(e.currentTarget.value);
+        },
+        onChange: (e) => {
+          setState(e.currentTarget.value);
+          if (e.currentTarget.value.trim() === "") submit("");
+        },
+        value: state
       }
     ),
     search.key && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
@@ -5506,7 +5520,22 @@ function Sidebar() {
       /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex h-10 items-center justify-between pl-1", children: [
         /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DisplayDbSize, {}),
         /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex gap-1", children: [
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Button, { className: "h-7 w-7 px-0", onClick: refetch, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Spinner, { isLoading: query.isFetching, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _iconsreact.IconRefresh, { size: 16 }) }) }),
+          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+            Button,
+            {
+              className: "h-7 w-7 px-0",
+              onClick: () => {
+                refetch();
+                queryClient.invalidateQueries({
+                  queryKey: [FETCH_LIST_ITEMS_QUERY_KEY]
+                });
+                queryClient.invalidateQueries({
+                  queryKey: [FETCH_DB_SIZE_QUERY_KEY]
+                });
+              },
+              children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Spinner, { isLoading: query.isFetching, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _iconsreact.IconRefresh, { size: 16 }) })
+            }
+          ),
           /* @__PURE__ */ _jsxruntime.jsx.call(void 0, AddKeyModal, {})
         ] })
       ] }),

package/dist/index.mjs

@@ -2790,13 +2790,21 @@ var units = {
   second: 1e3
 };
 function formatTime(seconds) {
+  let milliseconds = seconds * 1e3;
+  const parts = [];
   for (const [unit, value] of Object.entries(units)) {
-    const interval = seconds * 1e3 / value;
-    if (interval >= 1) {
-      return `${Math.floor(interval)} ${unit}${interval > 1 && unit !== "min" ? "s" : ""}`;
+    if (milliseconds >= value) {
+      const amount = Math.floor(milliseconds / value);
+      const plural = amount > 1 ? "s" : "";
+      const label = unit === "month" ? ` month${plural}` : unit === "year" ? ` year${plural}` : unit[0];
+      parts.push(`${amount}${label}`);
+      milliseconds %= value;
     }
   }
-  return "just now";
+  if (parts.length === 0) {
+    parts.push("0s");
+  }
+  return parts.slice(0, 2).join(" ");
 }
 
 // src/components/ui/toast.tsx
@@ -3037,14 +3045,7 @@ import { jsx as jsx4 } from "react/jsx-runtime";
 var KeysContext = createContext2(void 0);
 var FETCH_KEYS_QUERY_KEY = "use-fetch-keys";
 var KeysProvider = ({ children }) => {
-  const { search: searchState } = useDatabrowserStore();
-  const search = useMemo2(
-    () => ({
-      key: searchState.key.includes("*") ? searchState.key : `*${searchState.key}*`,
-      type: searchState.type
-    }),
-    [searchState]
-  );
+  const { search } = useDatabrowserStore();
   const { fetchKeys, resetCache } = useFetchKeys(search);
   const pageRef = useRef2(0);
   const query = useInfiniteQuery({
@@ -5430,18 +5431,31 @@ var KeyItem = ({ data, nextKey }) => {
 };
 
 // src/components/databrowser/components/sidebar/search-input.tsx
+import { useState as useState10 } from "react";
 import { IconX } from "@tabler/icons-react";
 import { jsx as jsx38, jsxs as jsxs27 } from "react/jsx-runtime";
 var SearchInput = () => {
   const { setSearchKey, search } = useDatabrowserStore();
+  const [state, setState] = useState10(search.key);
+  const submit = (value) => {
+    if (value.trim() !== "" && !value.includes("*")) value = `${value}*`;
+    setSearchKey(value);
+    setState(value);
+  };
   return /* @__PURE__ */ jsxs27("div", { className: "relative grow", children: [
     /* @__PURE__ */ jsx38(
       Input,
       {
         placeholder: "Search",
         className: "rounded-l-none border-zinc-300 font-normal",
-        onChange: (e) => setSearchKey(e.target.value),
-        value: search.key
+        onKeyDown: (e) => {
+          if (e.key === "Enter") submit(e.currentTarget.value);
+        },
+        onChange: (e) => {
+          setState(e.currentTarget.value);
+          if (e.currentTarget.value.trim() === "") submit("");
+        },
+        value: state
       }
     ),
     search.key && /* @__PURE__ */ jsxs27(
@@ -5506,7 +5520,22 @@ function Sidebar() {
       /* @__PURE__ */ jsxs30("div", { className: "flex h-10 items-center justify-between pl-1", children: [
         /* @__PURE__ */ jsx41(DisplayDbSize, {}),
         /* @__PURE__ */ jsxs30("div", { className: "flex gap-1", children: [
-          /* @__PURE__ */ jsx41(Button, { className: "h-7 w-7 px-0", onClick: refetch, children: /* @__PURE__ */ jsx41(Spinner, { isLoading: query.isFetching, children: /* @__PURE__ */ jsx41(IconRefresh, { size: 16 }) }) }),
+          /* @__PURE__ */ jsx41(
+            Button,
+            {
+              className: "h-7 w-7 px-0",
+              onClick: () => {
+                refetch();
+                queryClient.invalidateQueries({
+                  queryKey: [FETCH_LIST_ITEMS_QUERY_KEY]
+                });
+                queryClient.invalidateQueries({
+                  queryKey: [FETCH_DB_SIZE_QUERY_KEY]
+                });
+              },
+              children: /* @__PURE__ */ jsx41(Spinner, { isLoading: query.isFetching, children: /* @__PURE__ */ jsx41(IconRefresh, { size: 16 }) })
+            }
+          ),
           /* @__PURE__ */ jsx41(AddKeyModal, {})
         ] })
       ] }),

package/package.json

@@ -1 +1 @@
-{ "name": "@upstash/react-redis-browser", "version": "v0.1.2", "main": "./dist/index.js", "types": "./dist/index.d.ts", "license": "MIT", "private": false, "publishConfig": { "access": "public" }, "bugs": { "url": "https://github.com/upstash/react-redis-browser/issues" }, "homepage": "https://github.com/upstash/react-redis-browser", "files": [ "./dist/**" ], "scripts": { "build": "tsup", "dev": "vite", "lint": "tsc && eslint", "fmt": "prettier --write ./src" }, "lint-staged": { "**/*.{js,ts,tsx}": [ "prettier --write", "eslint --fix" ] }, "dependencies": { "@ianvs/prettier-plugin-sort-imports": "^4.4.0", "@monaco-editor/react": "^4.6.0", "@radix-ui/react-alert-dialog": "^1.0.5", "@radix-ui/react-context-menu": "^2.2.2", "@radix-ui/react-dialog": "^1.0.5", "@radix-ui/react-dropdown-menu": "^2.1.2", "@radix-ui/react-icons": "1.3.0", "@radix-ui/react-popover": "^1.0.7", "@radix-ui/react-portal": "^1.1.2", "@radix-ui/react-scroll-area": "^1.0.3", "@radix-ui/react-select": "^2.0.0", "@radix-ui/react-slot": "^1.0.2", "@radix-ui/react-toast": "^1.1.5", "@radix-ui/react-tooltip": "^1.0.7", "@tabler/icons-react": "^3.19.0", "@tanstack/react-query": "^5.32.0", "@types/bytes": "^3.1.4", "@upstash/redis": "^1.34.3", "bytes": "^3.1.2", "react-hook-form": "^7.53.0", "react-resizable-panels": "^2.1.4", "zustand": "5.0.0" }, "devDependencies": { "postcss-prefix-selector": "^2.1.0", "@types/node": "^22.8.4", "@types/react": "^18.3.12", "@types/react-dom": "^18.3.1", "@typescript-eslint/eslint-plugin": "8.4.0", "@typescript-eslint/parser": "8.4.0", "@vitejs/plugin-react": "^4.1.0", "autoprefixer": "^10.4.14", "class-variance-authority": "^0.7.0", "clsx": "^2.0.0", "eslint": "9.10.0", "eslint-plugin-unicorn": "55.0.0", "postcss": "^8.4.31", "prettier": "^3.0.3", "prettier-plugin-tailwindcss": "^0.5.5", "react": "^18.3.1", "react-dom": "^18.3.1", "tailwind-merge": "^2.5.4", "tailwindcss": "^3.4.14", "tailwindcss-animate": "^1.0.7", "tsup": "^8.3.5", "typescript": "^5.0.4", "vite": "^5.4.10", "vite-tsconfig-paths": "^5.0.1" }, "peerDependencies": { "react": "^18.2.0 || ^19", "react-dom": "^18.2.0 || ^19" } }
+{ "name": "@upstash/react-redis-browser", "version": "v0.1.4", "main": "./dist/index.js", "types": "./dist/index.d.ts", "license": "MIT", "private": false, "publishConfig": { "access": "public" }, "bugs": { "url": "https://github.com/upstash/react-redis-browser/issues" }, "homepage": "https://github.com/upstash/react-redis-browser", "files": [ "./dist/**" ], "scripts": { "build": "tsup", "dev": "vite", "lint": "tsc && eslint", "fmt": "prettier --write ./src" }, "lint-staged": { "**/*.{js,ts,tsx}": [ "prettier --write", "eslint --fix" ] }, "dependencies": { "@ianvs/prettier-plugin-sort-imports": "^4.4.0", "@monaco-editor/react": "^4.6.0", "@radix-ui/react-alert-dialog": "^1.0.5", "@radix-ui/react-context-menu": "^2.2.2", "@radix-ui/react-dialog": "^1.0.5", "@radix-ui/react-dropdown-menu": "^2.1.2", "@radix-ui/react-icons": "1.3.0", "@radix-ui/react-popover": "^1.0.7", "@radix-ui/react-portal": "^1.1.2", "@radix-ui/react-scroll-area": "^1.0.3", "@radix-ui/react-select": "^2.0.0", "@radix-ui/react-slot": "^1.0.2", "@radix-ui/react-toast": "^1.1.5", "@radix-ui/react-tooltip": "^1.0.7", "@tabler/icons-react": "^3.19.0", "@tanstack/react-query": "^5.32.0", "@types/bytes": "^3.1.4", "@upstash/redis": "^1.34.3", "bytes": "^3.1.2", "react-hook-form": "^7.53.0", "react-resizable-panels": "^2.1.4", "zustand": "5.0.0" }, "devDependencies": { "postcss-prefix-selector": "^2.1.0", "@types/node": "^22.8.4", "@types/react": "^18.3.12", "@types/react-dom": "^18.3.1", "@typescript-eslint/eslint-plugin": "8.4.0", "@typescript-eslint/parser": "8.4.0", "@vitejs/plugin-react": "^4.1.0", "autoprefixer": "^10.4.14", "class-variance-authority": "^0.7.0", "clsx": "^2.0.0", "eslint": "9.10.0", "eslint-plugin-unicorn": "55.0.0", "postcss": "^8.4.31", "prettier": "^3.0.3", "prettier-plugin-tailwindcss": "^0.5.5", "react": "^18.3.1", "react-dom": "^18.3.1", "tailwind-merge": "^2.5.4", "tailwindcss": "^3.4.14", "tailwindcss-animate": "^1.0.7", "tsup": "^8.3.5", "typescript": "^5.0.4", "vite": "^5.4.10", "vite-tsconfig-paths": "^5.0.1" }, "peerDependencies": { "react": "^18.2.0 || ^19", "react-dom": "^18.2.0 || ^19" } }