diff --git a/src/components/sendTx/ExportSuccessModal.tsx b/src/components/sendTx/ExportSuccessModal.tsx
new file mode 100644
index 0000000..79d8d67
--- /dev/null
+++ b/src/components/sendTx/ExportSuccessModal.tsx
@@ -0,0 +1,85 @@
+import {
+ Button,
+ List,
+ ListItem,
+ Modal,
+ ModalBody,
+ ModalCloseButton,
+ ModalContent,
+ ModalFooter,
+ ModalHeader,
+ ModalOverlay,
+ Text,
+} from '@chakra-ui/react';
+import { StdPublicKeys, StdTemplateKeys } from '@spacemesh/sm-codec';
+
+type Props = {
+ templateAddress: StdTemplateKeys;
+ isSigned: boolean;
+ isOpen: boolean;
+ onClose: () => void;
+};
+
+function ExportSuccessModal({
+ templateAddress,
+ isSigned,
+ isOpen,
+ onClose,
+}: Props) {
+ return (
+
+
+
+
+
+ Transaction
+ {isSigned ? ' signed and ' : ' '}
+ exported successfully
+
+
+ To complete the transaction, follow these steps:
+
+ {templateAddress === StdPublicKeys.MultiSig ||
+ templateAddress === StdPublicKeys.Vesting ? (
+ <>
+
+
+ If you own one of the required keys — import the transaction
+ and sign it
+ {isSigned ? ' again.' : ' .'},
+
+
+ Send the exported file to other parties if needed.
+
+
+ Collect all the signatures, then import them, and publish the
+ transaction.
+
+
+
+ Signatures can be collected either synchronously or
+ asynchronously. This means you can send the signed transaction
+ to all other parties and request their signatures. Once you have
+ gathered enough signatures, you can import them all at once, and
+ they will be combined automatically.
+
+ >
+ ) : (
+
+ Import this transaction file.
+ {!isSigned && Sign it.}
+ Publish the signed transaction.
+
+ )}
+
+
+
+
+
+
+ );
+}
+
+export default ExportSuccessModal;
diff --git a/src/components/sendTx/SendTxModal.tsx b/src/components/sendTx/SendTxModal.tsx
index 2582e5e..1fa6bd8 100644
--- a/src/components/sendTx/SendTxModal.tsx
+++ b/src/components/sendTx/SendTxModal.tsx
@@ -91,6 +91,7 @@ import TxFileReader from '../TxFileReader';
import ConfirmationModal, { ConfirmationData } from './ConfirmationModal';
import Drain from './Drain';
+import ExportSuccessModal from './ExportSuccessModal';
import MultiSigSpawn from './MultiSigSpawn';
import {
DrainPayload,
@@ -175,6 +176,8 @@ function SendTxModal({ isOpen, onClose }: SendTxModalProps): JSX.Element {
const estimateGas = useEstimateGas();
const { setTransactions } = useAccountData();
+ const exportSuccessModal = useDisclosure();
+ const [isExportedSigned, setIsExportedSigned] = useState(false);
const confirmationModal = useDisclosure();
const [txData, setTxData] = useState(null);
const [estimatedGas, setEstimatedGas] = useState(null);
@@ -287,6 +290,7 @@ function SendTxModal({ isOpen, onClose }: SendTxModalProps): JSX.Element {
setTxData(null);
setImportErrors('');
setIsLedgerRejected(false);
+ setIsExportedSigned(false);
clearErrors();
onClose();
};
@@ -755,6 +759,9 @@ function SendTxModal({ isOpen, onClose }: SendTxModalProps): JSX.Element {
`tx-${signWith ? 'signed' : 'unsigned'}-${hex.slice(-6)}.hex`,
'text/plain'
);
+ confirmationModal.onClose();
+ setIsExportedSigned(!!signWith);
+ exportSuccessModal.onOpen();
return true;
}
return false;
@@ -1176,6 +1183,7 @@ function SendTxModal({ isOpen, onClose }: SendTxModalProps): JSX.Element {
as="u"
color="brand.lightGray"
size="xs"
+ cursor="pointer"
p={1}
isDisabled={
!!(currerntAccount && isVaultAccount(currerntAccount))
@@ -1319,6 +1327,14 @@ function SendTxModal({ isOpen, onClose }: SendTxModalProps): JSX.Element {
insufficientFunds={insufficientFunds}
/>
)}
+ {txData && (
+
+ )}