- AutoReviewPanel: remove unused AnimatePresence, CardDescription; prefix unused params
- SkillConfigurator: remove unused AnimatePresence, Button; prefix agentId
- AgentConfigPage: remove unused AlertTriangle, RefreshCw, AGENT_FILES; wire SkillConfigurator into skills tab
- LLMAssistPanel: remove unused RefreshCw, ScrollArea, Separator; prefix agentId
- ModelBehaviorConfig: prefix unused isLoading param
- ModelSelector: remove unused Badge; prefix placeholder param
- useAgents: prefix unused isDefault param, fetchAgentsFromConfig fn

@xyflow (React Flow for DAG visualization) was bundled into the vendor-react
chunk despite only being used on workstream/workflow pages. Moving it to
vendor-xyflow isolates 122 kB that's only loaded when needed.

Before: vendor-react 557 kB (everything)
After:  vendor-react 433 kB + vendor-xyflow 122 kB (lazy)

…mance

Add page-specific skeleton loading states that match actual content layout:
- HomeSkeleton: greeting, quick chat, agent grid, panel layout
- AgentListSkeleton: header + search + 3x3 card grid
- AgentDetailSkeleton: back nav, agent header, tabs, stats, content area
- ConversationListSkeleton: sidebar + empty state
- ChatThreadSkeleton: header, message bubbles pattern, input bar
- SettingsSkeleton: sidebar nav + settings content
- WorkstreamsSkeleton: header, filter tabs, workstream cards

Wire AgentDetailSkeleton into /agents/[agentId] route.

…stency

- Fix sidebar branding: 'Second Brain' → 'OpenClaw', logo initial 'S' → 'O'
- Remove 211 'use client' directives (Next.js artifact, meaningless in Vite)
- Fix homepage greeting: remove hardcoded 'User!' placeholder
- Normalize container patterns in Nodes and Jobs pages (remove redundant
  min-h-screen/max-w-7xl wrappers — AppShell already provides these)
- Add new /skills route with full CRUD: list, search, filter, enable/disable,
  install from URL/ClawhHub, uninstall, detail panel with config view
- Add Skills nav item to sidebar under Team section
- All changes use existing gateway hooks and API layer (no new APIs needed)
- Build passes cleanly (6.71s)

- Add MobileBottomNav component with Home, Chat, Agents, Settings tabs
- 'More' tab opens full sidebar as a slide-out sheet
- Visible only on screens < md (768px), hidden on tablet/desktop
- Auto-hides on fullscreen pages (onboarding, unlock)
- Add bottom padding to content area on mobile to prevent nav overlap
- Respects safe-area-inset for notched devices
- Export from layout index

- Add /logs route with log stream viewer (Power User mode)
  - Level filtering (trace/debug/info/warn/error/fatal) with counts
  - Search/filter by message or subsystem
  - Auto-scroll toggle, pause/resume stream
  - Export filtered logs as text file
  - Color-coded log levels with appropriate icons
  - Monospace font, compact density for log readability
- Add Logs nav item to sidebar Power User section
- Uses sample data for UI development; ready for gateway integration

- Sidebar: Updated logo text from 'Second Brain' to 'OpenClaw'
- Home page: Reads user display name from profile settings instead of hardcoded 'User!'
- Filesystem: Updated API endpoint and config references to openclaw.ai
- App.tsx: Updated sandbox page branding

Files changed:
- /Users/openclaw/openclaw-ui-redesign/apps/web/src/components/layout/Sidebar.tsx
- /Users/openclaw/openclaw-ui-redesign/apps/web/src/routes/index.tsx
- /Users/openclaw/openclaw-ui-redesign/apps/web/src/routes/filesystem/index.tsx
- /Users/openclaw/openclaw-ui-redesign/apps/web/src/App.tsx

- New route: /logs with polling-based log tail via gateway 'logs.tail' RPC
- Features: level filtering (trace/debug/info/warn/error/fatal), text search,
  auto-follow, pause/resume, export to JSONL, entry counts per level
- Dark terminal-style UI with color-coded log levels
- Added to sidebar Power User section with ScrollText icon
- Handles disconnected state gracefully

