-
Notifications
You must be signed in to change notification settings - Fork 16
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
Migrate 'LegendProportion' component from makeStyles to styled-components + cleanup #635
Migrate 'LegendProportion' component from makeStyles to styled-components + cleanup #635
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
<Circle index={0} component='span'></Circle> | ||
<Circle index={1} component='span'></Circle> | ||
<Circle index={2} component='span'></Circle> | ||
<Circle index={3} component='span'></Circle> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Maybe would be simpler just to do something like this:
{[...Array(4)].map((circle, index) => (
<Circle index={index} component='span'></Circle>
))}
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Done
@@ -48,7 +48,7 @@ function LegendProportion({ legend }) { | |||
spacing={1} | |||
> | |||
{error ? ( | |||
<Grid item className={classes.errorContainer}> | |||
<Grid item xs maxWidth={240}> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Do you need xs
here? or is it a leftover?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Done
const sizes = { | ||
0: 96, | ||
1: 72, | ||
2: 48, | ||
3: 24 | ||
}; | ||
const width = `${sizes[index]}px`; | ||
const height = `${sizes[index]}px`; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
You could use theme.spacing()
also here.
Take a look at this component to see an example: packages/react-ui/src/components/molecules/Avatar.js
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Done
Pull Request Test Coverage Report for Build 4690753089
💛 - Coveralls |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
UI LGTM, just adds a note in the changelog please, and wait for @VictorVelarde review before merging.
Thanks!!
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM, please changelog and we're free to land, thx!
10411ba
to
9ca557a
Compare
Description
This PR includes a refactorization of LegendProportion component, all classes from makestyles are been converted to styled components
Shortcut: 297037
Type of change
Acceptance
The code resultant must return same styles component visualization as the same before changes
Basic checklist