# Slice 2: Visual Configuration

## Status

In progress — Increment 2 Button `onClick` vertical increment complete; request-input UI next

## Objective

Allow an MVP project to be configured through the GUI without routine hand-editing of canonical JSON.

## Dependencies

- Slice 1 component contracts
- Existing action, event, binding, variable, and Preview models
- Canonical top-level `project.bindings` decision

## In Scope

- Visual REST Action CRUD
- Component events, request input mappings, response bindings, variables, and page-load configuration
- Immediate synchronization with canonical project JSON

## Out of Scope

- AI-generated configuration
- Chained actions, general orchestration, and advanced JSONPath authoring

## Tasks

- [x] Design a consistent, progressively disclosed workflow for editing actions, events, bindings, variables, and page-load behavior.
- [x] Implement REST Action list, create, edit, duplicate, and reference-aware delete operations.
- [x] Add method, URL, headers, query, path, and body controls for anonymous REST actions.
- [ ] Decide and implement the canonical timeout field before exposing a timeout control; the current schema and runtime use a fixed backend timeout.
- [x] Keep Slice 2 authentication authoring anonymous-only and defer credential-backed authentication controls to Slice 3.
- [x] Implement component event configuration for Button `onClick`, including add/change/clear and dangling-reference diagnostics.
- [ ] Implement request input authoring through executed REST request templates; do not write inert `ComponentEvent.inputMap`.
- [ ] Implement response source and component/variable target selection.
- [ ] Default new action-response bindings to `onSuccess`.
- [ ] Implement page-load action configuration for initial data population.
- [ ] Add variable declaration and default-value editing.
- [ ] Warn before deleting referenced actions, variables, or components. Action deletion is covered; variable and component deletion remain.
- [x] Ensure every REST action visual edit immediately updates canonical JSON while invalid drafts remain local.
- [ ] Add slice-wide tests, examples, and documentation updates. Increment 1 coverage and a representative REST fixture are complete.

## Implementation Order

1. **REST action authoring:** Add canonical action CRUD, method/URL/request controls, local validation, diagnostics, reference-aware deletion warnings, focused tests, and a representative example project.
2. **Component events and request inputs:** Configure Button `onClick` first, then supported `onChange` events and component/variable request templates.
3. **Response bindings and variables:** Author top-level `project.bindings` with `onSuccess` defaults, supported response paths and targets, plus variable declarations/defaults.
4. **Page-load actions:** Add the minimum page lifecycle contract needed to execute configured `onLoad` actions without introducing general orchestration.
5. **Slice acceptance and hardening:** Complete dangling-reference diagnostics, persistence/JSON synchronization coverage, representative examples, builds, schema validation, and manual workflows.

Each increment writes only canonical configuration into the shared project document. Preview execution values, loading flags, responses, errors, and variable values remain ephemeral runtime state.

## Acceptance Criteria

- [ ] A user can build the workflow launcher without editing JSON.
- [ ] Actions, inputs, triggers, and response mappings can be configured visually.
- [ ] Initial dropdown/table population can be configured visually.
- [ ] Dangling references are reported before Preview execution.
- [ ] Visual and JSON editors remain synchronized and save/load preserves configuration.

## Validation

- [ ] Standalone frontend TypeScript check passes. TypeScript 4.9 currently cannot parse the resolved `@types/node@26.1.0`; the CRA production compile passes.
- [x] Frontend production build passes through the Button `onClick` increment.
- [x] Editor interaction and Preview dispatch tests pass through the Button `onClick` increment.
- [x] Increment 2 representative canonical JSON validates against the schema.
- [x] Increment 1 manual REST action authoring and referenced-action deletion workflow passes.
- [ ] Manual workflow-launcher and dependent-data scenarios pass.

## Risks and Open Questions

- Configuration UI needs progressive disclosure to remain manageable.
- Page-load support must not become a general workflow engine.
- Authentication controls must reference secrets without storing credential values.

## Progress Log

- 2026-07-18: Restored project state from `CODEX.md`, `TASKS.md`, `MVP_SCOPE.md`, and this plan.
- Verified the clean `main` branch against a freshly fetched `origin/main`; both point to `b9697cc8b11bce806887d6e7a29098a308b0846a`.
- Re-ran the pre-change frontend baseline successfully: 7 suites and 433 tests passed.
- Audited the canonical action/event/binding model, Visual Editor, read-only Actions & Bindings Inspector, Preview execution path, schema validation, examples, and existing tests.
- Chose visual REST action authoring as the first coherent vertical increment.
- Completed canonical anonymous REST action creation, editing, duplication, and reference-aware deletion in Actions & Bindings.
- Added progressive request controls for method, endpoint URL, headers, query parameters, static path parameters, and request body; invalid drafts remain local and runtime state remains separate.
- Added action-definition, duplicate-ID, header-name, and path-template diagnostics plus referenced-deletion warnings.
- Added 23 focused tests plus `valid-visual-rest-actions.json`.
- Validation passed under Node 20/npm 10: 9 frontend suites / 456 tests, frontend production build, backend TypeScript build, and the 13-valid / 2-schema-invalid / 2-diagnostic-invalid schema matrix.
- Standalone `tsc --noEmit` remains blocked by the existing TypeScript 4.9 / `@types/node@26.1.0` dependency mismatch; the application production build compiles successfully.
- In-app browser automation could not start during implementation while Docker Desktop was not running. After Docker Desktop and the app were started, the user manually accepted Increment 1 on 2026-07-19, including a Button `onClick` event inserted through canonical JSON and the referenced-action deletion workflow.

## Handoff

- Last completed: Increment 2 visual Button `onClick` configuration, automated validation, and user manual acceptance.
- Next action: Add request-input UI that writes executed REST templates for component and variable values.
- Known blockers: None for request-input implementation. Standalone frontend `tsc` retains its recorded tooling limitation.