Use URL search param for cmd+i navigation to Task Terminals

Pass the tab via ?tab=all-tasks search param instead of relying on
React Query optimistic updates. This makes the intent synchronous -
available on the first render before any effects run, eliminating
the jank where the view briefly switched away before switching back.

Author: knowsuchagency

cli/src/commands/dev.ts

@@ -20,14 +20,14 @@ export async function handleDevCommand(
         )
       }
 
-      output({ status: 'restarting', message: 'Triggering restart (build + restart via systemd)...' })
+      output({ status: 'restarting', message: 'Triggering restart (build + migrate + restart)...' })
       const result = await client.restartVibora()
 
       if (result.error) {
         throw new CliError('RESTART_FAILED', result.error, ExitCodes.OPERATION_FAILED)
       }
 
-      output({ status: 'initiated', message: 'Restart initiated. If build fails, old instance keeps running.' })
+      output({ status: 'initiated', message: 'Restart initiated. If build or migration fails, old instance keeps running.' })
       break
     }
 

server/routes/config.ts

@@ -158,13 +158,13 @@ app.post('/restart', (c) => {
   // Build first in the background, then restart only if successful
   // This prevents stopping the old instance if build fails
   setTimeout(() => {
-    spawn('bash', ['-c', 'cd ~/projects/vibora && mise run build && systemctl --user restart vibora-dev'], {
+    spawn('bash', ['-c', 'cd ~/projects/vibora && mise run build && bun run drizzle-kit push && systemctl --user restart vibora-dev'], {
       detached: true,
       stdio: 'ignore',
     }).unref()
   }, 100)
 
-  return c.json({ success: true, message: 'Restart initiated (building first)' })
+  return c.json({ success: true, message: 'Restart initiated (build + migrate + restart)' })
 })
 
 // GET /api/config/:key - Get config value

src/components/command-palette/command-palette.tsx

@@ -11,7 +11,6 @@ import {
   searchCommands,
   groupCommandsByCategory,
 } from './command-registry'
-import { useTerminalViewState } from '@/hooks/use-terminal-view-state'
 import { HugeiconsIcon } from '@hugeicons/react'
 import {
   GridViewIcon,
@@ -40,7 +39,6 @@ export function CommandPalette({ open: controlledOpen, onOpenChange, onNewTask,
   const inputRef = useRef<HTMLInputElement>(null)
   const listRef = useRef<HTMLDivElement>(null)
   const navigate = useNavigate()
-  const { setActiveTab } = useTerminalViewState()
 
   // Build command list
   const commands = useMemo<Command[]>(() => {
@@ -77,8 +75,7 @@ export function CommandPalette({ open: controlledOpen, onOpenChange, onNewTask,
         category: 'navigation',
         icon: <HugeiconsIcon icon={GridViewIcon} size={16} strokeWidth={2} />,
         action: () => {
-          setActiveTab('all-tasks')
-          navigate({ to: '/terminals' })
+          navigate({ to: '/terminals', search: { tab: 'all-tasks' } })
           setOpen(false)
         },
       },
@@ -144,7 +141,7 @@ export function CommandPalette({ open: controlledOpen, onOpenChange, onNewTask,
       },
     ]
     return cmds
-  }, [navigate, onNewTask, onShowShortcuts, setActiveTab, setOpen, t])
+  }, [navigate, onNewTask, onShowShortcuts, setOpen, t])
 
   // Filter commands based on query
   const filteredCommands = useMemo(
@@ -191,8 +188,7 @@ export function CommandPalette({ open: controlledOpen, onOpenChange, onNewTask,
   useHotkeys('meta+1', () => navigate({ to: '/tasks' }), { allowInInput: true, allowInTerminal: true })
   useHotkeys('meta+2', () => navigate({ to: '/terminals' }), { allowInInput: true, allowInTerminal: true })
   useHotkeys('meta+i', () => {
-    setActiveTab('all-tasks')
-    navigate({ to: '/terminals' })
+    navigate({ to: '/terminals', search: { tab: 'all-tasks' } })
   }, { allowInInput: true, allowInTerminal: true })
   useHotkeys('meta+3', () => navigate({ to: '/worktrees' }), { allowInInput: true, allowInTerminal: true })
   useHotkeys('meta+4', () => navigate({ to: '/repositories' }), { allowInInput: true, allowInTerminal: true })

src/routes/terminals/index.tsx

@@ -1,4 +1,4 @@
-import { createFileRoute } from '@tanstack/react-router'
+import { createFileRoute, useSearch, useNavigate } from '@tanstack/react-router'
 import { useCallback, useRef, useEffect, useMemo, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { TerminalGrid } from '@/components/terminal/terminal-grid'
@@ -26,12 +26,21 @@ import { log } from '@/lib/logger'
 const ALL_TASKS_TAB_ID = 'all-tasks'
 const ACTIVE_STATUSES: TaskStatus[] = ['IN_PROGRESS', 'IN_REVIEW']
 
+interface TerminalsSearch {
+  tab?: string
+}
+
 export const Route = createFileRoute('/terminals/')({
   component: TerminalsView,
+  validateSearch: (search: Record<string, unknown>): TerminalsSearch => ({
+    tab: typeof search.tab === 'string' ? search.tab : undefined,
+  }),
 })
 
 function TerminalsView() {
   const { t } = useTranslation('terminals')
+  const navigate = useNavigate()
+  const { tab: tabFromUrl } = useSearch({ from: '/terminals/' })
   const {
     terminals,
     tabs,
@@ -53,15 +62,28 @@ function TerminalsView() {
   // Track active tab via server-persisted state
   const { activeTabId, setActiveTab, isLoading: isViewStateLoading } = useTerminalViewState()
 
+  // Handle tab from URL search param (e.g., from cmd+i navigation)
+  // This runs before the fallback effect and clears the URL param
+  const hasAppliedUrlTab = useRef(false)
+  useEffect(() => {
+    if (tabFromUrl && !hasAppliedUrlTab.current) {
+      hasAppliedUrlTab.current = true
+      setActiveTab(tabFromUrl)
+      // Clear the search param from URL without adding to history
+      navigate({ to: '/terminals', search: {}, replace: true })
+    }
+  }, [tabFromUrl, setActiveTab, navigate])
+
   // Ensure activeTabId is valid - set to first tab if invalid
+  // Skip if we just applied a tab from URL to avoid race condition
   useEffect(() => {
-    if (tabs.length > 0 && !isViewStateLoading) {
+    if (tabs.length > 0 && !isViewStateLoading && !tabFromUrl) {
       const tabIds = tabs.map((t) => t.id)
       if (!activeTabId || (!tabIds.includes(activeTabId) && activeTabId !== ALL_TASKS_TAB_ID)) {
         setActiveTab(tabs[0].id)
       }
     }
-  }, [tabs, activeTabId, isViewStateLoading, setActiveTab])
+  }, [tabs, activeTabId, isViewStateLoading, setActiveTab, tabFromUrl])
 
   const { data: tasks = [], isLoading: isTasksLoading } = useTasks()
   const { data: repositories = [] } = useRepositories()