Skip to content

feat: conditional hotspot drag-to-connect and per-branch actions#27

Merged
trmquang93 merged 1 commit intomainfrom
feat/conditional-hotspot-drag
Apr 7, 2026
Merged

feat: conditional hotspot drag-to-connect and per-branch actions#27
trmquang93 merged 1 commit intomainfrom
feat/conditional-hotspot-drag

Conversation

@trmquang93
Copy link
Copy Markdown
Collaborator

Summary

  • Drag-to-connect conditional branching from hotspots: Dragging from a hotspot with an existing connection to a new screen auto-converts to a conditional group. Additional drags add more branches. Duplicate targets are ignored.
  • Per-branch action types: Each condition branch in the HotspotModal now has its own action dropdown (Navigate, Back, Modal, API Call, Custom) with full follow-up configuration including API endpoint/method/schema and success/error paths.
  • Backward compatibility: importFlow.js backfills new condition branch fields for older .drawd files.

Files changed (9)

  • src/hooks/useScreenManager.jshotspotId params on convertToConditionalGroup/addToConditionalGroup + per-branch connection creation in saveHotspot()
  • src/hooks/useInteractionCallbacks.js — Drag-to-conditional detection logic in onConnectComplete()
  • src/Drawd.jsx — Wire convertToConditionalGroup to callbacks
  • src/components/HotspotModal.jsx — Per-branch action UI with action dropdown, target/dataflow, API fields, success/error follow-ups
  • src/utils/instructionRenderers.js — Per-branch action rendering in generated instructions
  • src/utils/importFlow.js — Backfill new condition branch fields
  • mcp-server/src/tools/hotspot-tools.js — Updated conditions schema with per-branch action fields
  • mcp-server/src/state.js — Per-branch connection creation for MCP
  • src/pages/docs/userGuide.md — Documentation for new features

Test plan

  • Drag from hotspot to Screen A (single navigate connection)
  • Drag from same hotspot to Screen B (auto-converts to conditional, inline labels appear)
  • Drag from same hotspot to Screen C (third branch added)
  • Drag to Screen A again (ignored as duplicate)
  • Undo reverts to single connection
  • HotspotModal: set action=conditional, verify each branch has action dropdown with all 5 types
  • Test API branch with endpoint, method, success/error follow-ups
  • Save and verify correct connections created per branch action
  • Load old .drawd file with conditions — verify backfill works
  • Screen-to-screen conditional still works (regression)

Enable conditional branching via drag from a hotspot to multiple screens,
and allow each condition branch to have its own action type (navigate,
back, modal, api, custom) with full follow-up configuration.
@trmquang93 trmquang93 merged commit 133e223 into main Apr 7, 2026
1 check passed
@github-actions github-actions bot deleted the feat/conditional-hotspot-drag branch April 7, 2026 07:45
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