feat: add platform-aware MobileDownloadActions for iOS/Android#405
Open
feat: add platform-aware MobileDownloadActions for iOS/Android#405
Conversation
gonpombo8
changed the title
Deploying ui2 with
|
| Latest commit: |
4538c54
|
| Status: | ✅ Deploy successful! |
| Preview URL: | https://975c12cd.ui2-423.pages.dev |
| Branch Preview URL: | https://feat-mobile-download-actions.ui2-423.pages.dev |
Replace MobileStoreBadges in MobileDownloadModal with MobileDownloadActions that renders platform-specific CTAs: Google Play button for Android, share link + Apple Coming Soon badge for iOS. Add GooglePlayIcon component. Update modal typography to match Figma specs.
gonpombo8
force-pushed
the
feat/mobile-download-actions
branch
from
a4f83d0 to
10bbdd8
Compare
gonpombo8
changed the title
gonpombo8
changed the title
Move title/description strings into MobileDownloadModal.i18n.ts with optional i18n prop override, following the UserMenu pattern. Consumers no longer need to pass title/description — just platform.
Move hardcoded button labels (GET IT ON, Google Play, SEND YOURSELF THE LINK, Coming Soon) into i18n with optional override prop.
Adjust Coming Soon gap, title line-height, and spacing between elements to match Figma. Remove modalProps spread that leaked Storybook args into Modal causing back arrow to show.
- Rename folder to better reflect component purpose - Fix WebGL texture lifecycle bug with cancellation flag - Replace hardcoded colors with theme values - Fix share API error handling to only swallow AbortError - Use project AppleIcon instead of MUI's - Fix memo pattern, type exports, and unused Fallback variant prop - Extract i18n defaults and shared MobilePlatform type - Add platform-specific phone image for Android modal
- Make MobileDownloadActions.platform required instead of optional - Add actionsI18n prop to MobileDownloadModal for button text localization
Actions already have built-in defaults; the override can be added later if localization is needed.
braianj
approved these changes
Mar 24, 2026
Collaborator
braianj
left a comment
braianj
left a comment
There was a problem hiding this comment.
LGTM! 🎉
I've left some comments
| fontSize: 22, | ||
| fontWeight: 700, | ||
| boxShadow: theme.shadows[4], | ||
| padding: '12px 20px', |
Collaborator
There was a problem hiding this comment.
Can you review the paddings and margins using the theme.spacing function?
Comment on lines
+20
to
+33
| const handleSendLink = useCallback(async () => { | ||
| const url = window.location.href | ||
| try { | ||
| if (navigator.share) { | ||
| await navigator.share({ url }) | ||
| } else { | ||
| await navigator.clipboard.writeText(url) | ||
| } | ||
| onCopyLink?.() | ||
| } catch (error) { | ||
| if (error instanceof DOMException && error.name === 'AbortError') return | ||
| throw error | ||
| } | ||
| }, [onCopyLink]) |
Collaborator
There was a problem hiding this comment.
this function looks useful, WDYT about moving it to a global space like modules?
| @@ -0,0 +1,17 @@ | |||
| type MobilePlatform = 'android' | 'ios' | |||
Collaborator
There was a problem hiding this comment.
WDYT about applying a better background color like in other designs?
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
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
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
MobileDownloadActionscomponent with Android (Google Play button) and iOS (Share Link + Coming Soon badge) variantsGooglePlayIconSVG componentMobileDownloadModalto requireplatformprop and useMobileDownloadActionsinstead ofMobileStoreBadgesWhat could break
MobileDownloadModalnow requiresplatformprop (was optional) and removesbadgeSize/iosStoreUrlpropsplatform: 'android' | 'ios'How to test
npm start