feat: My Business Card feature + code consolidation #244
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
…stamps BREAKING: Transaction timestamps for non-BFM chains now display correctly. Previously all BioChain transactions used a hardcoded 2017-01-01 epoch. Now each chain uses its genesis block's beginEpochTime. Changes: - biowallet-provider.ts: Added epochMs member, fetch beginEpochTime from genesis - time-display.tsx: Added timeZoneName to datetime format for clarity
- Fix QR code not rendering by providing renderFn to AddressQRCode - Add QRCodeSVG from qrcode.react for actual QR rendering - Integrate snapdom for save image and share functionality - Add saveImage and imageSaved i18n keys - Add Storybook play function tests for visual verification - Update unit tests with strong SVG assertions to prevent regression
- Add userProfileStore for global username, avatar, and wallet selection - Create MyCardPage with avatar editing, username editing, wallet selection - Create WalletPickerSheet for selecting up to 3 wallets - Add /my-card route and MyCardActivity - Add My Card entry to settings page - Fix send page scanner to support contact protocol - Add i18n keys for myCard feature (zh-CN, en) - Add unit tests for userProfileStore (23 tests) - Add Storybook story for MyCardPage
- Add 13 tests for MyCardPage covering all acceptance criteria - Fix vi.mock hoisting issues with fully inline mocks - All 36 tests pass (13 MyCardPage + 23 userProfileStore) Tested AC: - AC-1: Page rendering (header, avatar, QR, buttons) - AC-2: Avatar click randomization - AC-4: Wallet selection (chips, add, remove) - AC-5: QR generation (contact protocol) - AC-6: Download with snapdom
- Replace AddressQRCode with ContactCard component - Use user profile (avatar, username) in ReceivePage - Generate QR with contact protocol via generateContactQRContent - Update tests to verify ContactCard integration - Fix Storybook story import path All 49 tests pass: - userProfileStore: 23 tests - MyCardPage: 13 tests - ReceivePage: 13 tests
- Add CHAIN_COLORS map for all 12 chain types - Add getContrastTextColor using WCAG luminance formula - Text automatically switches to white/black based on background - Remove delete button from wallet chips (was overflowing) - Remove unused X import and handleRemoveWallet function - Update test to verify chain color styling
…lors - Replace CHAIN_COLORS constant with wallet.themeHue - Use HSL(hue, 65%, 55%) for vibrant wallet-specific colors - Auto-adjust text color (white/black) based on hue range - Delete button already removed in previous commit
- Import resolveBackgroundStops from refraction module - Use oklch-to-srgb converted c0 color (same as WalletMiniCard) - White text since c0 colors are dark (L=0.5 in oklch) - Add mock for refraction module in tests
Without AppScreen wrapper from @stackflow/plugin-basic-ui, the navigation transition doesn't work properly - URL changes but page doesn't render. This matches pattern used by other working activities like AddressBookActivity.
- Remove wallet info header at top of settings - Add My Card entry with user avatar and username - Use ContactAvatar component for avatar display - Navigate to /my-card on click
- Remove chain name text (ETH, BTC, etc.) from wallet chips - Color alone indicates the wallet/address type - Cleaner, more minimal design
…th color" This reverts commit 2d5db28.
- ContactCard address labels now only show wallet name - Color from detectAddressFormat indicates address type - Chips inside QR image are now cleaner
- Add X icon import - Each wallet chip now has a delete button - Delete button calls toggleWalletSelection to remove wallet
- Add colors for binance and all BioForest chains - bfmeta (indigo), ccchain (emerald), pmchain (violet), etc. - No more grey fallback for known chains
Colors now based on address format, not individual chains: - EVM (0x...) - ethereum, binance → #627EEA (blue-purple) - Bitcoin (1.../3.../bc1...) → #F7931A (orange) - TRON (T...) → #FF0013 (red) - BioForest (all BioForest chains) → #6366F1 (indigo)
- Create useSnapdomShare hook in src/hooks/useSnapdomShare.ts - Update MyCardPage to use the hook instead of inline snapdom logic - Reduces ~35 lines of duplicate code from MyCardPage - ReceivePage kept inline due to custom haptics/toast integration
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Summary
主要功能
代码整合
useSnapdomSharehook 减少重复代码其他修复
测试
文件变更