UAT: TUI compose() uses generic Textual Header/Footer instead of spec-required custom layout #10337

New issue

Open

opened 2026-04-18 08:51:39 +00:00 by HAL9000 · 0 comments

HAL9000 commented

2026-04-18 08:51:39 +00:00

Owner

Metadata

Field	Value
Branch	`fix/tui-compose-custom-layout`
Commit Message	`fix(tui): replace generic Header/Footer with custom layout in compose()`
Milestone	v3.7.0
Parent Epic	#4946

Background and Context

The TUI specification requires that app.py compose() uses a custom layout and explicitly prohibits the use of generic Textual Header and Footer widgets. The current implementation violates this requirement.

Expected Behavior (from spec)

The compose() method in app.py must use a custom layout — NOT the generic Textual Header and Footer widgets. The spec defines a MainScreen with a horizontal layout (conversation + sidebar) and custom chrome elements appropriate to the TUI design.

Actual Behavior

src/cleveragents/tui/app.py compose() method (lines 108–121):

def compose(self) -> Any:
    yield _Header(show_clock=True)   # ← Generic Textual Header widget
    with _Vertical(id="main-column"):
        yield _Static("CleverAgents TUI", id="conversation")
        yield HelpPanelOverlay(id="help-panel")
        yield ReferencePickerOverlay(id="reference-picker")
        yield SlashCommandOverlay(id="slash-overlay")
        yield ActorSelectionOverlay(id="actor-selection")
        yield PromptInput(
            placeholder="Type message, /command, or !shell ...", id="prompt"
        )
        yield PersonaBar(id="persona-bar")
    yield _Footer()                  # ← Generic Textual Footer widget

The _Header and _Footer are imported from textual.widgets and are the standard generic Textual widgets. The spec requires a custom layout without these generic widgets.

Steps to Reproduce (Code Analysis)

Open src/cleveragents/tui/app.py
Find compose() method (line ~108)
Observe: yield _Header(show_clock=True) and yield _Footer()
These are textual.widgets.Header and textual.widgets.Footer — generic Textual widgets
Compare with spec requirement: "app.py compose() uses custom layout (NOT generic Textual Header/Footer)"

Code Location

src/cleveragents/tui/app.py — compose() method (lines 108–121)
src/cleveragents/tui/app.py — imports: _Header = _textual_widgets.Header, _Footer = _textual_widgets.Footer

Subtasks

Remove _Header and _Footer from compose() method
Implement custom layout chrome appropriate to the TUI design (e.g., throbber at top, custom status bar at bottom)
Update cleveragents.tcss with styles for the custom layout elements
Add Behave scenarios verifying the custom layout is used
Run nox (all default sessions), fix any errors
Verify coverage >= 97%

Definition of Done

This issue is complete when:

All subtasks above are completed and checked off.
compose() no longer uses generic Header or Footer widgets from textual.widgets
A custom layout is implemented per the spec
A Git commit is created where the first line of the commit message matches the Commit Message in Metadata exactly, followed by a blank line, then additional details.
The commit is pushed to the remote on the branch matching the Branch in Metadata exactly.
The commit is submitted as a pull request to master, reviewed, and merged before this issue is marked done.
The TDD testing issue is resolved.

Automated by CleverAgents Bot
Supervisor: UAT Test Pool | Agent: uat-test-pool-supervisor

## Metadata | Field | Value | |---|---| | **Branch** | `fix/tui-compose-custom-layout` | | **Commit Message** | `fix(tui): replace generic Header/Footer with custom layout in compose()` | | **Milestone** | v3.7.0 | | **Parent Epic** | #4946 | --- ## Background and Context The TUI specification requires that `app.py compose()` uses a **custom layout** and explicitly prohibits the use of generic Textual `Header` and `Footer` widgets. The current implementation violates this requirement. ## Expected Behavior (from spec) The `compose()` method in `app.py` must use a custom layout — NOT the generic Textual `Header` and `Footer` widgets. The spec defines a `MainScreen` with a horizontal layout (conversation + sidebar) and custom chrome elements appropriate to the TUI design. ## Actual Behavior `src/cleveragents/tui/app.py` `compose()` method (lines 108–121): ```python def compose(self) -> Any: yield _Header(show_clock=True) # ← Generic Textual Header widget with _Vertical(id="main-column"): yield _Static("CleverAgents TUI", id="conversation") yield HelpPanelOverlay(id="help-panel") yield ReferencePickerOverlay(id="reference-picker") yield SlashCommandOverlay(id="slash-overlay") yield ActorSelectionOverlay(id="actor-selection") yield PromptInput( placeholder="Type message, /command, or !shell ...", id="prompt" ) yield PersonaBar(id="persona-bar") yield _Footer() # ← Generic Textual Footer widget ``` The `_Header` and `_Footer` are imported from `textual.widgets` and are the standard generic Textual widgets. The spec requires a custom layout without these generic widgets. ## Steps to Reproduce (Code Analysis) 1. Open `src/cleveragents/tui/app.py` 2. Find `compose()` method (line ~108) 3. Observe: `yield _Header(show_clock=True)` and `yield _Footer()` 4. These are `textual.widgets.Header` and `textual.widgets.Footer` — generic Textual widgets 5. Compare with spec requirement: "app.py compose() uses custom layout (NOT generic Textual Header/Footer)" ## Code Location - `src/cleveragents/tui/app.py` — `compose()` method (lines 108–121) - `src/cleveragents/tui/app.py` — imports: `_Header = _textual_widgets.Header`, `_Footer = _textual_widgets.Footer` ## Subtasks - [ ] Remove `_Header` and `_Footer` from `compose()` method - [ ] Implement custom layout chrome appropriate to the TUI design (e.g., throbber at top, custom status bar at bottom) - [ ] Update `cleveragents.tcss` with styles for the custom layout elements - [ ] Add Behave scenarios verifying the custom layout is used - [ ] Run `nox` (all default sessions), fix any errors - [ ] Verify coverage >= 97% ## Definition of Done This issue is complete when: - All subtasks above are completed and checked off. - `compose()` no longer uses generic `Header` or `Footer` widgets from `textual.widgets` - A custom layout is implemented per the spec - A Git commit is created where the **first line** of the commit message matches the Commit Message in Metadata exactly, followed by a blank line, then additional details. - The commit is pushed to the remote on the branch matching the **Branch** in Metadata exactly. - The commit is submitted as a **pull request** to `master`, reviewed, and **merged** before this issue is marked done. - The TDD testing issue is resolved. --- **Automated by CleverAgents Bot** Supervisor: UAT Test Pool | Agent: uat-test-pool-supervisor

HAL9000 referenced this issue

2026-04-18 08:52:12 +00:00

TDD: TUI compose() uses generic Textual Header/Footer instead of spec-required custom layout #10338

HAL9000 added the