Files changed:
- /Users/openclaw/openclaw-ui-redesign/apps/web/src/routes/logs/index.tsx (new)
- /Users/openclaw/openclaw-ui-redesign/apps/web/src/components/layout/Sidebar.tsx
- /Users/openclaw/openclaw-ui-redesign/apps/web/src/routeTree.gen.ts (auto-generated)

…l/agent breakdowns

- New route: /analytics with gateway 'sessions.usage' + 'usage.cost' RPC
- Features: date range picker, stat cards (tokens/cost/messages/tools),
  daily bar charts (tokens + cost), model/agent/tool breakdowns with progress bars,
  full session table with sort-by-cost, expand/collapse
- Token and cost breakdown cards showing input/output/cache splits
- Responsive grid layout, loading skeletons, disconnected state
- Added to sidebar Power User section with BarChart3 icon

Files changed:
- /Users/openclaw/openclaw-ui-redesign/apps/web/src/routes/analytics/index.tsx (new)
- /Users/openclaw/openclaw-ui-redesign/apps/web/src/components/layout/Sidebar.tsx
- /Users/openclaw/openclaw-ui-redesign/apps/web/src/routeTree.gen.ts (auto-generated)

- RouteErrorComponent wraps ErrorFallback with router-aware recovery
- 'Try Again' invalidates the current route (re-fetches data)
- 'Go Home' navigates to / via router (no full page reload)
- Complements existing React ErrorBoundary for render-crash recovery

File changed:
- /Users/openclaw/openclaw-ui-redesign/apps/web/src/routes/__root.tsx

…e region announcer

- Add SkipNavLink + SkipNavContent for keyboard users to bypass sidebar (WCAG 2.4.1)
- Add ReducedMotionProvider wrapping app root — respects prefers-reduced-motion (WCAG 2.3.3)
- Add role/tabIndex/onKeyDown to 6 interactive non-button elements:
  ToolCategorySection, ConversationItem, MemoryCard (2 variants),
  agent-plan task toggle, GatewaySetupStep radio cards
- Add focus-visible ring styles to all fixed elements
- Add aria-label/role='navigation' to Sidebar landmark
- Add aria-expanded/aria-controls to expandable sections
- Add useAnnounce hook + useRouteAnnouncer for screen reader live regions
- Build verified: 7.03s, no errors

- Announce navigation to screen readers via useAnnounce live region
- Update document.title on route changes (e.g. 'Settings — OpenClaw')
- Derives human-readable page name from URL path segment
- WCAG 4.1.3: Status Messages compliance

- New AgentActivityFeed component with real-time agent activity stream
- Shows agent avatar, activity type (7 types), description, relative timestamp
- Color-coded activity icons: session started, message sent, tool called,
  task completed, task failed, agent spawned, file edited
- Auto-refresh every 30s with live indicator pulse
- Proper empty state with guidance text
- ARIA: role=feed, role=article, aria-labels, semantic time elements
- Mock data hook (useAgentActivity) ready for real API swap
- Replaces placeholder widget on home page grid
- Build: 6.96s, no errors

Add reusable AgentStatusDot component with Framer Motion pulse
animations and useAgentStatus hook for deriving display status from
agent store data.

Status types:
- Online (green, slow pulse): active within last 5 minutes
- Busy (amber, fast pulse): currently processing or awaiting approval
- Offline (gray, static): inactive
- Error (red, static): error state

Integrated into:
- AgentAvatar (composed) — shared avatar used across the app
- AgentCard (compact + expanded variants) — home grid and agent list
- AgentSessionsIndicator — sidebar waiting-agents popover

Includes auto-expiry timer in useAgentStatus that transitions
online → offline when lastActive exceeds the 5-minute threshold.

