adrienne / added modal provider for wallets

[adrienne-deriv]

Changes:

Please provide a summary of the change.

Screenshots:

Please provide some screenshots of the change.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Updated (UTC)
deriv-app	✅ Ready (Inspect)	Visit Preview	Sep 20, 2023 9:01am

[github-actions]

A production App ID was automatically generated for this PR. (log)

• PR: adrienne / added modal provider for wallets #10191
• URLs:
  • w/ App ID + Server: https://deriv-app-git-fork-adrienne-deriv-wallets-generic-modal.binary.sx?qa_server=red.binaryws.com&app_id=31497
  • Original: https://deriv-app-git-fork-adrienne-deriv-wallets-generic-modal.binary.sx
• App ID: 31497

Click here to copy & paste above information.

- **PR**: [https://github.com/binary-com/deriv-app/pull/10191](https://github.com/binary-com/deriv-app/pull/10191)
- **URLs**:
    - **w/ App ID + Server**: https://deriv-app-git-fork-adrienne-deriv-wallets-generic-modal.binary.sx?qa_server=red.binaryws.com&app_id=31497
    - **Original**: https://deriv-app-git-fork-adrienne-deriv-wallets-generic-modal.binary.sx
- **App ID**: `31497`

[github-actions]

🚨 Lighthouse report for the changes in this PR:

Category	Score
🔺 Performance	21
🟧 Accessibility	75
🟢 Best practices	92
🟧 SEO	85
🟢 PWA	90

Lighthouse ran with https://deriv-app-git-fork-adrienne-deriv-wallets-generic-modal.binary.sx/

[sonarqubecloud]

SonarCloud Quality Gate failed.   

18 Bugs
0 Vulnerabilities
0 Security Hotspots
15 Code Smells

No Coverage information
13.3% Duplication

Catch issues before they fail your Quality Gate with our IDE extension SonarLint

[coveralls]

coverage: 10.584%. remained the same when pulling 87b4d15 on adrienne-deriv:wallets-generic-modal into 790dd16 on binary-com:master.

[review-deriv]

AI Review (AI review can be wrong. Do not use it as the only source of feedback)

This code seems reasonably organized and functional for a ModalProvider component and the provider is suitably incorporated in the main application.

However, there are a few areas that could be improved:

1. Null reference: document.getElementById('wallets_modal_root') can return null and this isn't being handled. The code assumes that a div with id 'wallets_modal_root' would always exist, which if not met, could lead to further problems at runtime when attempting to use createPortal.

2. Error Handling: The function useModal throws an error if the context isn't available, but there is no catch or user-friendly fallback set up.

3. Security: There's no explicit security issue present in the given code since it doesn't deal with any sensitive user data, API requests etc. However, injecting user supplied contents within modal could lead to a potential risk of XSS(Cross Site Scripting) vulnerabilities.

In summary, the code is solid in terms of the basic functionality of modal display context setup, but it needs to address null reference issues and has somewhat barebones error handling. It doesn't explicitly have any security issues but care should be taken when integrating it.