Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 | 52x 80x 80x 80x 80x 80x 80x 80x 80x 74x 1x 73x 73x 73x 73x 80x 80x | import { WarningIcon } from "@phosphor-icons/react";
import GiveAlert from "@shared/GiveAlert/GiveAlert";
import { checkPortals } from "@utils/routing";
import { useMemo } from "react";
type Props = {
data: any; // TODO: add the type
};
const TransactionWarningAlert = ({ data }: Props) => {
const {
status,
isBlocked,
isFalsePositive,
displayType,
displayStatus,
originalTransactionIsBlocked,
blockedReason,
originalTransactionBlockReason,
declinedReason,
errorReason,
} = data || {};
const isRefund = status === "Refunded";
const isMarkAsFraud = isBlocked;
const isTransfer = displayType === "Money Transfer";
const isDeclinedTransfer = isTransfer && displayStatus === "Declined";
const isErrorTransfer = isTransfer && displayStatus === "Error";
const { isMerchantPortal } = checkPortals();
const { title, message } = useMemo(() => {
if (isRefund && originalTransactionIsBlocked)
return {
title: "Refund Issued",
message: originalTransactionBlockReason,
};
Iif (isMarkAsFraud)
return {
title: "Suspected",
message: blockedReason,
};
Iif (isDeclinedTransfer && declinedReason)
return {
title: "Declined Transfer",
message: `Reason: "${declinedReason}"`,
};
Iif (isErrorTransfer && errorReason)
return {
title: "Error",
message: `Reason: "${errorReason}"`,
};
return { title: "", message: "" };
}, [isRefund, originalTransactionIsBlocked, data]);
const showWarningInfo =
isMarkAsFraud && !isFalsePositive && !isMerchantPortal;
Eif (!showWarningInfo || !title) return null;
return (
<GiveAlert
withBorder
type="warning"
label={title}
description={message}
variant="alert"
Icon={<WarningIcon size={20} />}
/>
);
};
export default TransactionWarningAlert;
|