Skip to content

fix(tangent): float read-only pipeline controls instead of a second nav bar - #2998

Open
camielvs wants to merge 4 commits into
masterfrom
cvs/embedded-view-only-menu-bar
Open

camielvs wants to merge 4 commits into
masterfrom
cvs/embedded-view-only-menu-bar

Conversation

@camielvs

@camielvs camielvs commented Nov 4, 2026 •

Copy link
Copy Markdown
Collaborator

Intent

People working in Tangent shouldn't see two nav bars when they open a pipeline they can't edit.

image

Current behavior

If you open a pipeline you can't edit in a Tangent tab, it brings along the menu bar from its standalone page. A second dark bar then sits under the app's own nav. It repeats the home logo, the pipeline name (already shown on the tab) and the app-wide buttons such as Onboarding, notices, settings and help. Pipelines you can edit open in Tangent with no bar at all, and so do runs.

What changes

In Tangent, a pipeline you can't edit now loses its menu bar and starts directly under the tab, the same as an editable pipeline. Only the controls that belong to this view float in a small dark box in the top-right corner of the canvas:

  • the Read only badge
  • the View and Windows menus (Windows is still the way to show the minimap)

The box stays inside the canvas: inside a subgraph it sits below the breadcrumb strip, and floating windows open on top of it. The standalone pipeline page keeps its full menu bar.

The badge now says Read only instead of View only, in Tangent and on the standalone page.

How to test

You need a pipeline someone else owns, so that it opens as read only.

  1. Open a Tangent project and open that pipeline in a tab. There's no second nav bar under the tabs. A dark box in the canvas's top-right corner shows Read only, View and Windows, and nothing else.
  2. Open Windows and turn on Minimap. The minimap appears.
  3. Open View. Its menu opens as it did in the old bar.
  4. Double-click a task that contains a subgraph. The box moves below the breadcrumb strip and doesn't cover it.
  5. Open the same pipeline outside Tangent, on its own page. The full menu bar, with the home logo and app buttons, is still there, and its badge says Read only.

Unit and integration tests for the read-only pipeline view and the pipeline editor route pass (59), and lint and formatting are clean. The UI steps above weren't run against a live app. The local type check fails only in files this PR doesn't touch, because an installed dependency is out of date.

Related Issue and Pull requests

Follows #2965, which gave this view a compact layout in Tangent but kept its menu bar.

Type of Change

  • Bug fix

Line Breakdown

Category Added Removed
Production code 84 22
Tests 31 6
Total 115 28

Checklist

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

Additional Comments

The box is dark so it can reuse the old bar's menu buttons as they are, since they're styled for a dark background. A light box would need a new light version of those buttons.

🤖 Generated with Claude Code

@camielvs
camielvs requested a review from a team as a code owner November 4, 2026 18:46
@github-actions

github-actions Bot commented Nov 4, 2026 •

Copy link
Copy Markdown

🎩 Preview

A preview build has been created at: cvs/embedded-view-only-menu-bar/3036f53

@camielvs camielvs changed the title fix(tangent): float view-only pipeline controls instead of a second nav bar fix(tangent): float read-only pipeline controls instead of a second nav bar Nov 4, 2026
@camielvs
camielvs force-pushed the cvs/embedded-view-only-menu-bar branch 3 times, most recently from af201e9 to f6021e9 Compare November 5, 2026 16:38

@camielvs camielvs left a comment

Copy link
Copy Markdown
Collaborator Author

Choose a reason for hiding this comment

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

🤖 This is an AI-generated code review comment.

2 low-severity findings, inline below. Otherwise this looks clean: extracting ReadOnlyBadge keeps the label in one place, the xyflow Panel sits below the in-flow breadcrumb strip and under floating windows, and the exact button count in the new test stops the AI model picker from coming back.

@camielvs
camielvs force-pushed the cvs/embedded-view-only-menu-bar branch from 75635ef to 330a458 Compare November 6, 2026 16:07
camielvs and others added 4 commits November 6, 2026 09:22
…av bar

A pipeline you can't edit, opened in a Tangent tab, rendered the standalone
page's whole menu bar inside the tab: the home logo, the pipeline name and
every app-wide button, stacked under the app's own nav.

When embedded, drop the bar and float what the app's nav lacks (the View only
badge, the View and Windows menus, and the AI model picker) in the canvas's
top-right corner. The standalone page keeps its bar.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
Tangent's chat has its own model picker, so a second one floating on the
canvas would be confusing. The floating controls keep only the View only
badge and the View and Windows menus.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Rename the badge from "View only" on both the floating controls and the
standalone pipeline page, sharing one ReadOnlyBadge so the two can't drift.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
The embedded read-only view copied the shell's root element, and the
floating controls box repeated the menu bar's background. Extract
RemotePipelineFrame for the former and export CANVAS_MENU_SURFACE_CLASS
for the latter, so both surfaces stay in step.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@camielvs
camielvs force-pushed the cvs/embedded-view-only-menu-bar branch from 330a458 to 3036f53 Compare November 6, 2026 16:22

This branch has not been deployed

No deployments
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