Skip to content

feat: Link to Node on Canvas#1913

Merged
camielvs merged 1 commit intomasterfrom
03-06-feat_link_to_node_on_canvas
Mar 11, 2026
Merged

feat: Link to Node on Canvas#1913
camielvs merged 1 commit intomasterfrom
03-06-feat_link_to_node_on_canvas

Conversation

@camielvs
Copy link
Collaborator

@camielvs camielvs commented Mar 6, 2026

Description

Adds a button to Task, IO & Flex Nodes in Run View to copy a shareable link to clipboard. This link, when loaded, will load the pipeline and zoom the view into the chosen node. The node will be automatically selected & highlighted. The highlight will clear when the user clicks anywhere. The url will also clean itself up. I have done this because it felt annoying to have the task permanently highlighted, and it made the url logic complex if I then wanted to highlight a different node.

Related Issue and Pull requests

Closes https://github.com/Shopify/oasis-frontend/issues/498

Type of Change

  • New feature

Checklist

  • I have tested this does not break current pipelines / runs functionality
  • I have tested the changes on staging

Screenshots (if applicable)

zoom-to-node.mov (uploaded via Graphite)

Test Instructions

  1. Navigate to a run
  2. Select a Task
  3. Confirm the "Shareable Link" button is available
  4. Click the button and paste the link into a new tab
  5. Confirm the run loads and the view is zoomed into the node, which is selected and highlighted
  6. Click anywhere to remove the highlight and clean up the url
  7. Repeat & confirm for Inputs, Outputs and Flex Nodes
  8. Confirm the share button does not appear in the editor

Additional Comments

@github-actions
Copy link

github-actions bot commented Mar 6, 2026

🎩 To tophat this PR:

You can add the following URL parameter to your browser to tophat this PR:

`?tophat_location=03-06-feat_link_to_node_on_canvas/0c61088`

Copy link
Collaborator Author

camielvs commented Mar 6, 2026

This stack of pull requests is managed by Graphite. Learn more about stacking.

@camielvs camielvs force-pushed the 03-06-feat_link_to_node_on_canvas branch 3 times, most recently from 1289edc to 6c1e47d Compare March 9, 2026 18:27
@camielvs camielvs force-pushed the 03-06-feat_link_to_node_on_canvas branch from 6c1e47d to 571a7c4 Compare March 9, 2026 19:15
Comment on lines 891 to +901
useEffect(() => {
reactFlowInstance?.fitView({
maxZoom: 1,
duration: 300,
});
}, [currentSubgraphPath, reactFlowInstance]);
if (!reactFlowInstance) return;

if (!initialFitDone.current) {
initialFitDone.current = true;

if (!fitViewOnInit) return;
}

reactFlowInstance.fitView({ maxZoom: 1, duration: 300 });
}, [currentSubgraphPath, reactFlowInstance, fitViewOnInit]);
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If we don't skip the canvas-level view-fitting operation it overrides the node-level operation

@camielvs camielvs marked this pull request as ready for review March 9, 2026 19:21
@camielvs camielvs requested a review from a team as a code owner March 9, 2026 19:21
Copy link
Collaborator Author

camielvs commented Mar 11, 2026

Merge activity

  • Mar 11, 7:13 PM UTC: A user started a stack merge that includes this pull request via Graphite.
  • Mar 11, 7:13 PM UTC: Graphite rebased this pull request as part of a merge.
  • Mar 11, 7:16 PM UTC: @camielvs merged this pull request with Graphite.

@camielvs camielvs force-pushed the 03-06-feat_link_to_node_on_canvas branch from 571a7c4 to 0c61088 Compare March 11, 2026 19:13
@camielvs camielvs merged commit 75dd6b7 into master Mar 11, 2026
17 checks passed
@camielvs camielvs deleted the 03-06-feat_link_to_node_on_canvas branch March 11, 2026 19:16
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.

2 participants