diff --git a/package-lock.json b/package-lock.json
index b5eeec9..ad817bb 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,11 @@
 {
-  "name": "react-query-lite",
+  "name": "build-your-own-tanstack-query",
   "version": "0.0.0",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
-      "name": "react-query-lite",
-      "version": "0.0.0",
+      "name": "build-your-own-tanstack-query",
       "dependencies": {
         "@tanstack/react-router": "^1.78.2",
         "axios": "^1.7.7",
diff --git a/tanstack-query-lite/react/ReactQueryDevtools.jsx b/tanstack-query-lite/react/ReactQueryDevtools.jsx
index bfa50e7..ee627d7 100644
--- a/tanstack-query-lite/react/ReactQueryDevtools.jsx
+++ b/tanstack-query-lite/react/ReactQueryDevtools.jsx
@@ -12,6 +12,14 @@ const ReactQueryDevtools = () => {
 
   const queries = queryClient.getQueryCache().getAll();
   const sortedQueries = [...queries].sort((a, b) => (a.queryHash > b.queryHash ? 1 : -1));
+  function renderStatus(status, isFetching, observers) {
+    if (isFetching) return <span className="text-blue-500">fetching</span>;
+    if (!observers.length) return <span className="text-gray-500">inactive</span>;
+    if (status === "success") return <span className="text-green-500">success</span>;
+    if (status === "error") return <span className="text-red-500">error</span>;
+    return null;
+  }
+
 
   return (
     <div className="fixed bottom-0 w-full overflow-scroll text-white bg-black divide-y-2 divide-gray-800 divide-solid">
@@ -24,27 +32,7 @@ const ReactQueryDevtools = () => {
         return (
           <div key={queryHash} className="p-2">
             {JSON.stringify(queryKey, null, 2)}, {JSON.stringify({ staleTime, gcTime }, null, 2)} -{" "}
-            <span className="font-bold">
-              {(() => {
-                if (isFetching) {
-                  return <span className="text-blue-500">fetching</span>;
-                }
-
-                if (!observers.length) {
-                  return <span className="text-gray-500">inactive</span>;
-                }
-
-                if (status === "success") {
-                  return <span className="text-green-500">success</span>;
-                }
-
-                if (status === "error") {
-                  return <span className="text-red-500">error</span>;
-                }
-
-                return null;
-              })()}
-            </span>
+            <span className="font-bold">{renderStatus(status, isFetching, observers)}</span>
           </div>
         );
       })}