Skip to content

Redirect payment settings to wallet app, and Lint cleanup #981

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 4 commits into from
Sep 3, 2024
Merged

Redirect payment settings to wallet app, and Lint cleanup #981

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
7ff7622
Add Processing to status drop down filter (CORE-635)
jmgasper Jul 10, 2024
8ac7844
Merge branch 'dev' of github.com:topcoder-platform/platform-ui into dev
jmgasper Aug 26, 2024
d0449da
Lint cleanup and typo
jmgasper Aug 26, 2024
c6c1c2e
Redirect 'Payments' tab to wallet
jmgasper Aug 26, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -118,7 +118,7 @@
"shortid": "^2.2.16",
"styled-components": "^5.3.6",
"swr": "^1.3.0",
"tc-auth-lib": "topcoder-platform/tc-auth-lib#1.0.26",
"tc-auth-lib": "topcoder-platform/tc-auth-lib#1.0.27",
"turndown": "^4.0.2",
"typescript": "^4.8.4",
"universal-navigation": "https://github.com/topcoder-platform/universal-navigation#9fc50d938be7182",
Expand Down
16 changes: 8 additions & 8 deletions src/apps/accounts/src/settings/tabs/AccountSettingsTabs.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,13 +2,13 @@ import { Dispatch, FC, SetStateAction, useMemo, useState } from 'react'
import { useLocation } from 'react-router-dom'
import { KeyedMutator } from 'swr'

import { EnvironmentConfig } from '~/config'
import { useMemberTraits, UserProfile, UserTraits } from '~/libs/core'
import { PageTitle, TabsNavbar, TabsNavItem } from '~/libs/ui'

import { AccountSettingsTabsConfig, AccountSettingsTabViews, getHashFromTabId, getTabIdFromHash } from './config'
import { AccountTab } from './account'
import { PreferencesTab } from './preferences'
import { PaymentsTab } from './payments'
import { ToolsTab } from './tools'
import { TCandYouTab } from './tcandyou'
import styles from './AccountSettingsTabs.module.scss'
Expand All @@ -31,9 +31,13 @@ const AccountSettingsTabs: FC<AccountSettingsTabsProps> = (props: AccountSetting
} = useMemberTraits(props.profile.handle)

function handleTabChange(tabId: string): void {
setActiveTab(tabId)
window.location.hash = getHashFromTabId(tabId)
mutateTraits() // mutate member traits to refresh the data
if (tabId === AccountSettingsTabViews.payment) {
window.location.href = `https://wallet.${EnvironmentConfig.TC_DOMAIN}`
} else {
setActiveTab(tabId)
window.location.hash = getHashFromTabId(tabId)
mutateTraits() // mutate member traits to refresh the data
}
}

return (
Expand Down Expand Up @@ -66,10 +70,6 @@ const AccountSettingsTabs: FC<AccountSettingsTabsProps> = (props: AccountSetting
{activeTab === AccountSettingsTabViews.preferences && (
<PreferencesTab profile={props.profile} />
)}

{activeTab === AccountSettingsTabViews.payment && (
<PaymentsTab profile={props.profile} />
)}
</div>
)
}
Expand Down
217 changes: 106 additions & 111 deletions src/apps/wallet-admin/src/lib/components/payment-view/PaymentView.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -110,7 +110,12 @@ const PaymentView: React.FC<PaymentViewProps> = (props: PaymentViewProps) => {

<div className={styles.infoItem}>
<span className={styles.label}>Net Payment</span>
<p className={styles.value}>{props.payment.netPaymentNumber.toLocaleString(undefined, { currency: 'USD', style: 'currency' })}</p>
<p className={styles.value}>
{props.payment.netPaymentNumber.toLocaleString(undefined, {
currency: 'USD',
style: 'currency',
})}
</p>
</div>

<div className={styles.infoItem}>
Expand All @@ -124,18 +129,14 @@ const PaymentView: React.FC<PaymentViewProps> = (props: PaymentViewProps) => {
</div>

{props.payment.datePaid !== '-' && (
(
<div className={styles.infoItem}>
<span className={styles.label}>Date Paid</span>
<p className={styles.value}>{props.payment.datePaid}</p>
</div>
))}
<div className={styles.infoItem}>
<span className={styles.label}>Date Paid</span>
<p className={styles.value}>{props.payment.datePaid}</p>
</div>
)}

<div className={styles.infoItem}>
<Button
onClick={() => handleToggleView('audit')}
label='View Audit'
/>
<Button onClick={() => handleToggleView('audit')} label='View Audit' />
{props.payment.status.toUpperCase() === 'PAID' && (
<Button
onClick={() => handleToggleView('external_transaction')}
Expand All @@ -149,127 +150,121 @@ const PaymentView: React.FC<PaymentViewProps> = (props: PaymentViewProps) => {
{view === 'audit' && (
<>
<div className={styles.auditSection}>
{auditLines && auditLines.length > 0 && auditLines.map(line => (
<Collapsible
key={line.id}
header={(
<h3>
{
new Date(line.createdAt)
.toLocaleString()
}
</h3>
)}
containerClass={styles.container}
contentClass={styles.content}
>
<div className={styles.auditItem}>
<div>
<p>
<strong>User:</strong>
{' '}
{line.userId}
</p>
<p>
<strong>Action:</strong>
{' '}
{formatAction(line.action)}
</p>
<p>
<strong>Note:</strong>
{' '}
{line.note}
</p>
</div>
</div>
</Collapsible>
))}
{(auditLines === undefined || auditLines.length === 0)
&& (
<div className={styles.auditItem}>
<p>No audit data available</p>
</div>
)}
</div>
<div className={styles.infoItem}>
<Button
onClick={() => handleToggleView('details')}
label='Back to Details'
/>
</div>
</>
)}

{view === 'external_transaction' && (
<>
<div className={styles.auditSection}>
{externalTransactionAudit && externalTransactionAudit.length > 0 && externalTransactionAudit.map((externalTransaction: PayoutAudit, index: number) => (
<>
{auditLines
&& auditLines.length > 0
&& auditLines.map(line => (
<Collapsible
key={`internal-record${index}`}
header={(
<h3>Internal Record</h3>
)}
key={line.id}
header={
(
<h3>
{
new Date(line.createdAt)
.toLocaleString()
}
</h3>
)
}
containerClass={styles.container}
contentClass={styles.content}
>
<div className={styles.auditItem}>
<div>
<p>
<strong>Provider Used:</strong>
{' '}
{externalTransaction.paymentMethodUsed}
<strong>User:</strong>
{line.userId}
</p>
<p>
<strong>Status:</strong>
{' '}
{externalTransaction.status}
<strong>Action:</strong>
{formatAction(line.action)}
</p>
<p>
<strong>Processed At:</strong>
{' '}
{externalTransaction.createdAt}
<strong>Note:</strong>
{line.note}
</p>
<p>
<strong>Totl Amount Processed:</strong>
{' '}
{externalTransaction.totalNetAmount}
</p>
</div>
</div>
</Collapsible>
<Collapsible
key={`external-record${index}`}
header={(
<h3>External Record</h3>
)}
containerClass={styles.container}
contentClass={styles.content}
>
<div className={styles.auditItem}>
<div>
<pre>{JSON.stringify(externalTransaction.externalTransactionDetails, undefined, 2)}</pre>
</div>
</div>
</Collapsible>
</>
))}
{(externalTransactionAudit === undefined)
&& (
<div className={styles.auditItem}>
<p>No external transaction data is available</p>
</div>
)}
))}
{(auditLines === undefined || auditLines.length === 0) && (
<div className={styles.auditItem}>
<p>No audit data available</p>
</div>
)}
</div>
<div className={styles.infoItem}>
<Button
onClick={() => handleToggleView('details')}
label='Back to Details'
/>
<Button onClick={() => handleToggleView('details')} label='Back to Details' />
</div>
</>
)}

{view === 'external_transaction' && (
<>
<div className={styles.auditSection}>
{externalTransactionAudit
&& externalTransactionAudit.length > 0
&& externalTransactionAudit.map((externalTransaction: PayoutAudit, index: number) => (
<>
<Collapsible
key={`internal-record${index}`}
header={<h3>Internal Record</h3>}
containerClass={styles.container}
contentClass={styles.content}
>
<div className={styles.auditItem}>
<div>
<p>
<strong>Provider Used:</strong>
{' '}
{externalTransaction.paymentMethodUsed}
</p>
<p>
<strong>Status:</strong>
{externalTransaction.status}
</p>
<p>
<strong>Processed At:</strong>
{externalTransaction.createdAt}
</p>
<p>
<strong>Total Amount Processed:</strong>
{' '}
{externalTransaction.totalNetAmount}
</p>
</div>
</div>
</Collapsible>
<Collapsible
key={`external-record${index}`}
header={<h3>External Record</h3>}
containerClass={styles.container}
contentClass={styles.content}
>
<div className={styles.auditItem}>
<div>
<pre>
{JSON.stringify(
externalTransaction.externalTransactionDetails,
undefined,
2,
)}
</pre>
</div>
</div>
</Collapsible>
</>
))}
{externalTransactionAudit === undefined && (
<div className={styles.auditItem}>
<p>No external transaction data is available</p>
</div>
)}
</div>
<div className={styles.infoItem}>
<Button onClick={() => handleToggleView('details')} label='Back to Details' />
</div>
</>
)}
</div>
</div>
)
Expand Down
4 changes: 2 additions & 2 deletions yarn.lock
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18449,9 +18449,9 @@ tar@^6.1.13:
mkdirp "^1.0.3"
yallist "^4.0.0"

tc-auth-lib@topcoder-platform/tc-auth-lib#1.0.26:
tc-auth-lib@topcoder-platform/tc-auth-lib#1.0.27:
version "1.0.2"
resolved "https://codeload.github.com/topcoder-platform/tc-auth-lib/tar.gz/3e1b78473b421327c492a814df3f6c72f17e860f"
resolved "https://codeload.github.com/topcoder-platform/tc-auth-lib/tar.gz/dc5b3a29ac3b8e2a0f386fce411c6533c2f33f05"
dependencies:
lodash "^4.17.19"

Expand Down