fix(apollo-react): stage title input fills available header width [MST-7791]#384
Open
KodudulaAshishUiPath wants to merge 1 commit intomainfrom
Open
fix(apollo-react): stage title input fills available header width [MST-7791]#384KodudulaAshishUiPath wants to merge 1 commit intomainfrom
KodudulaAshishUiPath wants to merge 1 commit intomainfrom
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Dependency License Review
License distribution
Excluded packages
|
There was a problem hiding this comment.
Pull request overview
Fixes the stage header title editing UX in apollo-react by allowing the stage title input to expand and use the available header width.
Changes:
- Make the left header layout flexible (
flex=1,minW=0) so the title region can grow/shrink correctly. - Update stage title container/input styles to be full-width and remove the prior max-width constraint.
Reviewed changes
Copilot reviewed 2 out of 2 changed files in this pull request and generated 2 comments.
| File | Description |
|---|---|
| packages/apollo-react/src/canvas/components/StageNode/StageNode.tsx | Adjusts header layout flex behavior so the title area can take remaining space. |
| packages/apollo-react/src/canvas/components/StageNode/StageNode.styles.ts | Makes the title container/input full-width to fill available header width. |
packages/apollo-react/src/canvas/components/StageNode/StageNode.styles.ts
Show resolved
Hide resolved
packages/apollo-react/src/canvas/components/StageNode/StageNode.styles.ts
Outdated
Show resolved
Hide resolved
Contributor
|
Did you test the inline edit behaviour? |
KodudulaAshishUiPath
force-pushed
the
fix/MST-7791
branch
from
f11df8a to
efcd4ed
Compare
Contributor
Author
Yes, I have added a story as well to test inline edit behaviour |
KodudulaAshishUiPath
force-pushed
the
fix/MST-7791
branch
from
efcd4ed to
06005de
Compare
Comment on lines
80
to
86
| export const StageTitleContainer = styled.div<{ isEditing?: boolean }>` | ||
| display: inline-block; | ||
| display: block; | ||
| border-radius: 4px; | ||
| height: 100%; | ||
| width: 100%; | ||
| box-sizing: border-box; | ||
| border: ${(props) => (props.isEditing ? '1px solid var(--uix-canvas-border-de-emp)' : 'none')}; |
There was a problem hiding this comment.
StageTitleContainer is a div that’s rendered inside ApTypography when using fontSizeM/fontSizeMBold (which maps to component="span"). Switching the container to display: block can cause layout glitches and keeps an invalid HTML structure (<div> inside <span>). Consider changing StageTitleContainer to a styled.span (or overriding ApTypography here to render a block element via component="div") so the title can expand without invalid nesting.
KodudulaAshishUiPath
force-pushed
the
fix/MST-7791
branch
from
06005de to
855c36b
Compare
KodudulaAshishUiPath
force-pushed
the
fix/MST-7791
branch
from
855c36b to
6b343ba
Compare
KodudulaAshishUiPath
force-pushed
the
fix/MST-7791
branch
from
6b343ba to
5816a5c
Compare
SreedharAvvari
approved these changes
Mar 24, 2026
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.
Description
Demo
Before
Screen.Recording.2026-03-23.at.15.16.55.mov
After
Screen.Recording.2026-03-23.at.15.25.01.mov