Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

feat(PageHeader): Convert PageHeader to CSS modules behind feature flag #5332

Merged
merged 13 commits into from
Dec 2, 2024
Merged

feat(PageHeader): Convert PageHeader to CSS modules behind feature flag #5332

merged 13 commits into from
Dec 2, 2024

Conversation

hussam-i-am
Copy link
Contributor

Closes https://github.com/github/primer/issues/4300

Changelog

New

Changed

  • Adds CSS modules behind feature flag
  • Adds data attributes for when to hide on breakpoints

Removed

Rollout strategy

  • Patch release
  • Minor release
  • Major release; if selected, include a written rollout or migration plan
  • None; if selected, include a brief description as to why

Testing & Reviewing

Merge checklist

@hussam-i-am hussam-i-am self-assigned this Nov 25, 2024
@changeset-bot changeset-bot
Copy link

changeset-bot bot commented Nov 25, 2024 •
edited
Loading

🦋 Changeset detected

Latest commit: d7b290e

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
@primer/react Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@github-actions github-actions bot added the integration-tests: recommended This change needs to be tested for breaking changes. See https://arc.net/l/quote/tdmpakpm label Nov 25, 2024
@github-actions GitHub Actions
Copy link
Contributor

👋 Hi, this pull request contains changes to the source code that github/github depends on. If you are GitHub staff, we recommend testing these changes with github/github using the integration workflow. Thanks!

@github-actions github-actions bot temporarily deployed to storybook-preview-5332 November 25, 2024 20:02 Inactive
@github-actions GitHub Actions
Copy link
Contributor

github-actions bot commented Nov 25, 2024 •
edited
Loading

size-limit report 📦

Path Size
packages/react/dist/browser.esm.js 103.42 KB (+0.38% 🔺)
packages/react/dist/browser.umd.js 103.8 KB (+0.32% 🔺)

@hussam-i-am hussam-i-am marked this pull request as ready for review November 25, 2024 21:06
@hussam-i-am hussam-i-am requested a review from a team as a code owner November 25, 2024 21:06
@github-actions github-actions bot added integration-tests: failing Changes in this PR cause breaking changes in gh/gh and removed integration-tests: recommended This change needs to be tested for breaking changes. See https://arc.net/l/quote/tdmpakpm labels Nov 25, 2024
@github-actions github-actions bot temporarily deployed to storybook-preview-5332 November 26, 2024 16:11 Inactive
@github-actions github-actions bot temporarily deployed to storybook-preview-5332 November 26, 2024 19:11 Inactive
@github-actions github-actions bot temporarily deployed to storybook-preview-5332 November 27, 2024 16:35 Inactive
@github-actions github-actions bot temporarily deployed to storybook-preview-5332 November 27, 2024 17:51 Inactive
@github-actions github-actions bot temporarily deployed to storybook-preview-5332 November 27, 2024 21:50 Inactive
@github-actions github-actions bot temporarily deployed to storybook-preview-5332 December 2, 2024 15:28 Inactive
@primer-integration
Copy link

👋 Hi from github/github! Your integration PR is ready: https://github.com/github/github/pull/352879

@primer-integration
Copy link

🔴 golden-jobs completed with status failure.

jonrohan
jonrohan reviewed Dec 2, 2024
View reviewed changes
packages/react/src/PageHeader/PageHeader.module.css Outdated
--context-area-region-order-parent-link: 0;
--context-area-region-order-context-bar: 1;
--context-area-region-order-context-area-actions: 2;
}
Copy link
Member

Choose a reason for hiding this comment

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

Something that crossed my mind reviewing this, what are our feelings about putting these css variables in the :root? I don't believe the css modules conversion does anything about it and it ends up in :root in prod. @langermank

Copy link
Contributor

Choose a reason for hiding this comment

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

I agree, it might be better to tuck these into the .PageHeader class instead of :root

langermank
langermank reviewed Dec 2, 2024
View reviewed changes
packages/react/src/PageHeader/PageHeader.tsx Outdated
isCssModules: boolean,
isHidden: boolean | ResponsiveValue<boolean>,
): {
'data-is-hidden-all'?: boolean
Copy link
Contributor

Choose a reason for hiding this comment

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

Such a tiny nitpick and I can't tell if this is new or existed already, but I would just name these data-hidden-X and remove "is" 😄

@hussam-i-am hussam-i-am added this pull request to the merge queue Dec 2, 2024
Merged via the queue into main with commit 3fcfba8 Dec 2, 2024
43 checks passed
@hussam-i-am hussam-i-am deleted the hussam-i-am/css-modules-page-header branch December 2, 2024 21:49
@primer primer bot mentioned this pull request Dec 2, 2024
Merged
francinelucca added a commit that referenced this pull request Dec 5, 2024
@francinelucca
Revert "feat(PageHeader): Convert PageHeader to CSS modules behind fe…
616102a 
…ature flag (#5332)"

This reverts commit 3fcfba8.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@langermank langermank langermank approved these changes

@jonrohan jonrohan jonrohan approved these changes

@TylerJDev TylerJDev Awaiting requested review from TylerJDev TylerJDev is a code owner automatically assigned from primer/engineer-reviewers

Assignees

@hussam-i-am hussam-i-am

Labels
integration-tests: failing Changes in this PR cause breaking changes in gh/gh
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
3 participants
@hussam-i-am @jonrohan @langermank