feat(FX-4762): Support CTA in Toast #8627
Conversation
| @@ -128,7 +137,6 @@ export const ToastComponent = ({ | |||
| backgroundColor={color(backgroundColor)} | |||
| opacity={opacityAnim.interpolate({ inputRange: [0, 1], outputRange: [0, 1] })} | |||
| overflow="hidden" | |||
| paddingRight={2} | |||
There was a problem hiding this comment.
paddingRight prop was added in this PR. I checked with @araujobarret, he doesn't mind if we remove it (since there is some UI problem when clicking on toast because of this. See attached video)
| Video | Screenshots |
|---|---|
demo.mp4 |
 |
| @@ -30,6 +29,7 @@ export const ToastComponent = ({ | |||
| Icon, | |||
| backgroundColor = "black100", | |||
| duration = "short", | |||
| cta, | |||
There was a problem hiding this comment.
question: should we support "CTA" for toasts placed in the middle? It seems to me that this is not necessary. what do you think? 🤔
There was a problem hiding this comment.
I'm not sure, this kind of middle CTA doesn't even exist in our DS, I'd expect the toasts we have there with the desired position.
There was a problem hiding this comment.
yeah, good point!
| @@ -17,10 +17,16 @@ export interface ToastDetails { | |||
| placement: ToastPlacement | |||
| message: string | |||
|
|
|||
| /* Display CTA for toasts with top or bottom placement */ | |||
| cta?: string | |||
There was a problem hiding this comment.
or is ctaText better?
There was a problem hiding this comment.
personal opinion: cta of type string it's already self-explanatory to me 👍
This PR resolves FX-4762
ToDo
paddingRightwith CarlosAcceptance Criteria
Demo
PR Checklist
To the reviewers 👀
Changelog updates
Changelog updates
Cross-platform user-facing changes
iOS user-facing changes
Android user-facing changes
Dev changes
Need help with something? Have a look at our docs, or get in touch with us.