Skip to content

Doc trees phase 2: create/rename/delete empty user trees #11

Description

@ddisisto

Add the UX and CRUD for user-created tree containers. Depends on #9 (the trees store and tree-aware doc-list.ts must exist first). No doc import yet — user trees in this phase are empty labeled folders. The focus is proving out the interaction model (inline-input rows, two-click-confirm) before content primitives land in #11.

Interaction model

From the #8 planning discussion (D5): inline-input rows, matching the lightweight pattern already used by the stats-reset cell at doc-list.ts:273-291. No modals, no popovers.

Creating a tree

  • A new <+> new tree row renders at the root level of the doc-list panel, below the existing about tree.
  • Click → the row becomes an inline <input> with a placeholder ("tree name").
  • Enter commits: generates id: 'u:<uuid>', calls putTree({ id, label, kind: 'user', created }), refreshes the panel.
  • Escape, blur, or outside-click cancels and restores the <+> new tree row.
  • Empty-string commits are treated as cancel.
  • After commit, the new tree renders as a labeled folder with no children (no <+> add row yet — that lands in Doc trees phase 2: create/rename/delete empty user trees #11).

Renaming a tree

  • Two-click-confirm on the user tree's label row (matching the reset-cell pattern):
    • First click arms a "rename?" affordance on the row with a 3s timeout.
    • Second click (within the timeout) swaps the label for an inline input pre-filled with the current name.
    • Enter commits, Escape/blur cancels.
  • System trees (kind: 'system') do not expose rename — no click handler, no armed state. about stays about.

Deleting a tree

  • Separate two-click-confirm on a small control in the tree row (e.g. a × that appears on hover, or a dedicated cell — match whatever feels consistent with the existing stats-reset affordance).
  • Confirmed delete cascades: deleteTree(id) plus deleteDocumentData() for each doc in the tree. (Trees in this phase are empty, so the cascade is a no-op, but the code path needs to be in place for Doc trees phase 2: create/rename/delete empty user trees #11.)
  • about does not expose delete.

Data model

Already set up in #9 — this issue just uses:

  • putTree, listTrees, deleteTree from store.ts
  • StoredDocument.treeId for the cascade scope

No new schema.

Acceptance

  • <+> new tree row renders at the root of the doc-list panel.
  • Clicking it produces an inline input; Enter commits, Escape/blur/outside-click cancels.
  • Committed trees persist across reloads.
  • User trees render as labeled folders, distinct from about visually only insofar as they have no children yet.
  • Two-click rename works on user trees; inline input replaces the label; Enter commits.
  • Two-click delete works on user trees; cascades via deleteTree + deleteDocumentData.
  • about exposes neither rename nor delete — no affordances, no armed states.
  • Multiple user trees can coexist and are ordered deterministically (creation order is fine; document in the issue whatever you pick).

Touchpoints

  • frontend/src/doc-list.ts — new inline-input row component, <+> new tree row, rename/delete affordances on user-tree rows
  • frontend/src/styles.css — styling for the new rows and the armed states
  • frontend/src/store.ts — no changes expected (CRUD landed in Docs overhaul #9)

Out of scope

Parent: #8

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions