# 11 — User Interface

Source: `src/vocal10n/ui/`. Framework: **PySide6 (Qt6, LGPL)**.

## Window Structure

The main window splits vertically into two regions:

```mermaid
flowchart TB
    subgraph A["Section A — Monitoring"]
        direction LR
        subgraph A1["A1 · Live text"]
            direction TB
            A1a["A1a · Source stream"]
            A1b["A1b · Translation stream"]
        end
        subgraph A2["A2 · Metrics + Status"]
            direction TB
            M1["GPU / VRAM"]
            M2["STT / LLM / TTS latency"]
            M3["Module status flags"]
        end
    end
    subgraph B["Section B — QTabWidget"]
        direction LR
        T1["STT"] --- T2["Translation"] --- T3["TTS"] --- T4["Output"] --- T5["OBS"] --- T6["KB"] --- T7["Training"]
    end
    A --- B
```

`section_a.py` and `section_b.py` build these regions; `main_window.py`
puts them together and adds the menu bar and the **Simple/Pro mode**
toggle (see chapter 12).

## Section A — Monitoring

A1 streams text in two stacked panes:

- A1a: source language (live + accumulated, split 30 / 70 by default —
  see commit `971bf66`).
- A1b: target language (same layout).

A2 shows:

- GPU utilisation (%) and VRAM used / total (from `utils.gpu`).
- Three latencies: STT-to-OBS partial, STT confirmed, translation, and
  TTS TTFA.
- Status flags for STT loaded / running, OBS overlay running, current
  source language, LLM running, current target language, TTS running.

## Section B Tabs (Pro Mode)

| Tab | File | Purpose |
|-----|------|---------|
| STT | `tabs/stt_tab.py` | Enable, model picker, load/unload, language, parameters with tooltips, term-file capacity. |
| Translation | `tabs/translation_tab.py` | Enable, backend, source/target language, prompt editor, KB mount, parameters. |
| TTS | `tabs/tts_container_tab.py` (+ `tts_tab.py`, `qwen3_tts_tab.py`) | Backend selector, source/target enable, device routing, reference audio, parameters. |
| Output | `tabs/output_tab.py` | Per-format file output toggles, output directory. |
| OBS | `tabs/obs_tab.py` | Overlay enable, per-language styling, live preview. |
| KB | `tabs/kb_tab.py` | STT term files (file table + editor) and hallucination filter editor. Consolidated in commit `eb263e5`. |
| Training | `tabs/training_tab.py` | SRT-based training data review (placeholder for future training tooling). |

## Reusable Widgets

- `param_slider.py` — labelled slider/input with an info tooltip
  describing the parameter and a per-parameter reset button (matches the
  spec in `initialplan.md`).
- `model_selector.py` — model dropdown plus Load / Unload buttons that
  mirror `SystemState`. Custom-painted dropdown arrow
  (`ArrowComboBox`) for legibility.
- `stream_text.py` — append-only streaming text widget with a partial
  tail that gets replaced when text is confirmed.
- `term_file_list.py` — drag-drop file table for STT term files.
- `filter_list_editor.py` — editor for `config/filters.txt`.
- `simple_mode_panel.py` — see chapter 12.

## Theming

`styles/theme.qss` provides a dark theme. Several iterations went into
making `QComboBox` arrows and per-button hit areas legible
(commits `bfccf49`, `c500a0b`, `ec49e38`, `2f7e207`, `9f14379`,
`e272bbe`, `a2a7031`, `2e3bcef`).

## Layout Reset

Commit `d4055ca` introduced a clean reset of both source and translation
panes that the Simple-mode Stop button calls so users always see a
predictable, empty starting state.
