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

Replacing deprecated components and fixing prop errors #19745

Merged
merged 1 commit into from
Jun 26, 2023

Conversation

georgewrmarshall
Copy link
Contributor

@georgewrmarshall georgewrmarshall commented Jun 23, 2023

Explanation

Some prop type errors were introduced with some of the replacing of deprecated components. This PR replaces some deprecated components, removes the incorrect props and fixes some props being pass down to the html element in form-filed.js

Screenshots/Screencaps

Before

before.mov

After

after.mov

Manual Testing Steps

Pre-merge author checklist

  • I've clearly explained:
    • What problem this PR is solving
    • How this problem was solved
    • How reviewers can test my changes
  • 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.

@georgewrmarshall georgewrmarshall self-assigned this Jun 23, 2023
@github-actions
Copy link
Contributor

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.

@@ -63,7 +63,6 @@ export default function FormField({
<Text
tag="label"
htmlFor={id}
html
Copy link
Contributor Author

Choose a reason for hiding this comment

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

Fixes incorrect prop being passed to Text component

Comment on lines +218 to +248
/**
* 2px
*/
XS = 'xs',
/**
* 4px
*/
SM = 'sm',
/**
* 6px
*/
MD = 'md',
/**
* 8px
*/
LG = 'lg',
/**
* 12px
*/
XL = 'xl',
/**
* 0
*/
none = 'none',
/**
* 9999px
*/
pill = 'pill',
/**
* 50%
*/
Copy link
Contributor Author

Choose a reason for hiding this comment

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

Not part of this issue but very helpful to see the pixel value when hovering over the size abstraction

Screenshot 2023-06-23 at 12 35 07 PM


@include screen-sm-min {
margin-inline-end: 43px;
}
}
Copy link
Contributor Author

Choose a reason for hiding this comment

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

Removing unused CSS

Comment on lines -4 to -5
import Box from '../../../components/ui/box';
import Button from '../../../components/ui/button';
Copy link
Contributor Author

@georgewrmarshall georgewrmarshall Jun 23, 2023

Choose a reason for hiding this comment

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

Replacing deprecated components

</Box>
</div>
</Box>
);
Copy link
Contributor Author

Choose a reason for hiding this comment

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

Reduces a lot of HTML nesting

@georgewrmarshall georgewrmarshall marked this pull request as ready for review June 23, 2023 21:01
@georgewrmarshall georgewrmarshall requested a review from a team as a code owner June 23, 2023 21:01
@georgewrmarshall georgewrmarshall added the team-design-system All issues relating to design system in Extension label Jun 23, 2023
@metamaskbot
Copy link
Collaborator

Builds ready [01acf6c]
Page Load Metrics (1705 ± 57 ms)
PlatformPageMetricMin (ms)Max (ms)Average (ms)StandardDeviation (ms)MarginOfError (ms)
ChromeHomefirstPaint1092111503015
domContentLoaded15081922170411957
load15081922170511857
domInteractive15081922170411957
Bundle size diffs
  • background: 0 bytes
  • ui: -534 bytes
  • common: 0 bytes

@codecov
Copy link

codecov bot commented Jun 23, 2023

Codecov Report

Merging #19745 (01acf6c) into develop (fc2402d) will not change coverage.
The diff coverage is 50.00%.

@@           Coverage Diff            @@
##           develop   #19745   +/-   ##
========================================
  Coverage    69.83%   69.83%           
========================================
  Files          980      980           
  Lines        36886    36886           
  Branches      9890     9890           
========================================
  Hits         25757    25757           
  Misses       11129    11129           
Impacted Files Coverage Δ
ui/components/ui/form-field/form-field.js 94.59% <ø> (ø)
ui/helpers/constants/design-system.ts 100.00% <ø> (ø)
...ding-flow/secure-your-wallet/secure-your-wallet.js 80.77% <50.00%> (ø)

@georgewrmarshall georgewrmarshall merged commit f2d039f into develop Jun 26, 2023
@georgewrmarshall georgewrmarshall deleted the fix/console-issues branch June 26, 2023 17:29
@github-actions github-actions bot locked and limited conversation to collaborators Jun 26, 2023
@metamaskbot metamaskbot added the release-10.34.0 Issue or pull request that will be included in release 10.34.0 label Jun 26, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
release-10.34.0 Issue or pull request that will be included in release 10.34.0 team-design-system All issues relating to design system in Extension
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Fix FormField console error
5 participants