From 4aa4164660148cb00a51aaccf1546a5c7ae76c15 Mon Sep 17 00:00:00 2001
From: Alain Brenzikofer <alain@integritee.network>
Date: Sat, 4 May 2024 11:03:11 +0200
Subject: [PATCH] warn people if they have skipped a step

---
 components/InviteFriendTab.vue |  3 +++
 components/PublishonxTab.vue   |  7 +++++++
 components/UnshieldTab.vue     | 24 +++++++++++++++---------
 3 files changed, 25 insertions(+), 9 deletions(-)

diff --git a/components/InviteFriendTab.vue b/components/InviteFriendTab.vue
index 657ec5f..c70e739 100644
--- a/components/InviteFriendTab.vue
+++ b/components/InviteFriendTab.vue
@@ -5,6 +5,9 @@
       <div class="container">
         <div class=''>
           <div class='text-4xl mt-10 mb-10'>Invite a friend</div>
+          <div v-if="accountStore.incogniteeBalance == 0">
+            <i><b>You have no balance on Incognitee. Please go back to step 2</b></i>
+          </div>
           <div class='text-lg'>
             By clicking the ”Invite Friend” button, you perform a private transfer of 30% of your
             available PAS from your Incognitee wallet to another wallet with an invite link. You can share this with
diff --git a/components/PublishonxTab.vue b/components/PublishonxTab.vue
index 53692e9..5114b3b 100644
--- a/components/PublishonxTab.vue
+++ b/components/PublishonxTab.vue
@@ -5,6 +5,13 @@
         <div class=''>
           <div class='text-4xl mt-10 mb-10'>Publish on X</div>
           <div class='text-lg'>
+            <div v-if="accountStore.incogniteeBalance == 0">
+              <i><b>You have no balance on Incognitee. Please go back to step 2</b></i>
+            </div>
+            <div v-if="accountStore.paseoBalance == 0">
+              <i><b>You have no balance on Paseo. Please go back to step 2</b></i>
+            </div>
+
             By clicking the ”Check” button, you will be redirected to the Paseo Subscan Portal,
             where you have to check for your unshielding event.
             <div class='mt-5'>
diff --git a/components/UnshieldTab.vue b/components/UnshieldTab.vue
index 540cb2b..2888dfe 100644
--- a/components/UnshieldTab.vue
+++ b/components/UnshieldTab.vue
@@ -5,11 +5,16 @@
         <div class='grid grid-rows-3 grid-flow-col gap-4'>
           <div class='text-4xl mt-10'>Unshield</div>
           <div class='text-lg'>
-            By clicking the ”Unshield” button, you perform a transfer of 30% of your Incognitee
-            balance to your wallet on Paseo.
-          </div>
-          <div>
-            <UButton class="btn btn_gradient" @click="unshieldFunds">Unshield Funds</UButton>
+            <div v-if="accountStore.incogniteeBalance == 0">
+              <i><b>You have no balance on Incognitee. Please go back to step 2</b></i>
+            </div>
+            <div class='mt-4'>
+              By clicking the ”Unshield” button, you perform a transfer of 30% of your Incognitee
+              balance to your wallet on Paseo.
+            </div>
+            <div>
+              <UButton class="btn btn_gradient" @click="unshieldFunds">Unshield Funds</UButton>
+            </div>
           </div>
         </div>
       </div>
@@ -20,8 +25,9 @@
 <script setup lang="ts">
 import {formatBalance} from "@polkadot/util";
 
-import { useAccount } from '@/store/account.ts'
-import { useIncognitee } from '@/store/incognitee.ts'
+import {useAccount} from '@/store/account.ts'
+import {useIncognitee} from '@/store/incognitee.ts'
+
 const accountStore = useAccount()
 const incogniteeStore = useIncognitee()
 
@@ -48,11 +54,11 @@ const unshieldFunds = () => {
   ).then((hash) => {
     console.log(`trustedOperationHash: ${hash}`)
     // todo! wait for evidence on L1
-    emit('change-tab',4);
+    emit('change-tab', 4);
   });
 
   // todo! remove this and only change tab upon success above
-  emit('change-tab',4);
+  emit('change-tab', 4);
 };
 
 </script>