feat: branch deployment previews via @branch path segments#9011
Draft
ericpgreen2 wants to merge 12 commits intomainfrom
Draft
feat: branch deployment previews via @branch path segments#9011ericpgreen2 wants to merge 12 commits intomainfrom
@branch path segments#9011ericpgreen2 wants to merge 12 commits intomainfrom
Conversation
Add a branch selector chip to the project header that lets admins switch between branch deployments directly in the cloud UI. Gated on `readDev` permission. - New `BranchSelector` component (chip + dropdown, modeled after `ViewAsUserChip`) - Read `?branch=X` query param in project layout, pass to `GetProject` API - Warning banner when viewing a non-production branch deployment - Branch param preserved across tab navigation via `branchSearchSuffix` - "Start deployment" button for stopped branch deployments - Deduplicates `ListDeployments` by branch; live status from `GetProject` - "View As" composes with branch context
Move `BranchSelector` from a standalone header chip into the avatar button dropdown as a submenu (like "View as"), reducing visual clutter when viewing branch deployments. Replace `ProjectAccessControls` wrapper in `AvatarButton` with a `projectPermissions` prop passed from `ProjectHeader`, eliminating a redundant `GetProject` query. Clean up branch-related props from `SlimProjectHeader` and `ProjectHeader`.
…ments Replace `?branch=X` query params with `@branch` path segments for branch deployment previews (e.g., `/org/project/@feature-x/explore/dashboard`). - Add `reroute` hook to strip `@branch` before route matching - Add `beforeNavigate` hook to inject `@branch` into branch-unaware links - Add `branch-utils.ts` with path manipulation helpers - Use `~` encoding for `/` in branch names (git disallows `~` in refs) - Branch menu items render as `<a>` tags for href preview on hover - Back/forward browser history works correctly (skip injection on popstate)
- Rewrite BranchSelector from avatar dropdown submenu to standalone dropdown styled as a compact pill (matching the Chip component's dimension style) positioned after the project breadcrumb - Add `after-project` slot to Breadcrumbs component for the pill - Remove the yellow branch preview banner (redundant with the pill) - Show branch selector on all project pages, not just Home - Branch-centric labels: trigger shows truncated branch name, dropdown shows branch names with "production" suffix for primary - Gate on `readDev` permission
@branch path segments@branch path segments
- Add TTL-based auto-expiry (500ms) to skip-branch-injection flag to prevent stale flags from leaking across navigations - Extract stopped deployment UI into `BranchDeploymentStopped` component using the project's Button and CTA layout patterns - Show spinner for STOPPING state instead of the "Start deployment" button - Move `startDeploymentMutation` into the extracted component so it is not instantiated on every project page load - Replace hardcoded "main" fallback with `primaryBranch` from the project query - Add clarifying comments for ISO 8601 string comparison and breadcrumb depth assumption
Move branch-related files into a dedicated feature directory and centralize logic that was scattered across the codebase: - Move BranchSelector, BranchDeploymentStopped, branch-utils to features/branches/ - Extract `getBranchRedirect` from the project layout's beforeNavigate hook - Reuse `removeBranchFromPath` in hooks.ts reroute (removes duplicate regex)
Move the beforeNavigate branch injection logic into a single testable function in branch-utils.ts. The layout's callback becomes a one-liner that delegates to the feature module.
- Replace BranchSelector's `getStatusColor` with shared `getStatusDotClass` - Remove duplicate `GetProject` query from BranchSelector; accept `primaryBranch` as a prop threaded from the layout - Change `getBranchRedirect` to accept a `URL` object instead of three string parameters - Reorder `handleBranchNavigation` guards so `activeBranch` is checked before consuming the skip flag - Simplify `consumeSkipBranchInjection` to always-clear-on-read - Replace redundant integration tests with a search+hash test and add prefix-collision edge case for `getBranchRedirect`
`SlimProjectHeader` is rendered when the deployment isn't running. Without the `BranchSelector`, users on a stopped branch deployment had no way to switch back to production or another branch.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Adds the ability for project admins to preview branch deployments in Rill Cloud. Branches are addressed via
@branchpath segments in the URL (e.g.,/acme/analytics/@eric~revenue-metrics/explore/dashboard).Closes APP-776
User-facing changes:
manageDevpermissionImplementation:
reroutehook strips@branchbefore route matching, so all existing routes work transparently/are encoded as~(which git disallows), making them safe for URL pathsbranch-utils.tscovering encoding, extraction, injection, navigation interception, and round-trip correctnessChecklist:
Developed in collaboration with Claude Code