Replace deprecated Popover component with Modal from the component-library

georgewrmarshall commented 1 year ago

Description

Currently, the extension is using an outdated Popover component, which needs to be replaced with the new Modal component.

This is a massive undertaking by itself and creating a single PR would be too large. Smaller PRs can be submitted against this issue to ensure easier review and gradual improvements.

Technical Details

Replace instances of Popover component (ui/components/ui/popover/popover.component.js) with Modal component (ui/components/component-library/modal/modal.tsx)
Component architecture and APIs are different so ensure all components and props have been migrated appropriately

Acceptance Criteria

Instances of Popover component are completely replaced with the new Modal component
The component APIs are updated to reflect the changes in the new Popover component and there is no functional changes or visual regression
Each Pull Request (PR) should include no more than 3 files
The code changes should pass Jest tests, linting, and Storybook without any errors.
The PR must include before and after screenshots of the UI to ensure there are no visual regressions.

If the acceptance criteria is not met, PRs may be closed.

Difficulty: Intermediate

Good first issue for: External contributors who are familiar with running the extension locally, have knowledge of React, component props, Jest tests, linting, and Storybook, and want to contribute to improving the cohesiveness of UI in the extension

ElRakabawi commented 1 year ago

Hey! Can I work on it?

georgewrmarshall commented 1 year ago

Hey @ElRakabawi, sure you can submit a PR against this issue ensuring that all the acceptance criteria is met! Thanks

panditdhamdhere commented 1 year ago

hey can contribute on it ?

georgewrmarshall commented 1 year ago

Hey @panditdhamdhere, you sure can! Just submit a PR against this issue ensuring that all the acceptance criteria are met! Thanks

shivam-puri commented 1 year ago

Hey! Can I help ??

georgewrmarshall commented 1 year ago

Hey @shivm29, Yes! Just submit a PR against this issue ensuring that all the acceptance criteria are met! Thanks

Macky151203 commented 1 month ago

Hey can i work on it?

MetaMask / metamask-extension