# Inline Account Editing in Sales Summary Wizard

## Problem

The current edit wizard for sales summaries renders every item in a flat data-grid with a full typeahead component per row for account assignment. This requires heavy scrolling and makes it hard to see the debit/credit structure at a glance.

## Solution

Redesign the wizard's MainStep to mirror the embedded grid's two-column layout (debits / credits), and replace the always-visible typeahead with a click-to-swap inline editing pattern powered by HTMX.

## Current Flow

1. Click pencil icon on a grid row → opens full modal wizard
2. Wizard renders a data-grid where every row has: category (hidden or text input), account (typeahead), debit, credit
3. Every row initializes a typeahead component, even if the user only needs to edit one account
4. Heavy scrolling due to tall rows

## New Flow

1. Click pencil icon on a grid row → opens modal wizard showing two columns (debits / credits) matching the embedded grid layout
2. Each item's account cell renders in **display mode**: account name text + hidden input holding the account ID + pencil icon. If no account is assigned, shows a red "Missing acct" pill + pencil icon.
3. Click pencil on an account cell → `hx-get` to `::route/edit-item-account` → server returns **edit mode** (typeahead + confirm/cancel buttons), replacing just that cell via `hx-swap "innerHTML"`
4. User selects an account in the typeahead → clicks confirm → `hx-put` to `::route/save-item-account` → server returns **display mode** (updated account name text + updated hidden input + pencil icon)
5. Click cancel → `hx-get` to `::route/cancel-item-account` → server returns original display mode
6. When the user submits the entire wizard form, all hidden inputs (including updated account IDs) are collected by the existing multi-form-state decode and saved in a single DB transaction

### Key Constraint

HTMX routes only manage interactivity (swapping cells). No DB writes happen until the wizard form is submitted via the existing submit handler.

## New Routes

| Route Key | Method | Purpose |
|---|---|---|
| `::route/edit-item-account` | GET | Returns typeahead + confirm/cancel for one account cell |
| `::route/save-item-account` | PUT | Returns display mode with updated hidden input value |
| `::route/cancel-item-account` | GET | Returns display mode with original hidden input value |

### Route Parameters

All three routes receive:
- `item-index` — the index of the sales-summary/item in the vector (to construct the correct field name prefix)
- `client-id` — for the typeahead search URL
- The form-cursor field name prefix is derived from `item-index` so the returned hidden input has the correct `name` attribute (e.g. `step-params[sales-summary/items][2][ledger-mapped/account]`)

Additionally:
- `edit-item-account` and `cancel-item-account` receive the `current-account-id` as a query param so cancel can restore the original value
- `save-item-account` receives the selected account ID from the typeahead's form submission in the request body

## Wizard MainStep Changes

### Layout

Replace the current flat data-grid with a two-column layout mirroring the embedded grid:

```
+-------------------------------------------+
| Debits              | Credits             |
|-------------------------------------------|
| Category  Acct  Amt | Category  Acct  Amt |
| ...                 | ...                 |
|-------------------------------------------|
| Total: $X,XXX.XX   | Total: $X,XXX.XX    |
| Delta: $XX.XX       | Delta: $XX.XX       |
+-------------------------------------------+
| [+ New Summary Item]                       |
+-------------------------------------------+
```

### Item Rendering (Display Mode)

For each item (non-manual):
- **Category**: text label + hidden input
- **Account**: account name text (or "Missing acct" pill) + hidden input with account ID + pencil icon with `hx-get`
- **Amount**: formatted dollar amount (debit or credit column)

### Item Rendering (Edit Mode — account cell only)

When the pencil is clicked, only the account cell swaps to:
- Typeahead component (same `account-typeahead*` as current)
- Confirm button (small check icon) with `hx-put`
- Cancel button (small X icon) with `hx-get`

### Manual Items

Same as current: category text input, account typeahead, debit/credit money inputs, delete button. The "New Summary Item" button remains. Manual items are always in "edit mode" since they have editable fields beyond just account.

### Hidden Inputs

Every item row must include hidden inputs for:
- `db/id`
- `sales-summary-item/category` (for non-manual items)
- `sales-summary-item/manual?` (for manual items)
- `ledger-mapped/account` — this is the key one that gets updated by the inline edit flow

When the typeahead swaps in (edit mode), the old hidden input for `ledger-mapped/account` is replaced by the typeahead's own hidden input. On confirm, the server returns the updated hidden input. On cancel, the server returns the original hidden input.

### Total / Unbalanced Rows

Same as current: `summary-total-row*` and `unbalanced-row*` with live recalculation via `hx-put` to `::route/expense-account-total`.

## Handler Implementation

### `edit-item-account` handler

1. Parse query params: item index, client-id, current field name prefix
2. Render the typeahead + confirm/cancel buttons
3. The typeahead uses the same `account-typeahead*` pattern
4. Confirm button: `hx-put` to `::route/save-item-account`, `hx-target "closest td"`, `hx-swap "innerHTML"`
5. Cancel button: `hx-get` to `::route/cancel-item-account`, `hx-target "closest td"`, `hx-swap "innerHTML"`

### `save-item-account` handler

1. Parse form body: selected account ID, item index, client-id, field name prefix
2. Resolve account name from DB using `d-accounts/clientize`
3. Return display mode HTML: account name text + hidden input (with new account ID) + pencil icon

### `cancel-item-account` handler

1. Parse query params: item index, client-id, current field name prefix, original account ID
2. Resolve account name from DB (if account ID exists)
3. Return display mode HTML: account name text (or "Missing acct" pill) + hidden input (with original account ID) + pencil icon

## Route Definitions

Add to `routes.cljc`:

```clojure
"/edit/item-account" ::edit-item-account
"/edit/save-item-account" ::save-item-account
"/edit/cancel-item-account" ::cancel-item-account
```

## Files Changed

| File | Change |
|---|---|
| `src/cljc/auto_ap/routes/pos/sales_summaries.cljc` | Add 3 new route keys |
| `src/clj/auto_ap/ssr/pos/sales_summaries.clj` | Rewrite MainStep render-step, add 3 handlers, add helper fns for account display/edit cells |

## Out of Scope

- Changes to the embedded grid table (already redesigned)
- Changes to how the wizard submit handler works
- Adding the missing `::route/expense-account-total` route (pre-existing bug, separate fix)