fix(logs): add logs-page Suspense boundary and co-locate nuqs params

- Wrap <Logs/> in <Suspense fallback={<LogsLoading/>}> so the nuqs reads
  (useLogFilters, executionId) have a boundary ancestor like sibling pages.
- Co-locate the executionId param in logs/search-params.ts (read-only,
  intentionally not stripped) and consume it in logs.tsx.
- Migrate log-details activeTab to a deep-linkable nuqs tab param (single
  LogDetails instance; preview path uses ExecutionSnapshot, not LogDetails).
- Align cleanup.md description pass order with the numbered steps.
- Replace mothership.tsx local Tab type with exported MothershipTab.

Author: waleedlatif1

.claude/commands/cleanup.md

@@ -1,5 +1,5 @@
 ---
-description: Run all code quality skills in sequence — effects, memo, callbacks, state, url-state, React Query, and emcn design review
+description: Run all code quality skills in sequence — effects, memo, callbacks, state, React Query, emcn design review, and url-state
 argument-hint: [scope] [fix=true|false]
 ---
 

apps/sim/app/workspace/[workspaceId]/logs/components/log-details/log-details.tsx

@@ -3,6 +3,7 @@
 import { memo, useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react'
 import { formatDuration } from '@sim/utils/formatting'
 import { ArrowDown, ArrowUp, Check, ChevronUp, Clipboard, Search, X } from 'lucide-react'
+import { useQueryState } from 'nuqs'
 import { createPortal } from 'react-dom'
 import {
   Button,
@@ -34,6 +35,10 @@ import {
   TraceView,
 } from '@/app/workspace/[workspaceId]/logs/components'
 import { useLogDetailsResize } from '@/app/workspace/[workspaceId]/logs/hooks'
+import {
+  logDetailsTabParam,
+  logDetailsTabUrlKeys,
+} from '@/app/workspace/[workspaceId]/logs/search-params'
 import {
   DELETED_WORKFLOW_LABEL,
   formatDate,
@@ -262,23 +267,22 @@ interface LogDetailsContentProps {
 
 export function LogDetailsContent({ log, onActiveTabChange }: LogDetailsContentProps) {
   const [isExecutionSnapshotOpen, setIsExecutionSnapshotOpen] = useState(false)
-  const [activeTab, setActiveTab] = useState<LogDetailsTab>('overview')
-  const [prevLogId, setPrevLogId] = useState(log.id)
+  const [activeTab, setActiveTab] = useQueryState(logDetailsTabParam.key, {
+    ...logDetailsTabParam.parser,
+    ...logDetailsTabUrlKeys,
+  })
   const { copied: copiedRunId, copy: copyRunId } = useCopyToClipboard({ resetMs: 1500 })
 
-  if (prevLogId !== log.id) {
-    setPrevLogId(log.id)
-    setActiveTab('overview')
-  }
-
   const scrollAreaRef = useRef<HTMLDivElement>(null)
 
   const { config: permissionConfig } = usePermissionConfig()
 
   useEffect(() => {
+    setActiveTab('overview')
     if (scrollAreaRef.current) {
       scrollAreaRef.current.scrollTop = 0
     }
+    // eslint-disable-next-line react-hooks/exhaustive-deps -- stable nuqs setter; reset tab on log change
   }, [log.id])
 
   const isLikelyExecution = !!log.executionId && log.trigger !== 'mothership'

apps/sim/app/workspace/[workspaceId]/logs/logs.tsx

@@ -12,7 +12,7 @@ import {
 import { formatDuration } from '@sim/utils/formatting'
 import { useQueryClient } from '@tanstack/react-query'
 import { useParams } from 'next/navigation'
-import { parseAsString, useQueryState } from 'nuqs'
+import { useQueryState } from 'nuqs'
 import {
   Button,
   ChipCombobox,
@@ -54,6 +54,7 @@ import type {
 import { Resource } from '@/app/workspace/[workspaceId]/components'
 import { useLogFilters } from '@/app/workspace/[workspaceId]/logs/hooks/use-log-filters'
 import { useSearchState } from '@/app/workspace/[workspaceId]/logs/hooks/use-search-state'
+import { executionIdParam } from '@/app/workspace/[workspaceId]/logs/search-params'
 import type { Suggestion } from '@/app/workspace/[workspaceId]/logs/types'
 import { useUserPermissionsContext } from '@/app/workspace/[workspaceId]/providers/workspace-permissions-provider'
 import { getBlock } from '@/blocks/registry'
@@ -229,7 +230,7 @@ export default function Logs() {
     isSidebarOpen: false,
   })
 
-  const [executionId] = useQueryState('executionId', parseAsString)
+  const [executionId] = useQueryState(executionIdParam.key, executionIdParam.parser)
   const [pendingExecutionId, setPendingExecutionId] = useState<string | null>(() => executionId)
 
   const [searchQuery, setSearchQuery] = useState(urlSearchQuery)

apps/sim/app/workspace/[workspaceId]/logs/page.tsx

@@ -1,8 +1,22 @@
+import { Suspense } from 'react'
 import type { Metadata } from 'next'
+import LogsLoading from '@/app/workspace/[workspaceId]/logs/loading'
 import Logs from '@/app/workspace/[workspaceId]/logs/logs'
 
 export const metadata: Metadata = {
   title: 'Logs',
 }
 
-export default Logs
+/**
+ * Logs page entry. `Logs` reads URL query params via nuqs (which uses
+ * `useSearchParams` internally), so it must sit under a Suspense boundary. The
+ * fallback renders the real chrome so a suspend never shows a blank frame; the
+ * route-level `loading.tsx` covers the navigation/chunk-load transition.
+ */
+export default function LogsPage() {
+  return (
+    <Suspense fallback={<LogsLoading />}>
+      <Logs />
+    </Suspense>
+  )
+}

apps/sim/app/workspace/[workspaceId]/logs/search-params.ts

@@ -1,4 +1,4 @@
-import { createParser, parseAsArrayOf, parseAsString } from 'nuqs/server'
+import { createParser, parseAsArrayOf, parseAsString, parseAsStringLiteral } from 'nuqs/server'
 import {
   CORE_TRIGGER_TYPES,
   type LogLevel,
@@ -112,3 +112,31 @@ export const logFilterUrlKeys = {
   history: 'replace',
   clearOnDefault: true,
 } as const
+
+/**
+ * Read-only deep link to a specific execution. Resolves to a log row and opens
+ * the details sidebar on load. Intentionally NOT stripped — the link stays
+ * shareable — so it carries no `clearOnDefault`/`history` options here.
+ */
+export const executionIdParam = {
+  key: 'executionId',
+  parser: parseAsString,
+} as const
+
+const LOG_DETAILS_TABS = ['overview', 'trace'] as const
+
+/**
+ * Active tab of the log-details sidebar (`overview` / `trace`). Deep-linkable so
+ * a shared link can land on the trace view; `replace` keeps it off the back
+ * stack and `clearOnDefault` drops it from the URL when on the default tab.
+ */
+export const logDetailsTabParam = {
+  key: 'tab',
+  parser: parseAsStringLiteral(LOG_DETAILS_TABS).withDefault('overview'),
+} as const
+
+/** Tab change is view-state, not a destination: replace, clean URL on default. */
+export const logDetailsTabUrlKeys = {
+  history: 'replace',
+  clearOnDefault: true,
+} as const

apps/sim/app/workspace/[workspaceId]/settings/components/mothership/mothership.tsx

@@ -11,6 +11,7 @@ import {
   type BYOKManagerProvider,
 } from '@/app/workspace/[workspaceId]/settings/components/byok/byok-key-manager'
 import {
+  type MothershipTab,
   mothershipParsers,
   mothershipUrlKeys,
 } from '@/app/workspace/[workspaceId]/settings/components/mothership/search-params'
@@ -43,9 +44,7 @@ const ENTERPRISE_BYOK_PROVIDERS: BYOKManagerProvider[] = [
   },
 ]
 
-type Tab = 'overview' | 'licenses' | 'byok'
-
-const TABS: { id: Tab; label: string }[] = [
+const TABS: { id: MothershipTab; label: string }[] = [
   { id: 'overview', label: 'Overview' },
   { id: 'licenses', label: 'Licenses' },
   { id: 'byok', label: 'BYOK' },