ADD: gas widget

launcher/src/components/UI/control-page/components/widgets/GasWidget.vue

@@ -0,0 +1,17 @@
+<template>
+  <div class="gas-parent flex justify-center items-center flex-col w-full h-full">
+    <div class="w-full h-1/3 flex justify-center items-center text-gray-200 text-xs font-bold uppercase">change</div>
+    <div class="w-full h-1/3 flex justify-center items-center text-green-500 text-lg font-bold uppercase">
+      {{ gasFee }}
+    </div>
+    <div class="w-full h-1/3 flex justify-center items-center text-gray-200 text-xs font-bold uppercase">gwei</div>
+  </div>
+</template>
+
+<script setup>
+import { ref } from "vue";
+
+const gasFee = ref("+1,022"); //dummy gas fee
+</script>
+
+<style scoped></style>

launcher/src/components/UI/control-page/sections/SidebarRight.vue

@@ -2,7 +2,9 @@
   <div
     class="w-full h-full col-start-22 col-end-25 row-start-2 row-span-full grid grid-cols-3 grid-rows-15 items-center gap-1 pt-2 pb-1 pr-1"
   >
-    <MiniCard class="col-start-1 col-span-3 row-start-1 row-span-3"><ClientPairWidget /></MiniCard>
+    <MiniCard class="col-start-1 col-span-3 row-start-1 row-span-3"
+      ><ClientPairWidget v-if="controlStore.pickeedService === 'exeCons'" /><GasWidget v-else
+    /></MiniCard>
     <MiniCard v-if="controlStore.pickeedService === 'exeCons'" class="col-start-1 col-span-3 row-start-4 row-span-3"
       ><PairStatusWidget
     /></MiniCard>
@@ -21,6 +23,7 @@ import ClientPairWidget from "../components/widgets/ClientPairWidget.vue";
 import PairStatusWidget from "../components/widgets/PairStatusWidget.vue";
 import RPCRecievedOverTime from "../components/widgets/RPCRecievedOverTime.vue";
 import ServicePort from "../components/widgets/ServicePort.vue";
+import GasWidget from "../components/widgets/GasWidget.vue";
 
 import { useControlStore } from "@/store/theControl";