feat: added flow reset button

src/app/components/mint-unmint/components/lock-screen/lock-screen.tsx

@@ -1,9 +1,11 @@
 import { useContext, useState } from 'react';
+import { useDispatch } from 'react-redux';
 
 import { Button, VStack } from '@chakra-ui/react';
 import { VaultCard } from '@components/vault/vault-card';
 import { useVaults } from '@hooks/use-vaults';
 import { Vault } from '@models/vault';
+import { mintUnmintActions } from '@store/slices/mintunmint/mintunmint.actions';
 
 import { BlockchainContext } from '../../../../providers/blockchain-context-provider';
 import { LockScreenProtocolFee } from './components/protocol-fee';
@@ -13,6 +15,7 @@ interface LockScreenProps {
 }
 
 export function LockScreen({ currentStep }: LockScreenProps): React.JSX.Element {
+  const dispatch = useDispatch();
   const { readyVaults } = useVaults();
   const blockchainContext = useContext(BlockchainContext);
   const bitcoin = blockchainContext?.bitcoin;
@@ -46,6 +49,13 @@ export function LockScreen({ currentStep }: LockScreenProps): React.JSX.Element
       >
         Lock BTC
       </Button>
+      <Button
+        isLoading={isSubmitting}
+        variant={'navigate'}
+        onClick={() => dispatch(mintUnmintActions.setMintStep([0, '']))}
+      >
+        Cancel
+      </Button>
     </VStack>
   );
 }

src/app/components/mint-unmint/components/transaction-summary/transaction-summary.tsx

@@ -1,8 +1,10 @@
-import { Link } from 'react-router-dom';
+import { useDispatch } from 'react-redux';
+import { Link, useNavigate } from 'react-router-dom';
 
-import { HStack, Spinner, Stack, Text, VStack } from '@chakra-ui/react';
+import { Button, HStack, Spinner, Stack, Text, VStack } from '@chakra-ui/react';
 import { VaultCard } from '@components/vault/vault-card';
 import { useVaults } from '@hooks/use-vaults';
+import { mintUnmintActions } from '@store/slices/mintunmint/mintunmint.actions';
 
 import { TransactionSummaryPreviewCard } from './components/transaction-summary-preview-card';
 
@@ -40,6 +42,8 @@ export function TransactionSummary({
   flow,
   blockchain,
 }: TransactionSummaryProps): React.JSX.Element {
+  const navigate = useNavigate();
+  const dispatch = useDispatch();
   const { allVaults } = useVaults();
   const currentVault = allVaults.find(vault => vault.uuid === currentStep[1]);
 
@@ -79,6 +83,19 @@ export function TransactionSummary({
           tab.
         </Text>
       </Stack>
+      <Button
+        variant={'navigate'}
+        onClick={() => {
+          dispatch(
+            flow === 'mint'
+              ? mintUnmintActions.setMintStep([0, ''])
+              : mintUnmintActions.setUnmintStep([0, ''])
+          );
+          navigate('/my-vaults');
+        }}
+      >
+        View in My Vaults
+      </Button>
     </VStack>
   );
 }

src/app/store/slices/mintunmint/mintunmint.slice.ts

@@ -7,8 +7,8 @@ interface MintUnmintState {
 }
 
 const initialMintUnmintState: MintUnmintState = {
-  mintStep: [0, ''],
-  unmintStep: [0, ''],
+  mintStep: [2, ''],
+  unmintStep: [1, ''],
   activeTab: 0,
 };