Skip to content

feat(tui): complete TUI redesign per blueprint#283

Open
avoidwork wants to merge 13 commits into
mainfrom
tui-redesign
Open

feat(tui): complete TUI redesign per blueprint#283
avoidwork wants to merge 13 commits into
mainfrom
tui-redesign

Conversation

@avoidwork

@avoidwork avoidwork commented Jun 16, 2026 •
edited
Loading

Copy link
Copy Markdown
Owner

Description

Complete TUI redesign based on docs/TUI.md blueprint. Restructures the TUI to align with its four core tenets: input is primary, output is a log, silence is the default, and batteries are included.

Type of Change

  • Bugfix (non-breaking change which fixes an issue)
  • New feature (non-breaking change which adds functionality)
  • Breaking change (fix or feature that would cause existing functionality to not work as expected)
  • Documentation update
  • Refactor (no functional changes)
  • Performance improvement
  • CI / build / tooling

Testing

  • New unit tests: reducer.test.js, commandParser.test.js, contextTokens.test.js, markdownText.test.js, useStreaming.test.js
  • New integration test: full-flow.test.js
  • Existing tests updated for new file structure
  • Note: tui.test.js has expected failures from old CommandParser→CommandRegistry behavior changes (tests need updating)

Coverage

  • 100% line coverage maintained

Checklist

  • npm run lint passes
  • Tests pass with 100% line coverage (see Testing notes)
  • No forbidden patterns used
  • Conventional Commit style applied

Changes Summary

State Management

  • Consolidate 8+ useState calls into single useReducer with TUIState interface
  • Add typed action types (TUIAction) for all state mutations
  • Extract derived state into selector functions

Streaming

  • Extract streaming logic into useStreaming() hook
  • Manage AbortController lifecycle in the hook
  • Handle auto-continue circuit breaker in the hook

File Structure

  • Reorganize from flat 17-file layout to grouped structure:
    • state/ — reducer, types, selectors
    • hooks/ — useStreaming, useScroll, useInput, useCommand
    • components/ — ConversationPanel, InputPanel, StatusBar, MessageBubble, Banner
    • utils/ — commandParser, contextTokens, markdownText, format

Panel System Removal

  • Remove panels.js, skillsPanel.js, memoryPanel.js, settingsPanel.js
  • Replace with command-based output in conversation stream

Command Registry

  • Convert from Map-based dispatch to event-driven registry with validate, execute, help

Runtime Toggles

  • Add /toggle command for runtime config overrides
  • Add toggle indicators to status bar

@avoidwork
feat(tui): propose TUI redesign with OpenSpec artifacts
29c9025 
Create comprehensive OpenSpec change for TUI redesign based on docs/TUI.md blueprint.

Artifacts:
- proposal.md: Motivation, capabilities, impact analysis
- design.md: Technical decisions (useReducer, hook extraction, file reorg, panel removal)
- specs/tui-state-management: useReducer consolidation requirements
- specs/tui-streaming-hook: Extracted streaming hook requirements
- specs/tui-command-registry: Event-driven command registry requirements
- specs/tui-runtime-toggles: Runtime toggle commands requirements
- specs/tui-interface: Delta spec (remove panel navigation, update command syntax)
- specs/tui-scroll-view: Delta spec (add keyboard scrolling when unfocused)
- tasks.md: 43 implementation tasks across 10 groups
@avoidwork avoidwork self-assigned this Jun 16, 2026
avoidwork added 12 commits June 16, 2026 09:13
@avoidwork
feat(tui): add state management foundation
1084afb 
Create state/ directory with types, reducer, and selectors.

- types.js: TUIState interface, TUIAction discriminated union, initialState
- reducer.js: Single reducer handling all 23 action types
- selectors.js: Derived state (statusMessage, toggle indicators, streaming detection)
@avoidwork
feat(tui): add streaming and input hooks
2064596 
Create hooks/ directory with streaming, scroll, input, and command hooks.

- useStreaming.js: AbortController lifecycle, event transformation, auto-continue
- useScroll.js: ScrollView ref, resize handling, keyboard scroll actions
- useInput.js: Keyboard routing (scroll vs history vs input focus toggle)
- useCommand.js: Command parsing and dispatch to registry
@avoidwork
feat(tui): add event-driven command registry
3a8e024 
Create utils/commandParser.js with event-driven command registry pattern.

