Checkpoint

Author: eqrion

src/App.tsx

@@ -279,18 +279,18 @@ function getUrlParameter(name: string): string | null {
 
 function updateUrlParameters(params: Record<string, string | null>) {
   const url = new URL(window.location.href);
-  
+
   Object.entries(params).forEach(([key, value]) => {
     if (value === null) {
       url.searchParams.delete(key);
     } else {
       url.searchParams.set(key, value);
     }
   });
-  
+
   // Only push state if the URL actually changed
   if (url.toString() !== window.location.href) {
-    window.history.pushState({}, '', url.toString());
+    window.history.pushState({}, "", url.toString());
   }
 }
 
@@ -323,9 +323,9 @@ function LoadedApp() {
 
   // Initialize state from URL parameters
   useEffect(() => {
-    const initialRootNodeId = getUrlParameter('root');
-    const initialSelectedNodeId = getUrlParameter('selected');
-    
+    const initialRootNodeId = getUrlParameter("root");
+    const initialSelectedNodeId = getUrlParameter("selected");
+
     if (initialRootNodeId) {
       setRootNodeId(initialRootNodeId);
     }
@@ -337,22 +337,22 @@ function LoadedApp() {
   // Listen for browser navigation (back/forward buttons)
   useEffect(() => {
     const handlePopState = () => {
-      const urlRootNodeId = getUrlParameter('root');
-      const urlSelectedNodeId = getUrlParameter('selected');
-      
+      const urlRootNodeId = getUrlParameter("root");
+      const urlSelectedNodeId = getUrlParameter("selected");
+
       setRootNodeId(urlRootNodeId);
       setSelectedNodeId(urlSelectedNodeId);
     };
 
-    window.addEventListener('popstate', handlePopState);
-    return () => window.removeEventListener('popstate', handlePopState);
+    window.addEventListener("popstate", handlePopState);
+    return () => window.removeEventListener("popstate", handlePopState);
   }, []);
 
   // Update URL when rootNodeId changes
   useEffect(() => {
-    updateUrlParameters({ 
+    updateUrlParameters({
       root: rootNodeId,
-      selected: rootNodeId ? selectedNodeId : null 
+      selected: rootNodeId ? selectedNodeId : null,
     });
   }, [rootNodeId, selectedNodeId]);
 
@@ -368,17 +368,17 @@ function LoadedApp() {
         setTreeIndex(0);
 
         // Reset UI state but preserve URL parameters
-        const urlRootNodeId = getUrlParameter('root');
-        const urlSelectedNodeId = getUrlParameter('selected');
-        
+        const urlRootNodeId = getUrlParameter("root");
+        const urlSelectedNodeId = getUrlParameter("selected");
+
         // Only reset if the URL doesn't specify nodes
         if (!urlRootNodeId) {
           setRootNodeId(null);
         }
         if (!urlSelectedNodeId) {
           setSelectedNodeId(null);
         }
-        
+
         setError(null);
       })
       .catch((err) => {
@@ -422,8 +422,6 @@ function LoadedApp() {
     }
   }, [selectedNodeId, subtree]);
 
-
-
   useEffect(() => {
     mermaid.initialize({
       startOnLoad: false,
@@ -1053,7 +1051,7 @@ function NodeViewer({
         <div className="flex items-center gap-1">
           <button
             onClick={() => onRootSelect(nodeId)}
-            className="p-1 hover:bg-gray-100 text-xs text-gray-600 underline hover:text-gray-700 rounded"
+            className="p-1 hover:bg-gray-100 text-xs text-gray-800 underline hover:text-gray-900 rounded"
             title="Focus as root"
           >
             Focus