mobile: build multi-card picker sheet and context card switching flow

[ShantKhatri]

Summary

Product doc section 4.5 specifies users can have multiple context cards (Professional, Hackathon, Community) and rapidly switch between them at sharing time. Implement a bottom sheet card picker in the mobile app.

Context

The CardsScreen.tsx at apps/mobile/src/screens/CardsScreen.tsx manages card creation. The ScanScreen.tsx is where users share their QR. The picker should appear on ScanScreen — letting the user choose which card's QR to display.

Tasks

• create apps/mobile/src/components/CardPickerSheet.tsx — a bottom-sheet modal listing all the user's cards with name, icon count, and a 'Select' button.
• use @gorhom/bottom-sheet (or equivalent available in the project) for the sheet.
• in ScanScreen.tsx, add a 'Switch Card' button above the QR code that opens CardPickerSheet.
• on card selection, regenerate the QR code URL to encode ?card=<cardId> parameter.
• persist the last-selected card in AsyncStorage so it reopens on next session.
• add an empty state inside the picker for users with only one card, prompting 'Create another card in Cards tab'.
• write tests for CardPickerSheet rendering and selection callback.

Acceptance Criteria

• user on ScanScreen can switch cards and the QR code updates.
• last selected card is remembered across sessions.
• component is reusable and decoupled from screen logic.

Difficulty

medium-advanced — requires bottom sheet implementation, AsyncStorage persistence, and QR regeneration flow.

[rohtheroos-84]

hi @ShantKhatri, can i work on this feature?

[ShantKhatri]

hi @ShantKhatri, can i work on this feature?

Yea, go ahead.