rename

Author: ytkimirti

README.md

@@ -1,6 +1,6 @@
-# Databrowser for Upstash Redis
+# RedisBrowser for Upstash Redis
 
-`@upstash/react-databrowser` is a React component that provides a UI for browsing and editing data in your Upstash Redis instances. It’s easy to set up and integrate into your React applications. This guide will help you get started with the installation and basic usage.
+`@upstash/react-redis-browser` is a React component that provides a UI for browsing and editing data in your Upstash Redis instances. It’s easy to set up and integrate into your React applications. This guide will help you get started with the installation and basic usage.
 
 ## Table of Contents
 
@@ -13,7 +13,7 @@
 Install the databrowser component via npm:
 
 ```sh-session
-$ npm install @upstash/react-databrowser
+$ npm install @upstash/react-redis-browser
 ```
 
 ## 2. Configuration
@@ -31,23 +31,23 @@ NEXT_PUBLIC_UPSTASH_REDIS_REST_TOKEN=YOUR_REDIS_REST_TOKEN
 
 ### Creating the Data Browser Component
 
-In your React application, create a new component that will utilize @upstash/react-databrowser.
+In your React application, create a new component that will utilize @upstash/react-redis-browser.
 
 Here's a basic example of how to use the component:
 
 ```tsx
-import { Databrowser } from "@upstash/react-databrowser"
+import { RedisBrowser } from "@upstash/react-redis-browser"
 
-import "@upstash/react-databrowser/dist/index.css"
+import "@upstash/react-redis-browser/dist/index.css"
 
-export default function DatabrowserDemo() {
+export default function RedisBrowserDemo() {
   const redisUrl = process.env.NEXT_PUBLIC_UPSTASH_REDIS_REST_URL
   const redisToken = process.env.NEXT_PUBLIC_UPSTASH_REDIS_REST_TOKEN
 
   return (
     <main style={mainStyle}>
       <div style={divStyle}>
-        <Databrowser token={redisToken} url={redisUrl} />
+        <RedisBrowser token={redisToken} url={redisUrl} />
       </div>
     </main>
   )

package.json

@@ -1,5 +1,5 @@
 {
-  "name": "@upstash/react-databrowser",
+  "name": "@upstash/react-redis-browser",
   "version": "0.0.0",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
@@ -9,9 +9,9 @@
     "access": "public"
   },
   "bugs": {
-    "url": "https://github.com/upstash/redis-databrowser/issues"
+    "url": "https://github.com/upstash/react-redis-browser/issues"
   },
-  "homepage": "https://github.com/upstash/redis-databrowser",
+  "homepage": "https://github.com/upstash/react-redis-browser",
   "files": [
     "./dist/**"
   ],
@@ -79,4 +79,4 @@
     "react": "^18.2.0 || ^19",
     "react-dom": "^18.2.0 || ^19"
   }
-}
+}

src/components/databrowser/index.tsx

@@ -14,7 +14,7 @@ import { DataDisplay } from "./components/display"
 import { Sidebar } from "./components/sidebar"
 import { KeysProvider } from "./hooks/use-keys"
 
-export const Databrowser = ({ token, url }: RedisCredentials) => {
+export const RedisBrowser = ({ token, url }: RedisCredentials) => {
   const credentials = useMemo(() => ({ token, url }), [token, url])
 
   return (

src/index.ts

@@ -1 +1 @@
-export { Databrowser } from "@/components/databrowser"
+export { RedisBrowser } from "@/components/databrowser"

src/playground.tsx

@@ -1,10 +1,10 @@
 import ReactDOM from "react-dom/client"
 
-import { Databrowser } from "@/components/databrowser"
+import { RedisBrowser } from "@/components/databrowser"
 
 ReactDOM.createRoot(document.querySelector("#root")!).render(
   <main className="mx-auto flex h-[600px] max-h-full max-w-screen-lg items-center justify-center p-10">
-    <Databrowser
+    <RedisBrowser
       token={process.env.NEXT_PUBLIC_UPSTASH_REDIS_REST_TOKEN}
       url={process.env.NEXT_PUBLIC_UPSTASH_REDIS_REST_URL}
     />