From c8bf0fb853f2158f76ccb9e077086bb9a7411f8c Mon Sep 17 00:00:00 2001
From: fmtabbara <fmtabbara@hotmail.co.uk>
Date: Mon, 4 Jul 2022 11:58:58 +0100
Subject: [PATCH] use confirmation modal for successful/failed unbond

---
 .../src/pages/unbond/ConfirmationModal.tsx    | 29 +++++++++++++++++++
 1 file changed, 29 insertions(+)
 create mode 100644 nym-wallet/src/pages/unbond/ConfirmationModal.tsx

diff --git a/nym-wallet/src/pages/unbond/ConfirmationModal.tsx b/nym-wallet/src/pages/unbond/ConfirmationModal.tsx
new file mode 100644
index 0000000000..38ff43e655
--- /dev/null
+++ b/nym-wallet/src/pages/unbond/ConfirmationModal.tsx
@@ -0,0 +1,29 @@
+import React from 'react';
+import { Typography } from '@mui/material';
+import { Link } from '@nymproject/react/link/Link';
+import { SimpleModal } from 'src/components/Modals/SimpleModal';
+
+export const ConfirmationModal = ({
+  txUrl,
+  message,
+  success,
+  onClose,
+}: {
+  txUrl?: string;
+  message?: string;
+  success: boolean;
+  onClose: () => void;
+}) => (
+  <SimpleModal
+    open
+    header={success ? 'Successfully Unbonded' : 'Unbonding failed'}
+    displayErrorIcon={!success}
+    onOk={async () => onClose()}
+    okLabel="Done"
+    hideCloseIcon
+    sx={{ display: 'flex', flexDirection: 'column', alignItems: 'center', gap: 1 }}
+  >
+    {message && <Typography variant="caption">Error: {message}</Typography>}
+    {txUrl && <Link href={txUrl} target="_blank" sx={{ ml: 1 }} text="View on blockchain" />}
+  </SimpleModal>
+);