better live update status of indexing

src/routes/search.tsx

···
 import { useQueryClient } from "@tanstack/react-query";
 import { createFileRoute, useSearch } from "@tanstack/react-router";
 import { useAtom } from "jotai";
-import { useMemo } from "react";
+import { useEffect,useMemo } from "react";
 
 import { Header } from "~/components/Header";
 import { Import } from "~/components/Import";
···
 } from "~/utils/useQuery";
 
 import { renderSnack } from "./__root";
+import { SliderPrimitive } from "./settings";
 
 export const Route = createFileRoute("/search")({
   component: Search,
···
   const { data: identity } = useQueryIdentity(agent?.did);
   const [lycandomain] = useAtom(lycanURLAtom);
   const lycanExists = lycandomain !== "";
-  const { data: lycanstatusdata } = useQueryLycanStatus();
+  const { data: lycanstatusdata, refetch } = useQueryLycanStatus();
   const lycanIndexed = lycanstatusdata?.status === "finished" || false;
+  const lycanIndexing = lycanstatusdata?.status === "in_progress" || false;
+  const lycanIndexingProgress = lycanIndexing
+    ? lycanstatusdata?.progress
+    : undefined;
+
   const authed = status === "signedIn";
 
   const lycanReady = lycanExists && lycanIndexed && authed;
 
   const { q }: { q: string } = useSearch({ from: "/search" });
 
-  //const lycanIndexed = useQuery();
+  // auto-refetch Lycan status until ready
+  useEffect(() => {
+    if (!lycanExists || !authed) return;
+    if (lycanReady) return;
+
+    const interval = setInterval(() => {
+      refetch();
+    }, 3000);
+
+    return () => clearInterval(interval);
+  }, [lycanExists, authed, lycanReady, refetch]);
 
   const maintext = !lycanExists
     ? "Sorry we dont have search. But instead, you can load some of these types of content into Red Dwarf:"
···
         constructLycanRequestIndexQuery(opts)
       );
       if (
-        response?.message !== "Import has already started" ||
-        response?.message !== "Import has already started"
+        response?.message !== "Import has already started" &&
+        response?.message !== "Import has been scheduled"
       ) {
         renderSnack({
           title: "Registration failed!",
···
           title: "Succesfully sent registration request!",
           description: "Please wait for the server to index your account",
         });
+        refetch();
       }
     } catch {
       renderSnack({
···
           </p>
 
           {lycanExists && authed && !lycanReady ? (
-            <div className="mt-4 mx-auto">
-              <button
-                onClick={() =>
-                  index({
-                    agent: agent || undefined,
-                    isAuthed: status === "signedIn",
-                    pdsUrl: identity?.pds,
-                    feedServiceDid: "did:web:" + lycandomain,
-                  })
-                }
-                className="px-6 py-2 h-12 rounded-full bg-gray-100 dark:bg-gray-800 
+            !lycanIndexing ? (
+              <div className="mt-4 mx-auto">
+                <button
+                  onClick={() =>
+                    index({
+                      agent: agent || undefined,
+                      isAuthed: status === "signedIn",
+                      pdsUrl: identity?.pds,
+                      feedServiceDid: "did:web:" + lycandomain,
+                    })
+                  }
+                  className="px-6 py-2 h-12 rounded-full bg-gray-100 dark:bg-gray-800 
                              text-gray-700 dark:text-gray-300 hover:bg-gray-200 dark:hover:bg-gray-700 transition"
-              >
-                Index my Account
-              </button>
-            </div>
+                >
+                  Index my Account
+                </button>
+              </div>
+            ) : (
+              <div className="mt-4 gap-2 flex flex-col">
+                <span>indexing...</span>
+                <SliderPrimitive
+                  value={lycanIndexingProgress || 0}
+                  min={0}
+                  max={1}
+                />
+              </div>
+            )
           ) : (
             <></>
           )}

src/routes/settings.tsx

···
     </Slider.Root>
   );
 };
+
+
+interface SliderPProps {
+  value: number;
+  min?: number;
+  max?: number;
+  step?: number;
+}
+
+
+export const SliderPrimitive: React.FC<SliderPProps> = ({
+  value,
+  min = 0,
+  max = 100,
+  step = 1,
+}) => {
+
+  return (
+    <Slider.Root
+      className="relative flex items-center w-full h-4"
+      value={[value]}
+      min={min}
+      max={max}
+      step={step}
+      onValueChange={(v: number[]) => {}}
+    >
+      <Slider.Track className="relative flex-grow h-4 bg-gray-300 dark:bg-gray-700 rounded-full">
+        <Slider.Range className="absolute h-full bg-gray-500 dark:bg-gray-400 rounded-l-full rounded-r-none" />
+      </Slider.Track>
+      <Slider.Thumb className=" hidden shadow-[0_0_0_8px_var(--color-white)] dark:shadow-[0_0_0_8px_var(--color-gray-950)] block w-[3px] h-12 bg-gray-500 dark:bg-gray-400 rounded-md focus:outline-none" />
+    </Slider.Root>
+  );
+};

src/utils/useQuery.ts

···
   [key: string]: unknown;
   error?: "MethodNotImplemented";
   message?: "Method Not Implemented";
-  status?: "finished";
+  status?: "finished" | "in_progress";
+  position?: string,
+  progress?: number,
+
 };
 
+//{"status":"in_progress","position":"2025-08-30T06:53:18Z","progress":0.0878319661441268}
 type importtype = {
   message?: "Import has already started" | "Import has been scheduled"
 }