Skip to content

Commit 32f616e

Browse files
Jon-edgeJon-edge
committed
Add gift card transaction integration
- Display gift cards in TransactionDetailsScene - Add giftCard action type handling in CategoriesActions - Add sliderTopNode prop to SendScene2 for purchase flow - Add Phaze merchant contact info
1 parent 5cb61b9 commit 32f616e

File tree

6 files changed

+137
-37
lines changed

6 files changed

+137
-37
lines changed

‎src/__tests__/scenes/__snapshots__/TransactionDetailsScene.test.tsx.snap‎

Lines changed: 102 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -228,15 +228,10 @@ exports[`TransactionDetailsScene should render 1`] = `
228228
<View
229229
style={
230230
{
231-
"flex": undefined,
232-
"marginBottom": undefined,
233-
"marginLeft": undefined,
234-
"marginRight": undefined,
235-
"marginTop": undefined,
231+
"flex": 1,
232+
"marginTop": 0,
236233
"paddingBottom": 11,
237-
"paddingLeft": 11,
238-
"paddingRight": 11,
239-
"paddingTop": 11,
234+
"paddingHorizontal": 11,
240235
}
241236
}
242237
>
@@ -497,6 +492,45 @@ exports[`TransactionDetailsScene should render 1`] = `
497492
</View>
498493
</View>
499494
</View>
495+
<View
496+
collapsable={false}
497+
entering={
498+
FadeInDown {
499+
"build": [Function],
500+
"delayV": 0,
501+
"durationV": 300,
502+
"easingV": [Function],
503+
"initialValues": {
504+
"transform": [
505+
{
506+
"translateY": 80,
507+
},
508+
],
509+
},
510+
"randomizeDelay": false,
511+
"reduceMotionV": "system",
512+
}
513+
}
514+
jestAnimatedProps={
515+
{
516+
"value": {},
517+
}
518+
}
519+
jestAnimatedStyle={
520+
{
521+
"value": {},
522+
}
523+
}
524+
layout={
525+
LinearTransition {
526+
"build": [Function],
527+
"durationV": 300,
528+
"randomizeDelay": false,
529+
"reduceMotionV": "system",
530+
}
531+
}
532+
nativeID="2"
533+
/>
500534
<View
501535
collapsable={false}
502536
entering={
@@ -534,7 +568,7 @@ exports[`TransactionDetailsScene should render 1`] = `
534568
"reduceMotionV": "system",
535569
}
536570
}
537-
nativeID="2"
571+
nativeID="3"
538572
>
539573
<View
540574
style={
@@ -1312,7 +1346,7 @@ exports[`TransactionDetailsScene should render 1`] = `
13121346
"reduceMotionV": "system",
13131347
}
13141348
}
1315-
nativeID="3"
1349+
nativeID="4"
13161350
>
13171351
<View
13181352
style={
@@ -1736,7 +1770,7 @@ exports[`TransactionDetailsScene should render 1`] = `
17361770
"reduceMotionV": "system",
17371771
}
17381772
}
1739-
nativeID="4"
1773+
nativeID="5"
17401774
/>
17411775
<View
17421776
collapsable={false}
@@ -1775,7 +1809,7 @@ exports[`TransactionDetailsScene should render 1`] = `
17751809
"reduceMotionV": "system",
17761810
}
17771811
}
1778-
nativeID="5"
1812+
nativeID="6"
17791813
/>
17801814
<View
17811815
collapsable={false}
@@ -1814,7 +1848,7 @@ exports[`TransactionDetailsScene should render 1`] = `
18141848
"reduceMotionV": "system",
18151849
}
18161850
}
1817-
nativeID="6"
1851+
nativeID="7"
18181852
>
18191853
<View
18201854
style={
@@ -2056,7 +2090,7 @@ exports[`TransactionDetailsScene should render 1`] = `
20562090
"reduceMotionV": "system",
20572091
}
20582092
}
2059-
nativeID="7"
2093+
nativeID="8"
20602094
>
20612095
<View
20622096
style={
@@ -2669,7 +2703,7 @@ exports[`TransactionDetailsScene should render 1`] = `
26692703
"reduceMotionV": "system",
26702704
}
26712705
}
2672-
nativeID="8"
2706+
nativeID="9"
26732707
>
26742708
<View
26752709
absolute={false}
@@ -2867,7 +2901,7 @@ exports[`TransactionDetailsScene should render 1`] = `
28672901
},
28682902
]
28692903
}
2870-
nativeID="9"
2904+
nativeID="10"
28712905
onLayout={[Function]}
28722906
stackHeight={0}
28732907
style={
@@ -3089,7 +3123,7 @@ exports[`TransactionDetailsScene should render with negative nativeAmount and fi
30893123
},
30903124
]
30913125
}
3092-
nativeID="10"
3126+
nativeID="11"
30933127
onMomentumScrollBegin={[Function]}
30943128
onMomentumScrollEnd={[Function]}
30953129
onScroll={[Function]}
@@ -3121,15 +3155,10 @@ exports[`TransactionDetailsScene should render with negative nativeAmount and fi
31213155
<View
31223156
style={
31233157
{
3124-
"flex": undefined,
3125-
"marginBottom": undefined,
3126-
"marginLeft": undefined,
3127-
"marginRight": undefined,
3128-
"marginTop": undefined,
3158+
"flex": 1,
3159+
"marginTop": 0,
31293160
"paddingBottom": 11,
3130-
"paddingLeft": 11,
3131-
"paddingRight": 11,
3132-
"paddingTop": 11,
3161+
"paddingHorizontal": 11,
31333162
}
31343163
}
31353164
>
@@ -3170,7 +3199,7 @@ exports[`TransactionDetailsScene should render with negative nativeAmount and fi
31703199
"reduceMotionV": "system",
31713200
}
31723201
}
3173-
nativeID="11"
3202+
nativeID="12"
31743203
>
31753204
<View
31763205
style={
@@ -3390,6 +3419,45 @@ exports[`TransactionDetailsScene should render with negative nativeAmount and fi
33903419
</View>
33913420
</View>
33923421
</View>
3422+
<View
3423+
collapsable={false}
3424+
entering={
3425+
FadeInDown {
3426+
"build": [Function],
3427+
"delayV": 0,
3428+
"durationV": 300,
3429+
"easingV": [Function],
3430+
"initialValues": {
3431+
"transform": [
3432+
{
3433+
"translateY": 80,
3434+
},
3435+
],
3436+
},
3437+
"randomizeDelay": false,
3438+
"reduceMotionV": "system",
3439+
}
3440+
}
3441+
jestAnimatedProps={
3442+
{
3443+
"value": {},
3444+
}
3445+
}
3446+
jestAnimatedStyle={
3447+
{
3448+
"value": {},
3449+
}
3450+
}
3451+
layout={
3452+
LinearTransition {
3453+
"build": [Function],
3454+
"durationV": 300,
3455+
"randomizeDelay": false,
3456+
"reduceMotionV": "system",
3457+
}
3458+
}
3459+
nativeID="13"
3460+
/>
33933461
<View
33943462
collapsable={false}
33953463
entering={
@@ -3427,7 +3495,7 @@ exports[`TransactionDetailsScene should render with negative nativeAmount and fi
34273495
"reduceMotionV": "system",
34283496
}
34293497
}
3430-
nativeID="12"
3498+
nativeID="14"
34313499
>
34323500
<View
34333501
style={
@@ -4205,7 +4273,7 @@ exports[`TransactionDetailsScene should render with negative nativeAmount and fi
42054273
"reduceMotionV": "system",
42064274
}
42074275
}
4208-
nativeID="13"
4276+
nativeID="15"
42094277
>
42104278
<View
42114279
style={
@@ -4629,7 +4697,7 @@ exports[`TransactionDetailsScene should render with negative nativeAmount and fi
46294697
"reduceMotionV": "system",
46304698
}
46314699
}
4632-
nativeID="14"
4700+
nativeID="16"
46334701
/>
46344702
<View
46354703
collapsable={false}
@@ -4668,7 +4736,7 @@ exports[`TransactionDetailsScene should render with negative nativeAmount and fi
46684736
"reduceMotionV": "system",
46694737
}
46704738
}
4671-
nativeID="15"
4739+
nativeID="17"
46724740
/>
46734741
<View
46744742
collapsable={false}
@@ -4707,7 +4775,7 @@ exports[`TransactionDetailsScene should render with negative nativeAmount and fi
47074775
"reduceMotionV": "system",
47084776
}
47094777
}
4710-
nativeID="16"
4778+
nativeID="18"
47114779
>
47124780
<View
47134781
style={
@@ -4949,7 +5017,7 @@ exports[`TransactionDetailsScene should render with negative nativeAmount and fi
49495017
"reduceMotionV": "system",
49505018
}
49515019
}
4952-
nativeID="17"
5020+
nativeID="19"
49535021
>
49545022
<View
49555023
style={
@@ -5562,7 +5630,7 @@ exports[`TransactionDetailsScene should render with negative nativeAmount and fi
55625630
"reduceMotionV": "system",
55635631
}
55645632
}
5565-
nativeID="18"
5633+
nativeID="20"
55665634
>
55675635
<View
55685636
absolute={false}
@@ -5760,7 +5828,7 @@ exports[`TransactionDetailsScene should render with negative nativeAmount and fi
57605828
},
57615829
]
57625830
}
5763-
nativeID="19"
5831+
nativeID="21"
57645832
onLayout={[Function]}
57655833
stackHeight={0}
57665834
style={

‎src/actions/CategoriesActions.ts‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -652,6 +652,16 @@ export const getTxActionDisplayInfo = (
652652
}
653653
break
654654
}
655+
case 'giftCard': {
656+
iconPluginId = action.provider.providerId
657+
payeeText = lstrings.gift_card_recipient_name
658+
edgeCategory = {
659+
category: 'expense',
660+
subcategory: action.card.name
661+
}
662+
direction = 'send'
663+
break
664+
}
655665
default:
656666
unsupported = true
657667
}

