Skip to content

Commit f441a4c

Browse files
vas3avas3a
authored
Merge pull request #1084 from topcoder-platform/PM-1257_handle-wipro-users-payout
PM-1257 - hide payout tab & setup details for wipro users
2 parents 60907db + 7a38343 commit f441a4c

File tree

5 files changed

+104
-59
lines changed

5 files changed

+104
-59
lines changed

‎src/apps/wallet/src/home/tabs/WalletTabs.tsx‎

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,9 @@ import { useLocation } from 'react-router-dom'
44
import { UserProfile } from '~/libs/core'
55
import { PageTitle, TabsNavbar, TabsNavItem } from '~/libs/ui'
66

7+
import { PayoutGuard } from '../../lib'
8+
import { useCanViewPayout } from '../../lib/hooks/use-can-view-payout'
9+
710
import { getHashFromTabId, getTabIdFromHash, WalletTabsConfig, WalletTabViews } from './config'
811
import { WinningsTab } from './winnings'
912
import { HomeTab } from './home'
@@ -16,12 +19,17 @@ interface WalletHomeProps {
1619

1720
const WalletTabs: FC<WalletHomeProps> = (props: WalletHomeProps) => {
1821
const { hash }: { hash: string } = useLocation()
22+
const canViewPayout = useCanViewPayout(props.profile)
1923

2024
const activeTabHash: WalletTabViews = useMemo<WalletTabViews>(() => getTabIdFromHash(hash), [hash])
2125

2226
const [activeTab, setActiveTab]: [WalletTabViews, Dispatch<SetStateAction<WalletTabViews>>]
2327
= useState<WalletTabViews>(activeTabHash)
2428

29+
const tabsConfig = useMemo(() => WalletTabsConfig.filter(tab => (
30+
tab.id !== WalletTabViews.payout || canViewPayout
31+
)), [canViewPayout])
32+
2533
useEffect(() => {
2634
setActiveTab(activeTabHash)
2735
}, [activeTabHash])
@@ -33,7 +41,7 @@ const WalletTabs: FC<WalletHomeProps> = (props: WalletHomeProps) => {
3341

3442
return (
3543
<div className={styles.container}>
36-
<TabsNavbar defaultActive={activeTab} onChange={handleTabChange} tabs={WalletTabsConfig} />
44+
<TabsNavbar defaultActive={activeTab} onChange={handleTabChange} tabs={tabsConfig} />
3745

3846
<PageTitle>
3947
{[
@@ -47,7 +55,9 @@ const WalletTabs: FC<WalletHomeProps> = (props: WalletHomeProps) => {
4755

4856
{activeTab === WalletTabViews.home && <HomeTab profile={props.profile} />}
4957

50-
{activeTab === WalletTabViews.payout && <PayoutTab profile={props.profile} />}
58+
<PayoutGuard profile={props.profile}>
59+
{activeTab === WalletTabViews.payout && <PayoutTab profile={props.profile} />}
60+
</PayoutGuard>
5161
</div>
5262
)
5363
}

‎src/apps/wallet/src/home/tabs/home/HomeTab.tsx‎

Lines changed: 65 additions & 57 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import { UserProfile } from '~/libs/core'
55
import { IconOutline, LinkButton, LoadingCircles } from '~/libs/ui'
66

77
import { Balance } from '../../../lib/models/WalletDetails'
8-
import { InfoRow } from '../../../lib'
8+
import { InfoRow, PayoutGuard } from '../../../lib'
99
import { BannerImage, BannerText } from '../../../lib/assets/home'
1010
import { nullToZero } from '../../../lib/util'
1111
import { useWalletDetails, WalletDetailsResponse } from '../../../lib/hooks/use-wallet-details'
@@ -17,7 +17,8 @@ interface HomeTabProps {
1717
profile: UserProfile
1818
}
1919

20-
const HomeTab: FC<HomeTabProps> = () => {
20+
const HomeTab: FC<HomeTabProps> = props => {
21+
2122
const { data: walletDetails, isLoading, error }: WalletDetailsResponse = useWalletDetails()
2223
const [balanceSum, setBalanceSum] = useState(0)
2324

@@ -57,63 +58,70 @@ const HomeTab: FC<HomeTabProps> = () => {
5758
}
5859
/>
5960

60-
{walletDetails.withdrawalMethod.isSetupComplete && walletDetails.taxForm.isSetupComplete && (
61-
<InfoRow
62-
title='Est. Payment Fees and Tax Withholding %'
63-
// eslint-disable-next-line max-len
64-
value={`Fee: ${nullToZero(walletDetails.estimatedFees)} USD / Tax Withholding: ${nullToZero(walletDetails.taxWithholdingPercentage)}%`}
65-
action={
66-
<LinkButton
67-
label='ADJUST YOUR PAYOUT SETTINGS'
68-
iconToRight
69-
icon={IconOutline.ArrowRightIcon}
70-
size='md'
71-
link
72-
to='#payout'
73-
/>
74-
}
75-
/>
76-
)}
61+
<PayoutGuard profile={props.profile}>
62+
{walletDetails.withdrawalMethod.isSetupComplete
63+
&& walletDetails.taxForm.isSetupComplete && (
64+
<InfoRow
65+
title='Est. Payment Fees and Tax Withholding %'
66+
// eslint-disable-next-line max-len
67+
value={`Fee: ${nullToZero(walletDetails.estimatedFees)} USD / Tax Withholding: ${nullToZero(walletDetails.taxWithholdingPercentage)}%`}
68+
action={
69+
<LinkButton
70+
label='ADJUST YOUR PAYOUT SETTINGS'
71+
iconToRight
72+
icon={IconOutline.ArrowRightIcon}
73+
size='md'
74+
link
75+
to='#payout'
76+
/>
77+
}
78+
/>
79+
)}
7780

78-
{!walletDetails?.withdrawalMethod.isSetupComplete && (
79-
<InfoRow
80-
title='Withdrawal Method'
81-
value={
82-
walletDetails?.withdrawalMethod.isSetupComplete ? (
83-
'Your preferred method'
84-
) : (
85-
<Chip text='Setup Required' />
86-
)
87-
}
88-
action={
89-
<LinkButton
90-
label='SETUP WITHDRAWAL METHOD'
91-
iconToRight
92-
icon={IconOutline.ArrowRightIcon}
93-
size='md'
94-
link
95-
to='#payout'
96-
/>
97-
}
98-
/>
99-
)}
81+
{!walletDetails?.withdrawalMethod.isSetupComplete && (
82+
<InfoRow
83+
title='Withdrawal Method'
84+
value={
85+
walletDetails?.withdrawalMethod.isSetupComplete ? (
86+
'Your preferred method'
87+
) : (
88+
<Chip text='Setup Required' />
89+
)
90+
}
91+
action={
92+
<LinkButton
93+
label='SETUP WITHDRAWAL METHOD'
94+
iconToRight
95+
icon={IconOutline.ArrowRightIcon}
96+
size='md'
97+
link
98+
to='#payout'
99+
/>
100+
}
101+
/>
102+
)}
100103

101-
{!walletDetails?.taxForm.isSetupComplete && (
102-
<InfoRow
103-
title='Tax Form'
104-
value={walletDetails?.taxForm.isSetupComplete ? 'All set' : <Chip text='Setup Required' />}
105-
action={
106-
<LinkButton
107-
label='COMPLETE TAX FORM'
108-
iconToRight
109-
icon={IconOutline.ArrowRightIcon}
110-
size='md'
111-
link
112-
to='#payout'
113-
/>
114-
}
115-
/>
116-
)}
104+
{!walletDetails?.taxForm.isSetupComplete && (
105+
<InfoRow
106+
title='Tax Form'
107+
value={
108+
walletDetails?.taxForm.isSetupComplete
109+
? 'All set'
110+
: <Chip text='Setup Required' />
111+
}
112+
action={
113+
<LinkButton
114+
label='COMPLETE TAX FORM'
115+
iconToRight
116+
icon={IconOutline.ArrowRightIcon}
117+
size='md'
118+
link
119+
to='#payout'
120+
/>
121+
}
122+
/>
123+
)}
124+
</PayoutGuard>
117125
</div>
118126
)}
119127
</div>

‎src/apps/wallet/src/lib/components/index.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,3 +2,4 @@ export * from './setting-section'
22
export * from './info-row'
33
export * from './chip'
44
export * from './filter-bar'
5+
export * from './payout-guard'

‎src/apps/wallet/src/lib/components/payout-guard.tsx‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
import { FC, PropsWithChildren } from 'react'
2+
3+
import { UserProfile } from '~/libs/core'
4+
5+
import { useCanViewPayout } from '../hooks/use-can-view-payout'
6+
7+
export interface PayoutGuardProps {
8+
profile?: UserProfile
9+
}
10+
11+
export const PayoutGuard: FC<PayoutGuardProps & PropsWithChildren> = props => {
12+
const canViewPayout = useCanViewPayout(props.profile)
13+
14+
return (
15+
<>{canViewPayout && props.children}</>
16+
)
17+
}

‎src/apps/wallet/src/lib/hooks/use-can-view-payout.tsx‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
import { useMemo } from 'react'
2+
3+
import { UserProfile } from '~/libs/core'
4+
5+
export const useCanViewPayout = (profile?: UserProfile): boolean => useMemo(() => (
6+
!!profile
7+
&& !profile.email.toLowerCase()
8+
.includes('@wipro.com')
9+
), [profile])

0 commit comments

Comments
 (0)