Skip to content

Commit 7ff7622

Browse files
jmgasperjmgasper
committed
Add Processing to status drop down filter (CORE-635)
1 parent ccb85cc commit 7ff7622

File tree

2 files changed

+92
-114
lines changed

2 files changed

+92
-114
lines changed

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

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -37,6 +37,8 @@ function formatStatus(status: string): string {
3737
return 'Paid'
3838
case 'CANCELLED':
3939
return 'Cancel'
40+
case 'PROCESSING':
41+
return 'Processing'
4042
default:
4143
return status.replaceAll('_', ' ')
4244
}
@@ -354,7 +356,7 @@ const ListView: FC<ListViewProps> = (props: ListViewProps) => {
354356
},
355357
{
356358
label: 'Processing',
357-
value: 'Processing',
359+
value: 'PROCESSING',
358360
},
359361
],
360362
type: 'dropdown',

‎src/apps/wallet-admin/src/lib/components/payment-view/PaymentView.tsx‎

Lines changed: 89 additions & 113 deletions
Original file line numberDiff line numberDiff line change
@@ -110,7 +110,12 @@ const PaymentView: React.FC<PaymentViewProps> = (props: PaymentViewProps) => {
110110

111111
<div className={styles.infoItem}>
112112
<span className={styles.label}>Net Payment</span>
113-
<p className={styles.value}>{props.payment.netPaymentNumber.toLocaleString(undefined, { currency: 'USD', style: 'currency' })}</p>
113+
<p className={styles.value}>
114+
{props.payment.netPaymentNumber.toLocaleString(undefined, {
115+
currency: 'USD',
116+
style: 'currency',
117+
})}
118+
</p>
114119
</div>
115120

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

126131
{props.payment.datePaid !== '-' && (
127-
(
128-
<div className={styles.infoItem}>
129-
<span className={styles.label}>Date Paid</span>
130-
<p className={styles.value}>{props.payment.datePaid}</p>
131-
</div>
132-
))}
132+
<div className={styles.infoItem}>
133+
<span className={styles.label}>Date Paid</span>
134+
<p className={styles.value}>{props.payment.datePaid}</p>
135+
</div>
136+
)}
133137