Changes landed in c6a1309 (co-committed with #19).

Summary of changes:
- apps/web/src/hooks/useShortcutsSeen.ts (new)
  localStorage-gated hook (key: oc_shortcuts_seen) tracking first-visit state

- apps/web/src/hooks/index.ts
  Export useShortcutsSeen from hooks barrel

- apps/web/src/providers/ShortcutsProvider.tsx
  Add ShortcutsContext exposing openShortcutsModal / shortcutsSeen / markShortcutsSeen;
  mark as seen whenever modal opens via keyboard, button, or command palette

- apps/web/src/providers/index.ts
  Export ShortcutsContext and useShortcutsContext

- apps/web/src/components/layout/Sidebar.tsx
  Add KeyboardShortcutsButton with Framer Motion pulsing dot + 'NEW' badge;
  button calls openShortcutsModal from context; dot/badge auto-dismiss on first open

- apps/web/src/components/composed/CommandPalette.tsx
  Add footer hint: 'Press ? to see all keyboard shortcuts'

- Remove all text-muted-foreground opacity modifiers (/40, /50, /60, /70, /80)
  that caused WCAG AA failures in dark mode. Replaced with full-opacity
  text-muted-foreground which passes at 6.16:1 on background and 5.81:1 on card.

- Add dark: overrides for hardcoded Tailwind gray/slate text colors:
  - text-gray-500 → dark:text-gray-400 (4.13:1→7.86:1)
  - text-gray-600 → dark:text-gray-400 (2.64:1→7.86:1)
  - text-slate-500 → dark:text-slate-400 (4.19:1→7.78:1)

Affected components: 25 files across composed, domain, and route layers.

Key contrast ratios (before → after on --background):
  muted-foreground/40:  1.88:1 → 6.16:1
  muted-foreground/50:  2.32:1 → 6.16:1
  muted-foreground/60:  2.85:1 → 6.16:1
  muted-foreground/70:  3.52:1 → 6.16:1
  muted-foreground/80:  4.27:1 → 6.16:1
  gray-500:             4.13:1 → 7.86:1 (via gray-400)
  gray-600:             2.64:1 → 7.86:1 (via gray-400)
  slate-500:            4.19:1 → 7.78:1 (via slate-400)

…h-TW (#11)

- Add react-i18next, i18next, i18next-browser-languagedetector dependencies
- Create i18n setup with language detection, localStorage persistence, en fallback
- Add 4 locale files (en, pt-BR, zh-CN, zh-TW) with ~75 key strings each:
  - common actions (Save, Cancel, Delete, Create, etc.)
  - navigation labels (Home, Conversations, Goals, Memories, etc.)
  - home dashboard greetings and section titles
  - settings section headings and appearance labels
  - error messages
  - agent status labels
- Import i18n initialization in main.tsx (before component tree)
- Integrate useTranslation in 5 key components:
  - Sidebar: all nav labels and section titles
  - AppearanceSection: all labels + language selector with 4 language options
  - HomePage: time-of-day greeting
  - SettingsPage: page title and subtitle
  - YouPage: page title and subtitle
- Language selector in You > Appearance with live switching

…a, Cmd+S save binding

…route, Logs route

…and Cmd+S

…on, and backend improvements

Conflicts resolved:
- apps/web/{package.json,tsconfig.json,vite.config.ts}: kept our Vite-based UI stack (fork had old Next.js config)
- src/agents/claude-sdk-runner/create-session.ts: kept our 'none' case in thinkingLevel switch
- src/agents/claude-sdk-runner/prepare-session.ts: kept our full thinkingLevel config fallback logic
- src/config/config.claude-sdk-schema.test.ts: kept our thinkingLevel test suite
- src/config/zod-schema.agent-runtime.ts: kept our thinkingLevelField in ClaudeSdkConfigSchema
- src/gateway/call.ts: kept our tailnet local connection support (preferTailnet)
- src/gateway/call.test.ts: kept our test assertions for bindDetail

…ndcss/vite plugin, not PostCSS

- New route /agents/graph with live agent data from gateway
- Parses session key patterns to infer spawn/delegation edges
- ReagraphView integration with custom health-based node coloring
- CSS fallback tree view when reagraph unavailable
- Slide-in detail panel on node click: task, model, tokens, cost, links
- Stats bar: total agents, active count, tokens, cost
- Legend: health colors + spawn edge indicator
- Back link to /agents, 15s auto-refresh
- Added Network icon + Agent Graph link to sidebar Team section
- Removed duplicate Logs entry from Power User section

- New /agents/new route: conversational interface for agent creation
- Split-panel: chat on left, live config preview on right
- NLP parser: extracts name, role, tags, model, personality from freetext
  - Keyword inference for 8 roles (Monitor, Researcher, Developer, etc.)
  - Domain tag extraction for 15 platforms (github, slack, discord, email, etc.)
  - Model preference detection (opus, haiku, gpt-4, gemini, grok)
  - Personality trait extraction (concise, thorough, friendly, etc.)
- Config preview: flash-highlights fields as they update (framer-motion)
- Tags: editable inline with + input and × remove button
- All fields manually editable in preview panel
- Readiness checklist: name + description = ready to create
- 5 suggested starter prompts (GitHub monitor, research, code review, etc.)
- Animated typing indicator while processing
- useCreateAgent() integration → navigates to agent config after creation
- 'Chat Builder' secondary button added to agents list page header
- Simple markdown renderer for **bold** and `code` in assistant messages

…ent-status header

- Chat builder: pass required status: 'offline' to createAgent.mutateAsync
  (Agent interface requires status, new agents start offline)
- Agent Status dashboard: add 'Graph View' ghost button linking to /agents/graph
  (natural navigation path from status dashboard → relationship graph)

… timeout

8 files had 'use client' at the top — a Next.js App Router directive that is
meaningless in Vite/React. Strips as dead noise. No behavior change.

…modal

- Add headerActions slot to DetailPanel so callsites can inject title-bar buttons
- Add Edit icon button in GoalDetailPanel title bar (visible without scrolling)
- Remove goal.status !== 'completed' guard so any goal can be edited
- Extend CreateGoalModal with edit mode: initialGoal prop pre-populates all fields,
  milestones preserve original IDs and completion state, title/CTA reflect edit context
- Wire GoalsPage: handleEdit opens the shared modal in edit mode via useUpdateGoal

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

Replace crypto.randomUUID() in new.lazy.tsx and the custom generateUUID()
utility in gateway-client.ts with the project-standard uuidv7() from @/lib/ids.
Also convert WebSocket on* property handlers to addEventListener calls and
remove unused Card/CardContent imports surfaced during linting.

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

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

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

…entConfigPage

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

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

…reTab in URL

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

…ed mode

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

Follow-ups:
- GoalDetailPanel: add pl-6 indent to Due Date + Created content text
- RitualScheduler: fix dark time input picker icon with CSS invert filter
- RitualDetailPanel: add Trigger quick-action to DetailPanel headerActions slot
- RitualsPage: wire onReassign → RitualAssignDialog (full agent reassignment flow)
- Export RitualAssignDialog + RitualAssignPayload from rituals barrel

Phase 1:
- Add src/config/agent-tabs.ts with AGENT_TABS config, isValidTab(), resolveTab(),
  and TAB_REDIRECTS backwards-compat map for old tab URL params

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

…dge, InheritableField

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

…bNav

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

…sonaTierSection

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

Replaces local AgentDetailTab type with imported type + resolveTab() from
config/agent-tabs.ts. Swaps workstreams tab for work (AgentWorkTab with
WorkSubNav) and adds chat tab (AgentChatTab). Old URL params like
?tab=workstreams and ?tab=rituals are resolved to 'work' via TAB_REDIRECTS.
Section param threaded through for WorkSubNav sub-navigation.

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

Tab triggers now show icon+label stacked on mobile (grid-cols-5) and
side-by-side on sm+. MobileTabNav provides a fixed bottom nav bar on
mobile (hidden sm+) with the same 5-tab structure from AGENT_TABS.
Bottom padding added to page content to prevent overlap with the bar.

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

…reTab

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

…navigation

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

…oute

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

…k 2)

…ponents

Add vitest setup fixes (in-memory localStorage mock + jsdom URL) to make
zustand persist middleware work in tests, and update usePersonaStore tests
to avoid replace=true state reset that strips action functions.

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

… (task 3)

…design

…-redesign