update
This commit is contained in:
@ -155,35 +155,6 @@ const DetailTransaction = () => {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
const [formattedJson, setFormattedJson] = useState('');
|
|
||||||
const [highlightedJson, setHighlightedJson] = useState('');
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
const obj = { a: 1, 'b': 'foo', c: [false, 'false', null, 'null', { d: { e: 1.3e5, f: '1.3e5' } }] };
|
|
||||||
const str = JSON.stringify(obj, undefined, 4);
|
|
||||||
setFormattedJson(str);
|
|
||||||
setHighlightedJson(syntaxHighlight(str));
|
|
||||||
}, []);
|
|
||||||
|
|
||||||
function syntaxHighlight(json: any) {
|
|
||||||
json = json.replace(/&/g, '&').replace(/</g, '<').replace(/>/g, '>');
|
|
||||||
return json.replace(/("(\\u[a-zA-Z0-9]{4}|\\[^u]|[^\\"])"(\s:)?|\b(true|false|null)\b|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?)/g, function (match: any) {
|
|
||||||
let cls = 'number';
|
|
||||||
if (/^"/.test(match)) {
|
|
||||||
if (/:$/.test(match)) {
|
|
||||||
cls = 'key';
|
|
||||||
} else {
|
|
||||||
cls = 'string';
|
|
||||||
}
|
|
||||||
} else if (/true|false/.test(match)) {
|
|
||||||
cls = 'boolean';
|
|
||||||
} else if (/null/.test(match)) {
|
|
||||||
cls = 'null';
|
|
||||||
}
|
|
||||||
return '<span className="' + cls + '">' + match + '</span>';
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Dialog open={showDetailDialog} onOpenChange={setShowDetailDialog}>
|
<Dialog open={showDetailDialog} onOpenChange={setShowDetailDialog}>
|
||||||
<DialogContent className="container-fixed max-w-[1024px] flex flex-col p-5 overflow-hidden">
|
<DialogContent className="container-fixed max-w-[1024px] flex flex-col p-5 overflow-hidden">
|
||||||
@ -555,47 +526,37 @@ const DetailTransaction = () => {
|
|||||||
<p className="text-sm text-gray-500">Status</p>
|
<p className="text-sm text-gray-500">Status</p>
|
||||||
<p className="font-medium">
|
<p className="font-medium">
|
||||||
{(() => {
|
{(() => {
|
||||||
let status;
|
let status = 'UNKNOWN';
|
||||||
let badgeClass;
|
let badgeClass = 'bg-gray-100 text-gray-800';
|
||||||
|
|
||||||
let badgeClass;
|
switch (transactionDetails?.status) {
|
||||||
|
case 'C':
|
||||||
if (transactionDetails?.status === 'C') {
|
|
||||||
status = 'COMPLETE';
|
status = 'COMPLETE';
|
||||||
badgeClass = 'bg-green-100 text-green-800';
|
badgeClass = 'bg-green-100 text-green-800';
|
||||||
badgeClass = 'bg-green-100 text-green-800';
|
break;
|
||||||
} else if (transactionDetails?.status === 'F') {
|
case 'F':
|
||||||
status = 'FAILED';
|
status = 'FAILED';
|
||||||
badgeClass = 'bg-red-100 text-red-800';
|
badgeClass = 'bg-red-100 text-red-800';
|
||||||
badgeClass = 'bg-red-100 text-red-800';
|
break;
|
||||||
} else if (transactionDetails?.status === 'O') {
|
case 'O':
|
||||||
status = 'ON PROCESS';
|
status = 'ON PROCESS';
|
||||||
badgeClass = 'bg-blue-100 text-blue-800';
|
badgeClass = 'bg-blue-100 text-blue-800';
|
||||||
} else if (transactionDetails?.status === 'P') {
|
break;
|
||||||
badgeClass = 'bg-blue-100 text-blue-800';
|
case 'P':
|
||||||
} else if (transactionDetails?.status === 'P') {
|
|
||||||
status = 'PENDING';
|
status = 'PENDING';
|
||||||
badgeClass = 'bg-gray-100 text-gray-800';
|
badgeClass = 'bg-gray-100 text-gray-800';
|
||||||
} else if (transactionDetails?.status === 'R') {
|
break;
|
||||||
|
case 'R':
|
||||||
status = 'ROLLBACK';
|
status = 'ROLLBACK';
|
||||||
badgeClass = 'bg-yellow-100 text-yellow-800';
|
badgeClass = 'bg-yellow-100 text-yellow-800';
|
||||||
} else if (transactionDetails?.status === 'S') {
|
break;
|
||||||
status = 'REVERSAL';
|
case 'S':
|
||||||
badgeClass = 'bg-purple-100 text-purple-800';
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<span className={`px-3 py-1 rounded-full text-xs font-semibold ${badgeClass}`}>
|
|
||||||
{status}
|
|
||||||
</span>
|
|
||||||
);
|
|
||||||
badgeClass = 'bg-gray-100 text-gray-800';
|
|
||||||
} else if (transactionDetails?.status === 'R') {
|
|
||||||
status = 'ROLLBACK';
|
|
||||||
badgeClass = 'bg-yellow-100 text-yellow-800';
|
|
||||||
} else if (transactionDetails?.status === 'S') {
|
|
||||||
status = 'REVERSAL';
|
status = 'REVERSAL';
|
||||||
badgeClass = 'bg-purple-100 text-purple-800';
|
badgeClass = 'bg-purple-100 text-purple-800';
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
// optional: keep 'UNKNOWN' or set to null
|
||||||
|
break;
|
||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
@ -604,6 +565,7 @@ const DetailTransaction = () => {
|
|||||||
</span>
|
</span>
|
||||||
);
|
);
|
||||||
})()}
|
})()}
|
||||||
|
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
@ -751,7 +713,6 @@ const DetailTransaction = () => {
|
|||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
{activeTab === 'destinationwallet' && transactionDetails?.kind?.trim()?.toUpperCase() !== 'P' && (
|
|
||||||
{activeTab === 'destinationwallet' && transactionDetails?.kind?.trim()?.toUpperCase() !== 'P' && (
|
{activeTab === 'destinationwallet' && transactionDetails?.kind?.trim()?.toUpperCase() !== 'P' && (
|
||||||
<div className="space-y-4">
|
<div className="space-y-4">
|
||||||
<h3 className="font-semibold">Destination Wallet</h3>
|
<h3 className="font-semibold">Destination Wallet</h3>
|
||||||
@ -798,6 +759,7 @@ const DetailTransaction = () => {
|
|||||||
|
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
)}
|
)}
|
||||||
|
|
||||||
|
|
||||||
@ -882,7 +844,6 @@ const DetailTransaction = () => {
|
|||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
{activeTab === 'approve' && transactionDetails?.kind == "P" && (
|
|
||||||
{activeTab === 'approve' && transactionDetails?.kind == "P" && (
|
{activeTab === 'approve' && transactionDetails?.kind == "P" && (
|
||||||
<div className="space-y-4">
|
<div className="space-y-4">
|
||||||
<h3 className="font-semibold">Approval Logs</h3>
|
<h3 className="font-semibold">Approval Logs</h3>
|
||||||
|
|||||||
Reference in New Issue
Block a user