134138
<div className={styles.infoItem}>
135-
<Button
136-
onClick={() => handleToggleView('audit')}
137-
label='View Audit'
138-
/>
139+
<Button onClick={() => handleToggleView('audit')} label='View Audit' />
139140
{props.payment.status.toUpperCase() === 'PAID' && (
140141
<Button
141142
onClick={() => handleToggleView('external_transaction')}
@@ -149,127 +150,102 @@ const PaymentView: React.FC<PaymentViewProps> = (props: PaymentViewProps) => {
149150
{view === 'audit' && (
150151
<>
151152
<div className={styles.auditSection}>
152-
{auditLines && auditLines.length > 0 && auditLines.map(line => (
153-
<Collapsible
154-
key={line.id}
155-
header={(
156-
<h3>
157-
{
158-
new Date(line.createdAt)
159-
.toLocaleString()
160-
}
161-
</h3>
162-
)}
163-
containerClass={styles.container}
164-
contentClass={styles.content}
165-
>
166-
<div className={styles.auditItem}>
167-
<div>
168-
<p>
169-
<strong>User:</strong>
170-
{' '}
171-
{line.userId}
172-
</p>
173-
<p>
174-
<strong>Action:</strong>
175-
{' '}
176-
{formatAction(line.action)}
177-
</p>
178-
<p>
179-
<strong>Note:</strong>
180-
{' '}
181-
{line.note}
182-
</p>
183-
</div>
184-
</div>
185-
</Collapsible>
186-
))}
187-
{(auditLines === undefined || auditLines.length === 0)
188-
&& (
189-
<div className={styles.auditItem}>
190-
<p>No audit data available</p>
191-
</div>
192-
)}
193-
</div>
194-
<div className={styles.infoItem}>
195-
<Button
196-
onClick={() => handleToggleView('details')}
197-
label='Back to Details'
198-
/>
199-
</div>
200-
</>
201-
)}
202-
203-
{view === 'external_transaction' && (
204-
<>
205-
<div className={styles.auditSection}>
206-
{externalTransactionAudit && externalTransactionAudit.length > 0 && externalTransactionAudit.map((externalTransaction: PayoutAudit, index: number) => (
207-
<>
153+
{auditLines &&
154+
auditLines.length > 0 &&
155+
auditLines.map((line) => (
208156
<Collapsible
209-
key={`internal-record${index}`}
210-
header={(
211-
<h3>Internal Record</h3>
212-
)}
157+
key={line.id}
158+
header={<h3>{new Date(line.createdAt).toLocaleString()}</h3>}
213159
containerClass={styles.container}
214-
contentClass={styles.content}
215-
>
160+
contentClass={styles.content}>
216161
<div className={styles.auditItem}>
217162
<div>
218163
<p>
219-
<strong>Provider Used:</strong>
220-
{' '}
221-
{externalTransaction.paymentMethodUsed}
222-
</p>
223-
<p>
224-
<strong>Status:</strong>
225-
{' '}
226-
{externalTransaction.status}
164+
<strong>User:</strong> {line.userId}
227165
</p>
228166
<p>
229-
<strong>Processed At:</strong>
230-
{' '}
231-
{externalTransaction.createdAt}
167+
<strong>Action:</strong> {formatAction(line.action)}
232168
</p>
233169
<p>
234-
<strong>Totl Amount Processed:</strong>
235-
{' '}
236-
{externalTransaction.totalNetAmount}
170+
<strong>Note:</strong> {line.note}
237171
</p>
238172
</div>
239173
</div>
240174
</Collapsible>
241-
<Collapsible
242-
key={`external-record${index}`}
243-
header={(
244-
<h3>External Record</h3>
245-
)}
246-
containerClass={styles.container}
247-
contentClass={styles.content}
248-
>
249-
<div className={styles.auditItem}>
250-
<div>
251-
<pre>{JSON.stringify(externalTransaction.externalTransactionDetails, undefined, 2)}</pre>
252-
</div>
253-
</div>
254-
</Collapsible>
255-
</>
256-
))}
257-
{(externalTransactionAudit === undefined)
258-
&& (
259-
<div className={styles.auditItem}>
260-
<p>No external transaction data is available</p>
261-
</div>
262-
)}
175+
))}
176+
{(auditLines === undefined || auditLines.length === 0) && (
177+
<div className={styles.auditItem}>
178+
<p>No audit data available</p>
179+
</div>
180+
)}
263181
</div>
264182
<div className={styles.infoItem}>
265-
<Button
266-
onClick={() => handleToggleView('details')}
267-
label='Back to Details'
268-
/>
183+
<Button onClick={() => handleToggleView('details')} label='Back to Details' />
269184
</div>
270185
</>
271186
)}
272187

188+
{view === 'external_transaction' && (
189+
<>
190+
<div className={styles.auditSection}>
191+
{externalTransactionAudit &&
192+
externalTransactionAudit.length > 0 &&
193+
externalTransactionAudit.map((externalTransaction: PayoutAudit, index: number) => (
194+
<>
195+
<Collapsible
196+
key={`internal-record${index}`}
197+
header={<h3>Internal Record</h3>}
198+
containerClass={styles.container}
199+
contentClass={styles.content}>
200+
<div className={styles.auditItem}>
201+
<div>
202+
<p>
203+
<strong>Provider Used:</strong>{' '}
204+
{externalTransaction.paymentMethodUsed}
205+
</p>
206+
<p>
207+
<strong>Status:</strong> {externalTransaction.status}
208+
</p>
209+
<p>
210+
<strong>Processed At:</strong> {externalTransaction.createdAt}
211+
</p>
212+
<p>
213+
<strong>Totl Amount Processed:</strong>{' '}
214+
{externalTransaction.totalNetAmount}
215+
</p>
216+
</div>
217+
</div>
218+
</Collapsible>
219+
<Collapsible
220+
key={`external-record${index}`}
221+
header={<h3>External Record</h3>}
222+
containerClass={styles.container}
223+
contentClass={styles.content}>
224+
<div className={styles.auditItem}>
225+
<div>
226+
<pre>
227+
{JSON.stringify(
228+
externalTransaction.externalTransactionDetails,
229+
undefined,
230+
2,
231+
)}
232+
</pre>
233+
</div>
234+
</div>
235+
</Collapsible>
236+
</>
237+
))}
238+
{externalTransactionAudit === undefined && (
239+
<div className={styles.auditItem}>
240+
<p>No external transaction data is available</p>
241+
</div>
242+
)}
243+
</div>
244+
<div className={styles.infoItem}>
245+
<Button onClick={() => handleToggleView('details')} label='Back to Details' />
246+
</div>
247+
</>
248+
)}
273249
</div>
274250
</div>
275251
)

0 commit comments

Comments
 (0)