Editor's Path Properties has 'Path Properties' but no 'Path reference' (URL, photo) — user wanting to attach a reference (e.g., a photo of the original sketch) to a path for documentation has no such affordance #372

New issue

Closed

opened 2026-10-04 03:58:58 +00:00 by Mark · 1 comment

Mark commented

2026-10-04 03:58:58 +00:00

Owner

Finding

grep -rn 'pathReference\|pathAttachment' src/components/editor/ returns 0. The editor has no path reference.

A user with a path:

Drawn from a hand-sketch
Wants to attach the photo of the sketch to the path
For future reference
"Why did I draw this path this way?"

The fix is a path attachment (photo, URL, note).

Where

Path Properties: src/components/editor/EditorRightPanel.tsx
No path reference: grep -rn 'pathReference' src/components/editor/ returns 0

Suggested fix shape

Type: add attachments: Array<{ id: string; type: 'image' | 'url' | 'note'; value: string; createdAt: number }> to the StitchPath type.
UI: a small "..." button in the path list row that has an "Add reference" item:

<DropdownMenuItem onClick={onAddReference}>
  <Paperclip size={12} /> Add reference
</DropdownMenuItem>

Modal: a small modal to add the reference:

Type: Image / URL / Note
Value: file picker (for image), text input (for URL), textarea (for note)
Save

Display: the path row has a paperclip icon if it has attachments. Hover shows the count.
Use cases:

Documentation
Collaboration (multiple users can see why a path is the way it is)
Future reference (when the user revisits the design)

Severity**

Low. The user can use the design's overall description. Power users with complex designs notice.

Discovered by

Gap analysis (2026-10-02) of editor path properties.

The reference image (per #245) is the whole-design-level reference. The path-level is the deeper.
Most modern editors have component descriptions. The editor's gap is the parallel.

## Finding `grep -rn 'pathReference\|pathAttachment' src/components/editor/` returns 0. The editor has no path reference. A user with a path: - Drawn from a hand-sketch - Wants to attach the photo of the sketch to the path - For future reference - "Why did I draw this path this way?" The fix is a path attachment (photo, URL, note). ## Where - Path Properties: `src/components/editor/EditorRightPanel.tsx` - No path reference: `grep -rn 'pathReference' src/components/editor/` returns 0 ## Suggested fix shape 1. **Type**: add `attachments: Array<{ id: string; type: 'image' | 'url' | 'note'; value: string; createdAt: number }>` to the StitchPath type. 2. **UI**: a small "..." button in the path list row that has an "Add reference" item: ```tsx <DropdownMenuItem onClick={onAddReference}> <Paperclip size={12} /> Add reference </DropdownMenuItem> ``` 3. **Modal**: a small modal to add the reference: - Type: Image / URL / Note - Value: file picker (for image), text input (for URL), textarea (for note) - Save 4. **Display**: the path row has a paperclip icon if it has attachments. Hover shows the count. 5. **Use cases**: - Documentation - Collaboration (multiple users can see why a path is the way it is) - Future reference (when the user revisits the design) ## Severity** Low. The user can use the design's overall description. Power users with complex designs notice. ## Discovered by Gap analysis (2026-10-02) of editor path properties. ## Related - The reference image (per #245) is the whole-design-level reference. The path-level is the deeper. - Most modern editors have component descriptions. The editor's gap is the parallel.

Mark added the

feature-request

triage-approved

labels

2026-10-04 03:58:58 +00:00

Mark referenced this issue

2026-10-04 03:59:53 +00:00

Editor's Path Properties has 'Path Properties' but no 'Notes' field per path — user wanting to leave a comment (e.g., 'this is the outline of the leaf') on a path has no place to write it #378

Mark referenced this issue from a commit

2026-10-05 15:53:44 +00:00

feat(#372): per-path references (image / URL / note) in editor's Path Properties

Mark closed this issue

2026-10-05 15:55:48 +00:00

Mark commented

2026-10-05 15:55:58 +00:00

Author

Owner

Closed via commit 9a63776 (feat(#372): per-path references (image / URL / note) in editor's Path Properties).

Adds per-path attachments (image / URL / note) to the editor's Path Properties:

StitchPath.attachments?: PathAttachment[] (optional, back-compat with persisted designs predating #372). Editor-only metadata — pathsToStitchObjects strips it on export.
PathAttachmentModal — Type select (image/url/note) + per-type value control + optional Label. URL validation rejects non-http(s) schemes. Re-seeds draft on open.
EditorRightPanel "References" subsection: count + "+ Add reference" button + per-attachment list with type icon, label/summary, and Remove button. URL / image attachments render as <a target=_blank rel=noopener>. Single-select only (multi-select hides it — bulk fan-out would mix content).
Per-row paperclip indicator (compact + comfortable views) — read-only badge when attachments exist.
Editor.tsx handleAddPathAttachment / handleRemovePathAttachment — one setPaths + one pushHistory per action, no-op guards for missing path / attachment / duplicate id.

29 new tests pass (16 modal + 13 panel integration).

Closed via commit 9a63776 (`feat(#372): per-path references (image / URL / note) in editor's Path Properties`). Adds per-path attachments (image / URL / note) to the editor's Path Properties: - `StitchPath.attachments?: PathAttachment[]` (optional, back-compat with persisted designs predating #372). Editor-only metadata — `pathsToStitchObjects` strips it on export. - `PathAttachmentModal` — Type select (image/url/note) + per-type value control + optional Label. URL validation rejects non-http(s) schemes. Re-seeds draft on open. - `EditorRightPanel` "References" subsection: count + "+ Add reference" button + per-attachment list with type icon, label/summary, and Remove button. URL / image attachments render as `<a target=_blank rel=noopener>`. Single-select only (multi-select hides it — bulk fan-out would mix content). - Per-row paperclip indicator (compact + comfortable views) — read-only badge when attachments exist. - `Editor.tsx` `handleAddPathAttachment` / `handleRemovePathAttachment` — one setPaths + one pushHistory per action, no-op guards for missing path / attachment / duplicate id. 29 new tests pass (16 modal + 13 panel integration).