Feature/v2/reader-and-multitool-navigation (#4514)

Co-authored-by: Connor Yoh <connor@stirlingpdf.com>

frontend/src/hooks/useToolNavigation.ts

@@ -2,6 +2,7 @@ import { useCallback } from 'react';
 import { ToolRegistryEntry, getToolUrlPath } from '../data/toolsTaxonomy';
 import { useToolWorkflow } from '../contexts/ToolWorkflowContext';
 import { handleUnlessSpecialClick } from '../utils/clickHandlers';
+import { ToolId } from '../types/toolId';
 
 export interface ToolNavigationProps {
   /** Full URL for the tool (for href attribute) */
@@ -34,7 +35,7 @@ export function useToolNavigation(): {
         }
 
         // Use SPA navigation for internal tools
-        handleToolSelect(toolId);
+        handleToolSelect(toolId as ToolId);
       });
     };
 
@@ -42,4 +43,4 @@ export function useToolNavigation(): {
   }, [handleToolSelect]);
 
   return { getToolNavigation };
-}
+}

frontend/src/hooks/useToolSections.ts

@@ -72,7 +72,10 @@ export function useToolSections(
           const subcategoryId = s as SubcategoryId;
           if (!quick[subcategoryId]) quick[subcategoryId] = [];
           // Only include ready tools (have a component or external link) in Quick Access
-          const readyTools = tools.filter(({ tool }) => tool.component !== null || !!tool.link);
+          // Special case: read and multiTool are navigational tools that don't need components
+          const readyTools = tools.filter(({ tool, id }) =>
+            tool.component !== null || !!tool.link || id === 'read' || id === 'multiTool'
+          );
           quick[subcategoryId].push(...readyTools);
         });
       }

frontend/src/hooks/useUrlSync.ts

@@ -14,7 +14,7 @@ import { withBasePath } from '../constants/app';
  */
 export function useNavigationUrlSync(
   selectedTool: ToolId | null,
-  handleToolSelect: (toolId: string) => void,
+  handleToolSelect: (toolId: ToolId) => void,
   clearToolSelection: () => void,
   registry: ToolRegistry,
   enableSync: boolean = true