‎src/components/scenes/SendScene2.tsx‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -132,6 +132,8 @@ export interface SendScene2Params {
132132
scamWarning?: boolean
133133
}
134134
infoTiles?: Array<{ label: string; value: string }>
135+
// Custom React node rendered directly above the slider
136+
sliderTopNode?: React.ReactNode
135137
fioPendingRequest?: FioRequest
136138
onBack?: () => void
137139
onDone?: (
@@ -201,6 +203,7 @@ const SendComponent = (props: Props): React.ReactElement => {
201203
minNativeAmount: initMinNativeAmount,
202204
openCamera = false,
203205
infoTiles,
206+
sliderTopNode,
204207
lockTilesMap = {},
205208
hiddenFeaturesMap = {},
206209
onDone,
@@ -1755,6 +1758,7 @@ const SendComponent = (props: Props): React.ReactElement => {
17551758
</EdgeAnim>
17561759
{renderPendingTransactionWarning()}
17571760
{renderError()}
1761+
{sliderTopNode}
17581762
</StyledKeyboardAwareScrollView>
17591763
<StyledSliderView
17601764
hasNotifications={hasNotifications}

‎src/components/scenes/TransactionDetailsScene.tsx‎

Lines changed: 16 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -45,6 +45,7 @@ import { SceneButtons } from '../buttons/SceneButtons'
4545
import { AdvancedDetailsCard } from '../cards/AdvancedDetailsCard'
4646
import { EdgeCard } from '../cards/EdgeCard'
4747
import { FiatExchangeDetailsCard } from '../cards/FiatExchangeDetailsCard'
48+
import { GiftCardDetailsCard } from '../cards/GiftCardDetailsCard'
4849
import { SwapDetailsCard } from '../cards/SwapDetailsCard'
4950
import type { AccentColors } from '../common/DotsBackground'
5051
import { EdgeAnim } from '../common/EdgeAnim'
@@ -100,6 +101,10 @@ export const TransactionDetailsComponent: React.FC<Props> = props => {
100101

101102
const thumbnailPath =
102103
useContactThumbnail(mergedData.name) ?? pluginIdIcons[iconPluginId ?? '']
104+
105+
// Check if this is a gift card transaction
106+
const giftCardAction =
107+
action != null && action.actionType === 'giftCard' ? action : undefined
103108
const iconSource = React.useMemo(
104109
() => ({ uri: thumbnailPath }),
105110
[thumbnailPath]
@@ -309,8 +314,9 @@ export const TransactionDetailsComponent: React.FC<Props> = props => {
309314
walletId
310315
})
311316
}
312-
} catch (err: any) {
313-
if (err?.message === 'transaction underpriced') {
317+
} catch (err: unknown) {
318+
const message = err instanceof Error ? err.message : undefined
319+
if (message === 'transaction underpriced') {
314320
const newAcceleratedTx = await wallet.accelerate(acceleratedTx)
315321
setAcceleratedTx(newAcceleratedTx)
316322
showError(
@@ -472,7 +478,8 @@ export const TransactionDetailsComponent: React.FC<Props> = props => {
472478
backgroundColors[0] = scaledColor
473479
}
474480

475-
const fiatAction = action?.actionType === 'fiat' ? action : undefined
481+
const fiatAction =
482+
action != null && action.actionType === 'fiat' ? action : undefined
476483

477484
return (
478485
<SceneWrapper
@@ -509,6 +516,12 @@ export const TransactionDetailsComponent: React.FC<Props> = props => {
509516
</EdgeCard>
510517
</EdgeAnim>
511518

519+
<EdgeAnim enter={{ type: 'fadeInDown', distance: 80 }}>
520+
{giftCardAction == null ? null : (
521+
<GiftCardDetailsCard action={giftCardAction} />
522+
)}
523+
</EdgeAnim>
524+
512525
<EdgeAnim enter={{ type: 'fadeInUp', distance: 40 }}>
513526
<EdgeCard sections>
514527
<TxCryptoAmountRow transaction={transaction} wallet={wallet} />

‎src/constants/MerchantContacts.ts‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -125,5 +125,9 @@ export const MERCHANT_CONTACTS: MerchantContact[] = [
125125
{
126126
displayName: 'Rango Exchange',
127127
thumbnailPath: `${EDGE_CONTENT_SERVER_URI}/rango.png`
128+
},
129+
{
130+
displayName: 'Phaze Gift Card',
131+
thumbnailPath: `${EDGE_CONTENT_SERVER_URI}/phaze.png`
128132
}
129133
]

0 commit comments

Comments
 (0)