feat(network): add pointer/hand mode toggle to diagram toolbar

- Header shows MousePointer2 (select) and Hand (pan) toggle buttons
- Select mode: drag on canvas draws a selection box (selectionOnDrag)
- Pan mode: drag on canvas pans the viewport (panOnDrag)
- Space held in either mode temporarily switches to pan (panActivationKeyCode)
- Keyboard shortcuts: V = select mode, H = pan mode
- Cursor changes to grab/grabbing in pan mode

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

frontend/src/components/network/hooks/useCanvasShortcuts.ts

@@ -36,6 +36,7 @@ export function useCanvasShortcuts({
   onUndo,
   onRedo,
   onNudge,
+  onSetMode,
 }: {
   nodes: Node[]
   edges: Edge[]
@@ -46,6 +47,7 @@ export function useCanvasShortcuts({
   onUndo: () => void
   onRedo: () => void
   onNudge: (dx: number, dy: number) => void
+  onSetMode: (mode: 'select' | 'pan') => void
 }) {
   const { getNodes, fitView, screenToFlowPosition, setNodes: rfSetNodes } = useReactFlow()
   const clipboardRef = useRef<ClipboardData | null>(null)
@@ -242,6 +244,16 @@ export function useCanvasShortcuts({
         return
       }
 
+      // Mode shortcuts: V = select, H = pan
+      if (!ctrl && e.key === 'v') {
+        onSetMode('select')
+        return
+      }
+      if (!ctrl && e.key === 'h') {
+        onSetMode('pan')
+        return
+      }
+
       if (ctrl && e.key === 'c') {
         e.preventDefault()
         copyNodes()
@@ -268,7 +280,7 @@ export function useCanvasShortcuts({
 
     document.addEventListener('keydown', handleKeyDown)
     return () => document.removeEventListener('keydown', handleKeyDown)
-  }, [copyNodes, pasteNodes, duplicateNodes, selectAll, fitView, bringSelectedToFront, sendSelectedToBack, onUndo, onRedo, onNudge])
+  }, [copyNodes, pasteNodes, duplicateNodes, selectAll, fitView, bringSelectedToFront, sendSelectedToBack, onUndo, onRedo, onNudge, onSetMode])
 
   return {
     copyNodes,