[Optimization] `SubscriptionManager.tsx` (619 lines) and `MobileSettings.tsx` (609 lines) should be split by section

[RUKAYAT-CODER]

Overview

SubscriptionManager.tsx (619 lines, 11 touchables, no accessibility labels) and MobileSettings.tsx (609 lines, 13 type errors) are both monolithic screens holding many independent sections in one component. Any state change — a toggle, a fetch completing, a modal opening — re-renders the whole tree. MobileSettings already reaches for useMemo in four places to compensate, which is the symptom rather than the fix: the sections should be separate memoised components. The repo has SettingsSection.tsx and SettingsPicker.tsx for exactly this purpose.

Specifications

Features:

• Each settings/subscription section extracted into its own memoised component
• State ownership pushed down to the section that uses it
• Accessibility labels added during the split

Tasks:

• Split MobileSettings.tsx along its existing visual sections using SettingsSection
• Split SubscriptionManager.tsx into plan list, current-plan summary, and action components
• Wrap each extracted section in React.memo with stable callbacks
• Add render-count assertions so a toggle repaints one section only

Impacted Files:

• src/components/mobile/MobileSettings.tsx
• src/components/mobile/SubscriptionManager.tsx
• src/components/mobile/SettingsSection.tsx
• src/components/mobile/SettingsPicker.tsx

Acceptance Criteria

• Toggling one setting re-renders only its section
• No file in either tree exceeds ~250 lines
• Both screens have full accessibility labelling

[iorchirmyom-afk]

@iorchirmyom-afk has applied to work on this issue as part of the Stellar Wave Program's 8th wave.

Hi Maintainer, I’ve taken some time to understand the issue and I’d really appreciate the opportunity to work on it. I’m confident I can contribute a good solution. Please consider me for the task.

ℹ️ Repo Maintainers: To accept this application, review their application or assign @iorchirmyom-afk to this issue.

[Meet-hybrid]

@Meet-hybrid has applied to work on this issue as part of the Stellar Wave Program's 8th wave.

Please can I work on this?

ℹ️ Repo Maintainers: To accept this application, review their application or assign @Meet-hybrid to this issue.

[m-hajjo]

@m-hajjo has applied to work on this issue as part of the Stellar Wave Program's 8th wave.

Hello Maintainer!!
I would like to work on this issue

ℹ️ Repo Maintainers: To accept this application, review their application or assign @m-hajjo to this issue.

[xtrial01]

@xtrial01 has applied to work on this issue as part of the Stellar Wave Program's 8th wave.

Hi, I'd like to work on this issue.

ℹ️ Repo Maintainers: To accept this application, review their application or assign @xtrial01 to this issue.

[drips-wave]

Congratulations, @m-hajjo! 🎉 Your application was accepted by the repo's maintainers, and the issue is due on August 31, 2026.

🧑‍💻 @m-hajjo: Please resolve the issue such that the repo's maintainers have enough time to review your contribution before the due date. You'll earn Points for completing the issue on-time, which will make you eligible for a share of the Stellar Wave Program's reward pool.

Warning

When opening a PR, please link it to this issue to ensure it gets tracked accurately. Points are awarded when this issue is marked as completed by the maintainer.

🤠 Repo maintainers: Please keep an eye on the contributor's progress and review their work before the due date. You can manage this issue, including adjusting its complexity and points, here.

🌊 Happy Wave 🌊

[grantfox-oss]

🎉 This issue has been marked as completed on GrantFox as part of the Third Campaign campaign!

@m-hajjo's PR #1064 was approved and merged by @RUKAYAT-CODER.

🏆 @m-hajjo: You earned 35 FoxPoints for this contribution! Your current tier: Explorer (767 total points). Track your full progress on GrantFox.

👏 Great work, @m-hajjo! Keep contributing to rinafcode.

[drips-wave]

This issue has been completed by @m-hajjo as part of the Stellar Wave Program's 8th Wave 🥳

😎 @m-hajjo: You earned 200 Points for completing this issue! After the current Wave ends, you'll be eligible for a percentage of the Wave's reward pool based on the percentage of total points you've earned. Learn more here. You can also Leave a review to share your experience working on this issue.

🧑‍💻 Repo maintainers: How'd the contributor do? Leave a review to share your experience working with them.