MotirBuilding in public
MOTIR · moooon
onMotir
You’re viewing a public project. Anyone can view it — no account needed. Sign in to submit, upvote, or comment on requests.View-only — you can’t edit work items
MOTIR-106

2.4.8 Design — link-management interaction (add / remove relationship links)

Done
Description

Estimate: 18m · Depends on: 2.4.7

The add/remove-link interaction that 2.4.5's read-only relationships panel deferred. The backend already existsworkItemsService.linkWorkItems / unlinkWorkItems (1.4.4) with the typed trigger errors (self-link / duplicate / cycle / cross-workspace). What's missing is the UI, and it's UI ⇒ it needs a design before any code (the design-gate). This is the design asset; 2.4.9 builds against it.

Mirror product (rung 1): Jira's "Link issue" affordance lives on the issue detail view, so this is PM-core (Epic 2 / Story 2.4), NOT Epic 5. Design, extending the approved design/work-items/relationships.mock.html: (a) the panel's add entry point (a "+ Link issue" control in the Relationships header, replacing the read-only "Manage in Epic 5" note); (b) the add-link form — a kind selector (blocked by / blocks / relates to / duplicates / clones) + an issue-search Combobox (reusing the 2.3.4 Combobox) over an in-workspace candidate read, with the empty / typing / selected states; (c) the inline remove affordance on each row (+ a confirm); (d) the inline error states the triggers surface (self-link, duplicate, cycle, cross-workspace); (e) the create-modal "Linked issues" section (designed in create.pen, never built) — the same controls, but links are COLLECTED as pending rows and written on create (built by 2.4.10). Output: design/work-items/links.mock.html + an update to design/work-items/design-notes.md, mirroring the 2.4.7 output convention (self-contained HTML built from the real --el-* tokens + shipped primitives).

Acceptance criteria

  • design/work-items/links.mock.html exists, self-contained, real --el-* tokens (light + dark), and renders: the add entry point on the relationships panel; the add-link form (kind selector + issue-search Combobox: empty / typing / selected); the per-row remove affordance + confirm; and the inline error states (self-link / duplicate / cycle / cross-workspace).
  • Composes shipped primitives only (2.3.4 Combobox, Pill, Modal/Popover, Button, SectionLabel, IssueTypeIcon) — no hand-rolled controls; states conveyed by text + AA-safe tints (finding #35).
  • design-notes.md names the primitives, copy, placement, states, and the read-only→editable transition of the panel.
  • Opened as a PR and APPROVED by the user before 2.4.9 starts (review-gated design subtask).

Context refs

  • design/work-items/relationships.mock.html + design-notes.md (2.4.7 base to extend) + detail.pen
  • components/ui/Combobox (2.3.4, WAI-ARIA listbox-combobox) + Modal/Popover/Button/Pill
  • lib/dto/workItemLinks.ts — the five link kinds + direction convention
  • lib/workItems/linkErrors.ts — the error states the form must surface (self-link / duplicate / cycle / cross-workspace)
  • The mirror product — Jira's "Link issue" dialog (kind dropdown + issue picker)
Status
Done
Type
Sub-task