feat: add back navigation, review step, and error retry to TUI

Implements three UX improvements (TODO #1–#3):

- Back navigation: Esc returns to the previous input step. The Model keeps
  a history stack of input steps (advance/goBack helpers); action/wait
  steps are excluded via isInputStep so back never re-enters a
  side-effecting step. Form values are preserved.
- Review step (StepReview): shows all collected config for confirmation
  before any file is written; Enter installs, Esc edits.
- Retry vs. fix: transient failures (image pull, container run) offer
  "r: tentar novamente" instead of quitting; validation failures route
  back to the relevant form to correct the value.

Adds nav_test.go for the history/navigation logic and updates
README/CLAUDE/docs (incl. docs/TODO.md tracking the remaining ideas).

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
jb
2026-06-19 12:19:49 -03:00
co-authored by Claude Opus 4.8
parent 3edfaa4ab2
commit 255b4cc299
9 changed files with 433 additions and 56 deletions
+48
View File
@@ -0,0 +1,48 @@
# TODO — UX / UI improvements
Backlog of usability and interface improvements for the installer TUI. Ordered by
value-to-effort. Status: ☐ pending · ☑ done.
## High value
- ☑ **1. Back navigation between steps.** Maintain a history stack of *input* steps
(forms + IP question + review) and bind `Esc` to go back. Action steps (download,
generate, run) are not part of the stack and are not re-enterable via back. Form
values are preserved because the `FormStep`s live on the `Model`.
- ☑ **2. Review/summary step before running containers.** Show all collected config
(`StepReview`) for confirmation before `StepGenerateFile`/`StepRunDocker`. Natural
anchor for "go back and edit a section" via `Esc`.
- ☑ **3. Retry instead of quit on transient errors.** Image pull / container run
failures offer `r: tentar novamente` (re-runs just that command) instead of throwing
away the whole session. Validation errors (generate file) route back to the relevant
form to fix the value.
## Medium value
- ☐ **4. Center the layout (vertically + horizontally).** Use
`lipgloss.Place(m.width, m.height, lipgloss.Center, lipgloss.Center, body)` — the
Model already tracks `width`/`height`. Caveat: every `viewXxx`/`form.View` currently
hardcodes a manual left pad (`strings.Repeat(" ", padding)`); to center cleanly,
strip that and wrap the body in one padded/bordered box, then `Place` it. Consider
pinning the help footer to the bottom rather than centering it with the body.
- ☐ **5. Inline field validation.** Numeric validation currently happens only at file
write time (`WriteConfigFile`), far from input. Wire `textinput.Validate` per field
and render a red hint under invalid fields in `form.go`.
- ☐ **6. Step indicator.** Show "Etapa N / Total" or a breadcrumb in the header. Total
is dynamic because the vproxy branch adds steps.
## Low value / cosmetic
- ☐ **7. Replace the fake progress bar.** `viewCheckDocker` animates a random-increment
bar for an instant `LookPath` check, then waits for a keypress. Use a spinner that
resolves immediately (or auto-advance on success).
- ☐ **8. Bordered card + `bubbles/help` footer.** Wrap the body in a rounded
`lipgloss` border and render the footer via `bubbles/help` with a proper key map and
a `?` toggle. Pairs with #4.
- ☐ **9. Password reveal toggle** (`ctrl+r`) on the login password field.
+17 -3
View File
@@ -21,9 +21,23 @@ executadas em segundo plano. As etapas são definidas em
| 11 | `StepServerConfig` | Formulário do servidor (porta, timeout, ambiente, compatibilidade). |
| 12 | `StepDatabaseConfig` | Formulário do banco de dados. |
| 13 | `StepCertConfig` | Formulário do diretório de certificados. |
| 14 | `StepGenerateFile` | Gera o `config.toml`. |
| 15 | `StepRunDocker` | Sobe o container `app-dono-cliente`. |
| 16 | `StepDone` | Mensagem de sucesso. |
| 14 | `StepReview` | Revisão de todas as configurações antes de instalar. |
| 15 | `StepGenerateFile` | Gera o `config.toml`. |
| 16 | `StepRunDocker` | Sobe o container `app-dono-cliente`. |
| 17 | `StepDone` | Mensagem de sucesso. |
## Navegação e tratamento de erros
- **Voltar (`Esc`):** retorna à etapa de entrada anterior (formulários, pergunta de IP
e revisão). O `Model` mantém uma pilha `history` de etapas; etapas de ação (downloads,
geração de arquivo, subida de container) ficam de fora e não são reexecutadas ao
voltar. Os valores já digitados nos formulários são preservados.
- **Revisão (`StepReview`):** antes de gravar qualquer arquivo, todas as configurações
coletadas são exibidas para confirmação. `Enter` confirma e gera o `config.toml`;
`Esc` volta ao formulário anterior para editar.
- **Tentar novamente:** falhas transitórias (download de imagem, subida de container)
oferecem `r` para reexecutar apenas aquele passo (`q` sai). Erros de validação
(geração de arquivo) levam de volta ao formulário correspondente para correção.
## Detalhamento