MetaMask / MetaMask/metamask-mobile
Convert TypedSign component into a functional component
- Dominant language
- TypeScript
- Stars
- 3k
- Forks
- 1.7k
- Avg merge
- 1d 14h
- Merged PRs (30d)
- 669
Description
### **Description**
Convert TypedSign component into a functional component:
[https://github.com/MetaMask/metamask-mobile/blob/18dc20b8cc9f3f0707f5eb04f2ac88ee320c93bb/app/components/UI/TypedSign/index.js](https://github.com/MetaMask/metamask-mobile/blob/44fd8450a84ebde8510a244ee1eda4b2e12a1df1/app/components/PersonalSign/index.js)
----------------------------------------------------------
A lot of code is duplicated in the 3 Signature components: [MessageSign](https://github.com/MetaMask/metamask-mobile/blob/18dc20b8cc9f3f0707f5eb04f2ac88ee320c93bb/app/components/UI/MessageSign/index.js), [PersonalSign](https://github.com/MetaMask/metamask-mobile/blob/44fd8450a84ebde8510a244ee1eda4b2e12a1df1/app/components/PersonalSign/index.js), [TypedSign](https://github.com/MetaMask/metamask-mobile/blob/18dc20b8cc9f3f0707f5eb04f2ac88ee320c93bb/app/components/UI/TypedSign/index.js)
As the components are converted to functional components, we can get rid of duplicate code also.
1. These functions can be moved to utility class - `walletConnectNotificationTitle`, `showWalletConnectNotification`.
2. Following 4 functions can be move to [SignatureRequest](https://github.com/MetaMask/metamask-mobile/blob/18dc20b8cc9f3f0707f5eb04f2ac88ee320c93bb/app/components/UI/SignatureRequest/index.js) component by passing `getAnalyticsParams` as prop to it
- `componentDidMount`
- `rejectMessage`
- `cancelSignature`
- `confirmSignature`
3. Toggling between Expanded View and Signature request logic can also be moved to SignatureRequest component.
----------------------------------------------------------
### **Acceptance Criteria**
- Signature request functionality continues to work as it is currently
- Use of deprecated react api is removed
- Code duplication between the components [MessageSign](https://github.com/MetaMask/metamask-mobile/blob/18dc20b8cc9f3f0707f5eb04f2ac88ee320c93bb/app/components/UI/MessageSign/index.js), [PersonalSign](https://github.com/MetaMask/metamask-mobile/blob/44fd8450a84ebde8510a244ee1eda4b2e12a1df1/app/components/PersonalSign/index.js), [TypedSign](https://github.com/MetaMask/metamask-mobile/blob/18dc20b8cc9f3f0707f5eb04f2ac88ee320c93bb/app/components/UI/TypedSign/index.js) is minimised
### **References**
https://docs.google.com/document/d/19xKY4e07UThOa1jsDQA8pjsNLUBRn39EdUbaFpz3OR0/edit?usp=sharing
Contributor guide
Assessment
This issue has not been assessed yet.