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 | import ModalFactory from "@common/Modal/ModalFactory/ModalFactory";
import NiceModal, { useModal } from "@ebay/nice-modal-react";
import { ModalActions, ModalTitle } from "@common/Modal/ModalFactory/atoms";
import PlaidAccountInfo from "./PlaidAccountInfo";
import { useCustomTheme } from "@theme/hooks/useCustomTheme";
import { safeParse } from "@utils/index";
const PlaidAccountInfoModal = NiceModal.create(({ data }: { data: string }) => {
const modal = useModal();
const { isMobileView } = useCustomTheme();
const handleCancel = () => modal.hide();
const dataObj = safeParse(data);
if (!dataObj || !dataObj?.request_id) return null;
const request_id = dataObj?.request_id;
return (
<ModalFactory
variant="dialog"
modalProps={{
open: modal.visible,
onClose: handleCancel,
width: 600,
}}
>
<ModalTitle
title="Plaid Account Information"
description={`Request ID: ${request_id}`}
padding={isMobileView ? "0 4px" : "24px 24px 0"}
onClose={handleCancel}
textStyles={{
title: {
fontSize: 18,
},
description: {
fontWeight: 350,
},
}}
/>
<PlaidAccountInfo data={dataObj} />
<ModalActions
animationDelay={100}
padding={isMobileView ? "16px 4px" : "20px 24px 16px"}
secondaryAction={{
sx: { display: "none" },
}}
primaryAction={{
type: "button",
label: "Close",
onClick: handleCancel,
background: "primary",
isLoading: false,
sx: { fontSize: 18, padding: "12px 24px" },
}}
/>
</ModalFactory>
);
});
export default PlaidAccountInfoModal;
|