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.

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

badge: chonkify badge and tags #86207

Merged
merged 6 commits into from
Mar 5, 2025
Merged

badge: chonkify badge and tags #86207

merged 6 commits into from
Mar 5, 2025

Conversation

JonasBa
Copy link
Member

@JonasBa JonasBa commented Mar 3, 2025

Designs have changed, this PR adjusts them to the latest spec

@JonasBa JonasBa requested a review from a team as a code owner March 3, 2025 17:58
@github-actions github-actions bot added the Scope: Frontend Automatically applied to PRs that change frontend components label Mar 3, 2025
Comment on lines 15 to 28
return {
...props,
type:
props.type === 'highlight'
? 'info'
: props.type === 'error'
? 'danger'
: props.type === 'white'
? 'default'
: props.type === 'black'
? 'default'
: props.type === undefined
? 'default'
: props.type,
Copy link
Member

Choose a reason for hiding this comment

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

can we use a mapping instead 🫠

Copy link
Contributor

Choose a reason for hiding this comment

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

I think this is the main reason why no-nested-ternary exists. Any reason it’s not turned on in sentry?

Comment on lines 15 to 28
return {
...props,
type:
props.type === 'highlight'
? 'info'
: props.type === 'error'
? 'danger'
: props.type === 'white'
? 'default'
: props.type === 'black'
? 'default'
: props.type === undefined
? 'default'
: props.type,
Copy link
Member

Choose a reason for hiding this comment

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

Suggested change
return {
...props,
type:
props.type === 'highlight'
? 'info'
: props.type === 'error'
? 'danger'
: props.type === 'white'
? 'default'
: props.type === 'black'
? 'default'
: props.type === undefined
? 'default'
: props.type,
const legacyTypeMapping = {
highlight: 'info',
error: 'danger',
white: 'default',
black: 'default',
[undefined]: 'default'
};
return {
...props,
type: legacyTypeMapping[props.type] ?? props.type,

Copy link
Member Author

Choose a reason for hiding this comment

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

What is this [undefined]: 'default' 😂 ?

Copy link
Member Author

Choose a reason for hiding this comment

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

CleanShot 2025-03-03 at 13 06 43@2x

It's not very happy. I honestly have little preference here because I plan to delete this afterwards

Copy link
Contributor

Choose a reason for hiding this comment

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

if we make type optional in ChonkTagProps and then destruct it to ’default’ where necessary, we can do this:

const legacyTypeMapping: Partial<Record<NonNullable<TagProps['type']>, TagType>> = {
  highlight: 'info',
  error: 'danger',
  white: 'default',
  black: 'default',
};

export function chonkTagPropMapping(props: TagProps): ChonkTagProps {
  return {
    ...props,
    type: props.type && legacyTypeMapping[props.type],
  };
}

Copy link

codecov bot commented Mar 4, 2025

Bundle Report

Changes will increase total bundle size by 2.01kB (0.0%) ⬆️. This is within the configured threshold ✅

Detailed changes
Bundle name Size Change
app-webpack-bundle-array-push 42.46MB 2.01kB (0.0%) ⬆️

Affected Assets, Files, and Routes:

view changes for bundle: app-webpack-bundle-array-push

Assets Changed:

Asset Name Size Change Total Size Change (%)
chunks/app_components_assigneeBadge_tsx-app_components_charts_components_markLine_tsx-app_components-4285bc.*.js 1.34kB 1.16MB 0.12%
chunks/app_components_feedback_widget_us*kWidget_tsx-app_views_projectDetail_index_tsx.03a70e5aedccfb73bc3d.js (New) 125.93kB 125.93kB 100.0% 🚀
chunks/app_components_compactSelect_list_tsx-app_views_settings_components_text_textBlock_tsx.*.js -223 bytes 40.75kB -0.54%
chunks/app_components_acl_access_tsx-app_components_autoComplete_tsx-app_components_core_badge_featu-39e51e.*.js -223 bytes 32.28kB -0.69%
chunks/app_components_charts_eventsRequest_tsx-app_components_feedback_widget_us*kWidget_tsx--fbb1b9.613ff63f38399c8c22e7.js (New) 31.1kB 31.1kB 100.0% 🚀
chunks/app_components_acl_access_tsx-app_components_autoComplete_tsx-app_components_core_badge_featu-9ec715.*.js -223 bytes 28.29kB -0.78%
chunks/app_components_feedback_widget_us*kWidget_tsx-app_views_performance_transactionSummary-51d702.50e939f657ff6c301567.js (New) 25.7kB 25.7kB 100.0% 🚀
chunks/app_components_feedback_widget_us*kWidget_tsx-app_components_performance_transactionSe-feae7d.ee04b9fa4963304ca6a1.js (New) 24.18kB 24.18kB 100.0% 🚀
chunks/app_components_modals_emailVerificationModal_tsx.*.js 1.34kB 19.89kB 7.21% ⚠️
chunks/app_components_feedback_widget_us*kWidget_tsx-app_utils_discover_discoverQuery_tsx-app-c5fefe.03c9ed12ac2442941f73.js (New) 17.41kB 17.41kB 100.0% 🚀
chunks/app_components_feedback_widget_us*kWidget_tsx-app_components_gridEditable_sortLink_tsx-d372f4.3155da782668d9ea5c56.js (New) 16.21kB 16.21kB 100.0% 🚀
chunks/app_components_feedback_widget_us*kWidget_tsx-app_components_performance_transactionSe-f61270.fe5251f329152b14fc32.js (New) 13.36kB 13.36kB 100.0% 🚀
chunks/app_components_charts_lineChart_tsx-app_components_feedback_widget_us*kWidget_tsx-app_-26fc43.2aea5025d7aae32bff56.js (New) 12.34kB 12.34kB 100.0% 🚀
chunks/app_components_feedback_widget_us*kWidget_tsx-app_views_projectDetail_index_tsx.7ddf25be9385726059eb.js (Deleted) -125.93kB 0 bytes -100.0% 🗑️
chunks/app_components_charts_eventsRequest_tsx-app_components_feedback_widget_us*kWidget_tsx--fbb1b9.cdc806e062b63f894e5c.js (Deleted) -31.1kB 0 bytes -100.0% 🗑️
chunks/app_components_feedback_widget_us*kWidget_tsx-app_views_performance_transactionSummary-51d702.9576e50c707889151092.js (Deleted) -25.7kB 0 bytes -100.0% 🗑️
chunks/app_components_feedback_widget_us*kWidget_tsx-app_components_performance_transactionSe-feae7d.a702eb5595fb480f9d3a.js (Deleted) -24.18kB 0 bytes -100.0% 🗑️
chunks/app_components_feedback_widget_us*kWidget_tsx-app_utils_discover_discoverQuery_tsx-app-c5fefe.b10b6d6fc838d536a98e.js (Deleted) -17.41kB 0 bytes -100.0% 🗑️
chunks/app_components_feedback_widget_us*kWidget_tsx-app_components_gridEditable_sortLink_tsx-d372f4.9ee9fddb3073a51af717.js (Deleted) -16.21kB 0 bytes -100.0% 🗑️
chunks/app_components_feedback_widget_us*kWidget_tsx-app_components_performance_transactionSe-f61270.7ef35fee97c0a4b5fb81.js (Deleted) -13.36kB 0 bytes -100.0% 🗑️
chunks/app_components_charts_lineChart_tsx-app_components_feedback_widget_us*kWidget_tsx-app_-26fc43.c7ab416d60d414290c8d.js (Deleted) -12.34kB 0 bytes -100.0% 🗑️

@JonasBa JonasBa merged commit d8f014d into master Mar 5, 2025
42 checks passed
@JonasBa JonasBa deleted the jb/theme/badge-tag-theme branch March 5, 2025 15:17
philipphofmann pushed a commit that referenced this pull request Mar 6, 2025
Designs have changed, this PR adjusts them to the latest spec
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Scope: Frontend Automatically applied to PRs that change frontend components
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants