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

Migrate AvatarToken #19046

Closed

Conversation

thebinij
Copy link
Contributor

@thebinij thebinij commented May 8, 2023

Explanation

Manual Testing Steps

Pre-merge author checklist

  • I've clearly explained:
    • What problem this PR is solving
  • Sufficient automated test coverage has been added

Pre-merge reviewer checklist

  • Manual testing (e.g. pull and build branch, run in browser, test code being changed)
  • PR is linked to the appropriate GitHub issue
  • IF this PR fixes a bug in the release milestone, add this PR to the release milestone

If further QA is required (e.g. new feature, complex testing steps, large refactor), add the Extension QA Board label.

In this case, a QA Engineer approval will be be required.

@thebinij thebinij requested a review from a team as a code owner May 8, 2023 06:43
@thebinij thebinij requested a review from chloeYue May 8, 2023 06:43
@github-actions
Copy link
Contributor

github-actions bot commented May 8, 2023

CLA Signature Action: All authors have signed the CLA. You may need to manually re-run the blocking PR check if it doesn't pass in a few minutes.

@georgewrmarshall georgewrmarshall added the team-design-system All issues relating to design system in Extension label May 8, 2023
Copy link
Contributor

@georgewrmarshall georgewrmarshall left a comment

Choose a reason for hiding this comment

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

Hey @thebinij, this is looking good would you be able to add some before/after screencasts or screenshots to ensure no visual regressions before and after the migration? Thanks

/**
* Test networks have special symbols that combine the network name and 'ETH'
* so that they are distinct from mainnet and other networks that use 'ETH'.
*/
export type TestNetworkCurrencySymbol =
(typeof TEST_NETWORK_TICKER_MAP)[keyof typeof TEST_NETWORK_TICKER_MAP];
typeof TEST_NETWORK_TICKER_MAP[keyof typeof TEST_NETWORK_TICKER_MAP];

/**
* An object containing preferences for an RPC definition
Copy link
Contributor

Choose a reason for hiding this comment

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

I don't think this file should have changes even if just formatting. Could you please revert thanks!

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Sure!

Comment on lines +326 to +328
export const ColorBackgroundColorAndBorderColor: ComponentStory<
typeof AvatarToken
> = (args) => (
Copy link
Contributor

Choose a reason for hiding this comment

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

nit: does this need to be on a new line or was it automatically formatted that way by eslint?

Suggested change
export const ColorBackgroundColorAndBorderColor: ComponentStory<
typeof AvatarToken
> = (args) => (
export const ColorBackgroundColorAndBorderColor: ComponentStory<typeof AvatarToken> = (args) => (

Copy link
Contributor Author

Choose a reason for hiding this comment

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

It was automatically formatted by lint:eslint:fix

* Possible values could be 'AvatarBaseSize.Xs' 16px, 'AvatarBaseSize.Sm' 24px, 'AvatarBaseSize.Md' 32px, 'AvatarBaseSize.Lg' 40px, 'AvatarBaseSize.Xl' 48px
* Defaults to AvatarBaseSize.Md
*/
size?: AvatarBaseSize;
Copy link
Contributor

Choose a reason for hiding this comment

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

Same question as AvatarNetwork is there a way we could allow for AvatarNetworkSize enum? Not sure if we want to mix enum names and components? Do you have any thoughts on this @brad-decker? If we update the engineer will have to use something like

<AvatarToken size={AvatarBaseSize.Lg} />

Which I'm not a huge fan of...

@@ -290,7 +290,7 @@ export interface BoxProps extends React.HTMLAttributes<HTMLElement> {
* Use TEXT_ALIGN const from '../../../helpers/constants/design-system';
* Accepts responsive props in the form of an array.
*/
textAlign?: BoxTextAlign | BoxTextAlignArray;
textAlign?: BoxTextAlign | BoxTextAlignArray | TextAlign;
Copy link
Contributor

Choose a reason for hiding this comment

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

Left a comment in another of your PRs addressing this

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Got it!

@thebinij
Copy link
Contributor Author

thebinij commented May 9, 2023

This is an old PR. New PR

@thebinij thebinij closed this May 9, 2023
@github-actions github-actions bot locked and limited conversation to collaborators May 9, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
external-contributor team-design-system All issues relating to design system in Extension
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Migrate components to TS: AvatarToken
2 participants