Skip to content

feat(logic): click-to-edit logic cards (2/2)#9786

Open
bookwormsuf wants to merge 7 commits into
feat/clickable-cards-workflowlogicfrom
feat/clickable-cards-logic
Open

feat(logic): click-to-edit logic cards (2/2)#9786
bookwormsuf wants to merge 7 commits into
feat/clickable-cards-workflowlogicfrom
feat/clickable-cards-logic

Conversation

@bookwormsuf

@bookwormsuf bookwormsuf commented Jul 23, 2026

Copy link
Copy Markdown
Contributor

Problem

Logic cards lock every other card while one is open — you have to Save or Cancel before you can touch another card. Part 1 (#9781) fixed this for workflow step cards; this PR mirrors the same behaviour onto logic cards.

Stacked on #9781 — please review/merge that first. Base retargets to develop once Part 1 lands.

Closes FRM-2491.

Solution

Behind the existing editable-cards-mrf-logic flag (default off), the whole logic card becomes clickable with a hover affordance, and clicking another card auto-saves the open one and switches to it. The auto-save runs through the same validated submit path as the Save button, so incomplete data blocks the switch and surfaces validation errors instead of silently losing work.

Implementation mirrors Part 1's workflow store and components: a pendingSwitchTo field plus requestSwitchTo / cancelPendingSwitch / completeSave on the logic store, an auto-save useEffect that fires when another card is clicked, and onSuccess: completeSave / onError: cancelPendingSwitch on the save mutations. Flag off = previous behaviour (cards locked while one is open, pencil-only edit).

One logic-specific difference from Part 1: logic's EditLogicBlock is shared by both the create (NewLogicBlock) and edit (ActiveLogicBlock) paths, so the auto-save effect covers both. A new block therefore auto-saves-and-switches through the same validated Add logic path — an incomplete new block blocks the switch with validation errors, exactly like pressing Add logic.

Alternatives considered

  • Card body element. We kept the clickable card body as a plain Box with an onClick, and left the pencil icon button as the keyboard/screen-reader trigger, rather than turning the whole body into a focusable <button>. Making the entire card a button is more keyboard-complete, but the pencil already covers keyboard access and the Box keeps the markup simpler; we can revisit if we want full card-body keyboard focus later.
  • Redundant-save short-circuit. For an already-saved card that you open but don't change, we skip the save and just switch, to avoid a pointless network write. This short-circuit deliberately does not apply to brand-new blocks — those always run validation so an empty new block can't silently vanish on switch.

Screenshots

State Before After
Logic card, flag on (collapsed) Screenshot 2026-07-23 at 1 37 30 PM Screenshot 2026-07-23 at 1 35 57 PM
Logic card, flag on (hover affordance) Screenshot 2026-07-23 at 1 37 34 PM Screenshot 2026-07-23 at 1 37 14 PM

Breaking Changes

No - backwards compatible. Feature is gated behind editable-cards-mrf-logic (default off); flag-off behaviour is unchanged.

Tests

TC1: Flag off — no regression

  • With the flag off, open a logic card; other cards stay locked until you Save/Cancel.
  • Only the pencil icon opens a card for editing.

TC2: Flag on — whole card clickable + hover

  • Hovering a card highlights the whole card (border/background) and tints the pencil.
  • Clicking anywhere on a card opens it for editing.

TC3: Flag on — auto-save-and-switch between existing cards

  • Open card A, change something, click card B → A saves and B opens.
  • If A has invalid/incomplete data, the switch is blocked and validation errors show on A.

TC4: Flag on — untouched card switches without a redundant save

  • Open card A, change nothing, click card B → B opens and no save request fires for A.

TC5: Flag on — new block blocks the switch when incomplete

  • Click Add logic, leave it incomplete, click an existing card → switch is blocked and validation errors show on the new block (same as pressing Add logic).

TC6: Flag on — valid new block creates then switches

  • Click Add logic, fill it in validly, click an existing card → the new block is created and the clicked card opens.

bookwormsuf and others added 6 commits July 23, 2026 02:34
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
A new block has nothing persisted, so the untouched short-circuit must not
apply to it. Route creates through handleSubmit so an incomplete new block
blocks the switch with validation errors, matching the Add logic button.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
The icon opens the edit view but was labelled Delete logic. Making the whole
card clickable promotes the pencil to the primary edit affordance, so the
mislabel now matters for screen-reader users.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
@bookwormsuf
bookwormsuf requested a review from a team as a code owner July 23, 2026 05:26
@linear-code

linear-code Bot commented Jul 23, 2026

Copy link
Copy Markdown

FRM-2491

@mergify

mergify Bot commented Jul 23, 2026

Copy link
Copy Markdown

Tick the box to add this pull request to the merge queue (same as @mergifyio queue).

  • Queue this pull request

…ic' into feat/clickable-cards-logic

# Conflicts:
#	apps/frontend/src/features/admin-form/create/logic/components/LogicContent/InactiveLogicBlock/InactiveLogicBlock.tsx
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant