Skip to content

Commit 0e65767

Browse files
authored
Merge pull request #968 from topcoder-platform/feat/wallet-admin
fix: filter payment listing by handle
2 parents 0f60a05 + 06c3251 commit 0e65767

File tree

9 files changed

+96
-14
lines changed

9 files changed

+96
-14
lines changed

src/apps/wallet-admin/src/home/tabs/payments/PaymentsTab.tsx

Lines changed: 18 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ import { Winning, WinningDetail } from '../../../lib/models/WinningDetail'
1010
import { FilterBar } from '../../../lib'
1111
import { ConfirmFlowData } from '../../../lib/models/ConfirmFlowData'
1212
import { PaginationInfo } from '../../../lib/models/PaginationInfo'
13+
import PaymentEditForm from '../../../lib/components/payment-edit/PaymentEdit'
1314
import PaymentsTable from '../../../lib/components/payments-table/PaymentTable'
1415

1516
import styles from './Payments.module.scss'
@@ -72,6 +73,7 @@ const formatCurrency = (amountStr: string, currency: string): string => {
7273
// eslint-disable-next-line @typescript-eslint/no-unused-vars
7374
const ListView: FC<ListViewProps> = (props: ListViewProps) => {
7475
const [confirmFlow, setConfirmFlow] = React.useState<ConfirmFlowData | undefined>(undefined)
76+
const [isConfirmFormValid, setIsConfirmFormValid] = React.useState<boolean>(false)
7577
const [winnings, setWinnings] = React.useState<ReadonlyArray<Winning>>([])
7678
const [selectedPayments, setSelectedPayments] = React.useState<{ [paymentId: string]: Winning }>({})
7779
const [isLoading, setIsLoading] = React.useState<boolean>(false)
@@ -106,7 +108,6 @@ const ListView: FC<ListViewProps> = (props: ListViewProps) => {
106108
}
107109

108110
return {
109-
canBeReleased: new Date(payment.releaseDate) <= new Date() && payment.details[0].status === 'OWED',
110111
createDate: formatIOSDateString(payment.createdAt),
111112
currency: payment.details[0].currency,
112113
datePaid: payment.details[0].datePaid ? formatIOSDateString(payment.details[0].datePaid) : '-',
@@ -319,17 +320,21 @@ const ListView: FC<ListViewProps> = (props: ListViewProps) => {
319320
currentPage: pageNumber,
320321
})
321322
}}
322-
// onPayMeClick={async function onPayMeClicked(
323-
// paymentIds: { [paymentId: string]: Winning },
324-
// totalAmount: string,
325-
// ) {
326-
// setConfirmFlow({
327-
// action: 'Yes',
328-
// callback: () => processPayouts(Object.keys(paymentIds)),
329-
// content: `You are about to process payments for a total of USD ${totalAmount}`,
330-
// title: 'Are you sure?',
331-
// })
332-
// }}
323+
onPaymentEditClick={function onPaymentEditClicked(payment: Winning) {
324+
setConfirmFlow({
325+
action: 'Save',
326+
callback: () => console.log('Edit payment:', payment),
327+
content: (
328+
<PaymentEditForm
329+
payment={payment}
330+
onErrorStateChanged={function onErrorStateChanged(error: boolean) {
331+
setIsConfirmFormValid(!error)
332+
}}
333+
/>
334+
),
335+
title: 'Edit Payment',
336+
})
337+
}}
333338
/>
334339
)}
335340
{!isLoading && winnings.length === 0 && (
@@ -355,6 +360,7 @@ const ListView: FC<ListViewProps> = (props: ListViewProps) => {
355360
confirmFlow.callback?.()
356361
setConfirmFlow(undefined)
357362
}}
363+
canSave={isConfirmFormValid}
358364
open={confirmFlow !== undefined}
359365
>
360366
<div>{renderConfirmModalContent}</div>

src/apps/wallet-admin/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 './payment-edit'

src/apps/wallet-admin/src/lib/components/payment-edit/PaymentEdit.module.scss

Whitespace-only changes.
Lines changed: 64 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,64 @@
1+
/* eslint-disable react/jsx-no-bind */
2+
import React, { useEffect, useState } from 'react'
3+
4+
import { Winning } from '../../models/WinningDetail'
5+
6+
interface PaymentEditFormProps {
7+
payment: Winning;
8+
onErrorStateChanged: (error: boolean) => void;
9+
}
10+
11+
const PaymentEditForm: React.FC<PaymentEditFormProps> = (props: PaymentEditFormProps) => {
12+
const [formData, setFormData] = useState({
13+
description: props.payment.description || '',
14+
})
15+
const [errors, setErrors] = useState<any>({})
16+
17+
useEffect(() => {
18+
const validateForm = (): boolean => {
19+
let formIsValid = true
20+
const validationErrors: { [key: string]: string } = {}
21+
22+
if (!formData.description) {
23+
formIsValid = false
24+
validationErrors.description = 'Description is required.'
25+
}
26+
27+
setErrors(validationErrors)
28+
props.onErrorStateChanged(!formIsValid)
29+
30+
return formIsValid
31+
}
32+
33+
setFormData({
34+
description: props.payment.description || '',
35+
})
36+
37+
validateForm()
38+
}, [props.payment, formData, props.onErrorStateChanged, props])
39+
40+
const handleChange = (e: React.ChangeEvent<HTMLInputElement>): void => {
41+
const { name, value } : {
42+
name: string;
43+
value: string;
44+
} = e.target
45+
46+
setFormData(prevState => ({
47+
...prevState,
48+
[name]: value,
49+
}))
50+
}
51+
52+
return (
53+
<form>
54+
<div>
55+
<label>Description</label>
56+
<input name='description' value={formData.description} onChange={handleChange} />
57+
{errors.description && <p>{errors.description}</p>}
58+
</div>
59+
</form>
60+
)
61+
62+
}
63+
64+
export default PaymentEditForm
Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
export { default as PaymentEdit } from './PaymentEdit'

src/apps/wallet-admin/src/lib/components/payments-table/PaymentTable.tsx

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ interface PaymentTableProps {
1313
selectedPayments?: { [paymentId: string]: Winning };
1414
currentPage: number;
1515
numPages: number;
16+
onPaymentEditClick: (payment: Winning) => void;
1617
onNextPageClick: () => void;
1718
onPreviousPageClick: () => void;
1819
onPageClick: (pageNumber: number) => void;
@@ -58,8 +59,10 @@ const PaymentsTable: React.FC<PaymentTableProps> = (props: PaymentTableProps) =>
5859
<td>
5960
{payment.status.toUpperCase() !== 'PAID' && (
6061
<Button
62+
disabled
6163
icon={IconOutline.PencilIcon}
6264
size='sm'
65+
onClick={() => props.onPaymentEditClick(payment)}
6366
/>
6467
)}
6568
</td>

src/apps/wallet-admin/src/lib/models/WinningDetail.ts

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,6 @@ export interface Winning {
1919
status: string
2020
releaseDate: string
2121
datePaid: string
22-
canBeReleased: boolean
2322
currency: string
2423
details: PaymentDetail[]
2524
}

src/apps/wallet-admin/src/lib/services/wallet.ts

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -57,12 +57,18 @@ export async function getPayments(limit: number, offset: number, filters: Record
5757
}
5858
}
5959

60-
const payload = {
60+
const payload: {
61+
limit: number, offset: number, winnerIds?: string[], [key: string]: string | number | string[] | undefined
62+
} = {
6163
limit,
6264
offset,
6365
...filteredFilters,
6466
}
6567

68+
if (filters.winnerIds && filters.winnerIds.length > 0) {
69+
payload.winnerIds = filters.winnerIds
70+
}
71+
6672
const body = JSON.stringify(payload)
6773

6874
const url = `${baseUrl}/admin/winnings/search`

src/libs/ui/lib/components/modals/confirm/ConfirmModal.tsx

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ export interface ConfirmModalProps extends ModalProps {
88
action?: string
99
onConfirm: () => void
1010
title: string
11+
canSave?: boolean
1112
}
1213

1314
const ConfirmModal: FC<ConfirmModalProps> = (props: ConfirmModalProps) => (
@@ -24,6 +25,7 @@ const ConfirmModal: FC<ConfirmModalProps> = (props: ConfirmModalProps) => (
2425
tabIndex={1}
2526
/>
2627
<Button
28+
disabled={props.canSave === false}
2729
primary
2830
label={props.action || 'Confirm'}
2931
onClick={props.onConfirm}

0 commit comments

Comments
 (0)