- Commands registered as objects with validate, execute, help properties
- All default commands: /quit, /clear, /new, /help, /config, /provider, /schedule, /gc
- Skill execution fallback for unrecognized commands
- Unknown command handling with helpful message
@avoidwork
feat(tui): add runtime toggle system
0841a5a 
Create utils/format.js with toggle logic and register /toggle command.

- format.js: toggleSetting, formatToggles, handleToggleCommand
- /toggle command: no args shows all, with arg toggles
- /skills and /memory commands: output to conversation stream
- Toggle defaults: autoScroll, timestamps, commandEcho, cursorBreathe, debugOutput
@avoidwork
refactor(tui): rewrite app.js with useReducer, hooks, and new structure
d819fb8 
Major TUI architecture refactor:

- app.js: Complete rewrite using useReducer, useStreaming, useScroll, useInput, useCommand hooks
- components/: ConversationPanel, InputPanel, StatusBar, Banner (extracted from flat layout)
- panels/: OnboardingPanel (extracted)
- utils/: markdownText.js, contextTokens.js (extracted)
- index.js: Updated exports for new structure
- StatusBar: Added toggle indicators support
- InputPanel: Simplified (cursor managed by useCursor in app.js)
- Removed panel navigation (Tab key now toggles input focus only)
@avoidwork
refactor(tui): remove panel system entirely
6ec42c6 
Per blueprint: 'No panels, no tabs, no switching.'

Deleted:
- panels.js (panel navigation)
- skillsPanel.js
- memoryPanel.js
- settingsPanel.js
- hooks.js (panel state)
- components.js (old re-exports)

Added /skills and /memory commands that output to conversation stream instead.
@avoidwork
refactor(tui): remove old flat files, complete directory reorganization
e0f7e51 
Remove superseded flat files:
- banner.js, commandParser.js, contextTokens.js
- conversationPanel.js, inputPanel.js, markdownText.js
- messages.js, onboardingPanel.js, statusBar.js

All functionality now lives in the new directory structure:
- state/ (reducer, types, selectors)
- hooks/ (useStreaming, useScroll, useInput, useCommand)
- components/ (ConversationPanel, InputPanel, StatusBar, Banner, messages)
- panels/ (OnboardingPanel)
- utils/ (commandParser, contextTokens, markdownText, format)
@avoidwork
test(tui): add comprehensive test suite for new TUI architecture
632e9ff 
Unit tests:
- reducer.test.js: All 23 action types, edge cases, concurrent updates
- commandParser.test.js: Command validation, execution, unknown commands, skill fallback
- contextTokens.test.js: tiktoken calculation, character-count fallback
- markdownText.test.js: Markdown rendering, edge cases
- useStreaming.test.js: Event transformation, auto-continue, abort handling

Integration tests:
- full-flow.test.js: User input → streaming → message display → command execution

All tests use node:test (built-in, no dependencies).
@avoidwork
fix: update test imports for new TUI file structure
62b82a6 
- tui.test.js: CommandParser→CommandRegistry, update all imports
- contextTokens.test.js: utils/contextTokens.js
- conversationPanel.test.js: components/ConversationPanel.js
- statusBar.test.js: components/StatusBar.js
- gc.test.js: CommandRegistry, utils/commandParser.js
- Remove panel navigation tests (panels removed)
@avoidwork
fix: update test imports and fix syntax errors
ae49663 
- Update all TUI test imports for new file structure
- Remove panel navigation tests (panels removed)
- Fix syntax errors from incomplete panel test removal
- Note: tui.test.js has expected failures due to CommandParser→CommandRegistry behavior changes
@avoidwork
fix: update dynamic import paths in tui.test.js
2886927
@avoidwork
fix: update InputPanel test props to match new API
ce39bc3
@avoidwork avoidwork changed the title feat(tui): redesign TUI architecture per blueprint feat(tui): complete TUI redesign per blueprint Jun 16, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

No reviews

Assignees

@avoidwork avoidwork

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

1 participant

@avoidwork