fix: use appeal property of the transaction in frontend

yeagerai · Dec 30, 2024 · 28c842c · 28c842c
1 parent 8357219
commit 28c842c
Showing 1 changed file with 23 additions and 20 deletions.
diff --git a/frontend/src/components/Simulator/TransactionItem.vue b/frontend/src/components/Simulator/TransactionItem.vue
@@ -45,20 +45,17 @@ const shortHash = computed(() => {
   return props.transaction.hash?.slice(0, 6);
 });
 
-const isAppealed = ref(false);
+const appealed = ref(props.transaction.data.appealed);
 
 const handleSetTransactionAppeal = () => {
   transactionsStore.setTransactionAppeal(props.transaction.hash);
-
-  isAppealed.value = true;
+  appealed.value = true;
 };
 
 watch(
-  () => props.transaction.status,
-  (newStatus) => {
-    if (newStatus !== 'ACCEPTED' && newStatus !== 'UNDETERMINED') {
-      isAppealed.value = false;
-    }
+  () => props.transaction.data.appealed,
+  (newVal) => {
+    appealed.value = newVal;
   },
 );
 
@@ -153,22 +150,25 @@ function prettifyTxData(x: any): any {
         "
       />
 
-      <!-- <TransactionStatusBadge
+      <TransactionStatusBadge
         as="button"
         @click.stop="handleSetTransactionAppeal"
-        :class="{ '!bg-green-500': isAppealed }"
+        :class="{ '!bg-green-500': appealed }"
         v-if="
-          (transaction.data.leader_only == false) &&
-          (transaction.status == 'ACCEPTED' || transaction.status == 'UNDETERMINED') &&
-          ((Date.now() / 1000) - transaction.data.timestamp_awaiting_finalization <= finalityWindow)
+          transaction.data.leader_only == false &&
+          (transaction.status == 'ACCEPTED' ||
+            transaction.status == 'UNDETERMINED') &&
+          Date.now() / 1000 -
+            transaction.data.timestamp_awaiting_finalization <=
+            finalityWindow
         "
         v-tooltip="'Appeal transaction'"
       >
         <div class="flex items-center gap-1">
           APPEAL
           <GavelIcon class="h-3 w-3" />
         </div>
-      </TransactionStatusBadge> -->
+      </TransactionStatusBadge>
 
       <TransactionStatusBadge
         :class="[
@@ -231,22 +231,25 @@ function prettifyTxData(x: any): any {
             >
               {{ transaction.status }}
             </TransactionStatusBadge>
-            <!-- <TransactionStatusBadge
+            <TransactionStatusBadge
               as="button"
               @click.stop="handleSetTransactionAppeal"
-              :class="{ '!bg-green-500': isAppealed }"
+              :class="{ '!bg-green-500': appealed }"
               v-if="
-                (transaction.data.leader_only == false) &&
-                (transaction.status == 'ACCEPTED' || transaction.status == 'UNDETERMINED') &&
-                ((Date.now() / 1000) - transaction.data.timestamp_awaiting_finalization <= finalityWindow)
+                transaction.data.leader_only == false &&
+                (transaction.status == 'ACCEPTED' ||
+                  transaction.status == 'UNDETERMINED') &&
+                Date.now() / 1000 -
+                  transaction.data.timestamp_awaiting_finalization <=
+                  finalityWindow
               "
               v-tooltip="'Appeal transaction'"
             >
               <div class="flex items-center gap-1">
                 APPEAL
                 <GavelIcon class="h-3 w-3" />
               </div>
-            </TransactionStatusBadge> -->
+            </TransactionStatusBadge>
           </p>
         </div>