chore(js-ts): Convert app/components/UI/Swaps/components/Ratio.js to TypeScript

[devin-ai-integration]

Convert app/components/UI/Swaps/components/Ratio.js to TypeScript

Changes Made

• Converted Ratio.js to Ratio.tsx
• Removed PropTypes and added TypeScript interfaces
• Updated to use ThemeColors from @metamask/design-tokens
• Added type annotations for variables and function return types
• Imported BigNumber from bignumber.js for ratio type

Key Updates

1. Created interfaces for TokenInfo and RatioProps
2. Added type annotations for useState, useRatio, and handleRatioSwitch
3. Updated createStyles function to use ThemeColors type
4. Removed PropTypes validation at the end of the file

Reviewer Notes

• Please check if the TokenInfo interface covers all necessary properties
• Verify if the RatioProps interface includes all required props
• Confirm that the ThemeColors import path is correct for the project structure

Testing

No functional changes were made, so existing tests should cover the component's behavior. However, please run the test suite to ensure no regressions.

Link to Devin run: https://preview.devin.ai/devin/33c5d255eb1e4c069d2167b05f5abbe4

This Devin run was requested by Sampriti.

If you have any feedback, you can leave comments in the PR and I'll address them in the app!

[github-actions]

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.

[Cal-L]

Left some comments

[Cal-L]

LGTM

[sonarqubecloud]

Quality Gate passed

Issues
8 New issues
0 Accepted issues

Measures
0 Security Hotspots
6.2% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarCloud