Remove export buttons and add coming soon to operator buttons

consensusnetworks · Oct 26, 2023 · 13b4ca6 · 13b4ca6
1 parent 76ccef5
commit 13b4ca6
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 14 deletions.
diff --git a/apps/web/src/pages/operators/Operator.vue b/apps/web/src/pages/operators/Operator.vue
@@ -95,14 +95,14 @@ const operatorTableHeaders = ref(
         title: 'Node URL',
         value: 'nodeURL'
     },
-    // {
-    //     title: '',
-    //     value: 'deactivate'
-    // },
-    // {
-    //     title: '',
-    //     value: 'withdraw_collateral'
-    // },
+    {
+        title: '',
+        value: 'deactivate'
+    },
+    {
+        title: '',
+        value: 'withdraw_collateral'
+    },
   ]
 )
 
@@ -639,7 +639,7 @@ watch([loadingSessionLogin || loadingInitializeOperators], () =>{
             List of operators according to their performance 
           </div>
         </div>
-        <div class="flex items-start gap-[12px]">
+        <!-- <div class="flex items-start gap-[12px]">
           <button
             class="flex items-center gap-[8px] export_button h-[38px]"
             @click="exportFile(checkedItems, filteredData)"
@@ -651,7 +651,7 @@ watch([loadingSessionLogin || loadingInitializeOperators], () =>{
             />
             Export
           </button>
-        </div>
+        </div> -->
       </div>
 
       <!-- Table -->
@@ -729,9 +729,13 @@ watch([loadingSessionLogin || loadingInitializeOperators], () =>{
                 >
                   <!-- TODO: @Chris, wanna hook up this button? -->
                   <button
-                    class="bg-decline text-white rounded-[3px] px-[8px] py-[4px] text-[14px] font-[500]"
+                    class="bg-decline text-white rounded-[3px] px-[8px] py-[4px] text-[14px] font-[500] relative"
                     disabled
                   >
+                    <div class="tooltip_container">
+                      Coming Soon!
+                      <div class="tooltip_triangle" />
+                    </div>
                     Deactivate
                   </button>
                 </div>
@@ -741,9 +745,13 @@ watch([loadingSessionLogin || loadingInitializeOperators], () =>{
                 >
                   <!-- TODO: @Chris, wanna hook up this button? -->
                   <button
-                    class="bg-primary text-white rounded-[3px] px-[8px] py-[4px] text-[14px] font-[500] opacity-50"
+                    class="action-button bg-primary text-white rounded-[3px] px-[8px] py-[4px] text-[14px] font-[500] opacity-50 relative"
                     disabled
                   >
+                    <div class="tooltip_container">
+                      Coming Soon!
+                      <div class="tooltip_triangle" />
+                    </div>
                     Withdraw
                   </button>
                 </div>
@@ -1053,6 +1061,10 @@ watch([loadingSessionLogin || loadingInitializeOperators], () =>{
   border-top: 5px solid #000; /* same color as the tooltip background */
 }
 
+button:hover .tooltip_container {
+  opacity: 1; /* show on hover */
+}
+
 /* .shine-effect {
   content: '';
   position: absolute;

diff --git a/apps/web/src/pages/overview/components/BreakdownTable.vue b/apps/web/src/pages/overview/components/BreakdownTable.vue
@@ -351,7 +351,7 @@ onMounted(() =>{
             List of transactions by wallet and staking actions
           </div>
         </div>
-        <div class="flex items-start gap-[12px]">
+        <!-- <div class="flex items-start gap-[12px]">
           <button
             class="flex items-center gap-[8px] export_button h-[38px]"
             @click="exportFile()"
@@ -363,7 +363,7 @@ onMounted(() =>{
             />
             Export
           </button>
-        </div>
+        </div> -->
       </div>
       <div class="flex flex-wrap gap-[20px] justify-between py-[20px] items-center border-b border-b-[#EAECF0]">
         <div class="grouped_buttons flex flex-nowrap overflow-hidden w-[261px]">