From 36035395e53a33f6fb2894492341d31ac5a4499d Mon Sep 17 00:00:00 2001
From: mabasian <54101509+mabasian@users.noreply.github.com>
Date: Thu, 12 Dec 2024 12:02:59 +0100
Subject: [PATCH 1/3] UPDATE: alert box to add setting

---
 .../components/UI/control-page/components/alert/ControlAlert.vue | 1 +
 1 file changed, 1 insertion(+)

diff --git a/launcher/src/components/UI/control-page/components/alert/ControlAlert.vue b/launcher/src/components/UI/control-page/components/alert/ControlAlert.vue
index 8982bafbe..57add66c2 100755
--- a/launcher/src/components/UI/control-page/components/alert/ControlAlert.vue
+++ b/launcher/src/components/UI/control-page/components/alert/ControlAlert.vue
@@ -215,6 +215,7 @@
         </template>
 
         <!-- csm green end -->
+        <!-- setting page have to add here -->
         <div
           v-if="synchronizationErrorControl && !alertShowState.includes('red')"
           class="alert-message_red"

From ab73803ff91d2a14aa4a2692b3ef148bb6ecba28 Mon Sep 17 00:00:00 2001
From: mabasian <54101509+mabasian@users.noreply.github.com>
Date: Fri, 13 Dec 2024 13:09:25 +0100
Subject: [PATCH 2/3] ADD: expert mode added to the control panel

fix #2141
---
 .../UI/control-page/ControlScreen.vue         | 19 +++++++++++++++++--
 .../UI/control-page/sections/AlertSection.vue |  8 +++++++-
 .../UI/node-page/sections/ExpertWindow.vue    |  1 +
 3 files changed, 25 insertions(+), 3 deletions(-)

diff --git a/launcher/src/components/UI/control-page/ControlScreen.vue b/launcher/src/components/UI/control-page/ControlScreen.vue
index 57c73810e..0c242baa9 100644
--- a/launcher/src/components/UI/control-page/ControlScreen.vue
+++ b/launcher/src/components/UI/control-page/ControlScreen.vue
@@ -3,9 +3,10 @@
     <div class="Control-screen w-full h-full grid grid-cols-24 grid-rows-12 items-center bg-[#242529]">
       <ControlHeader />
       <CommonSidebar />
-      <AlertSection />
+      <AlertSection @expert-handler="expertModeHandlerAlert" />
       <StakingSidebar />
       <SidebarRight />
+      <ExpertWindow v-if="isExpertWindowOpen" :item="expertModeClient" bg-opacity="opacity-25" @hide-modal="hideExpertMode(item)" />
     </div>
   </base-layout>
 </template>
@@ -15,18 +16,32 @@ import { useSetups } from "@/store/setups";
 import { useFooter } from "@/store/theFooter";
 import { useServices } from "@/store/services";
 
-import { watch, computed } from "vue";
+import { watch, computed, ref } from "vue";
 
 import ControlHeader from "./sections/ControlHeader.vue";
 import CommonSidebar from "./sections/CommonSidebar.vue";
 import AlertSection from "./sections/AlertSection.vue";
 import StakingSidebar from "./sections/StakingSidebar.vue";
 import SidebarRight from "./sections/SidebarRight.vue";
+import ExpertWindow from "../node-page/sections/ExpertWindow.vue";
 
 const setupStore = useSetups();
 const footerStore = useFooter();
 const serviceStore = useServices();
 
+const isExpertWindowOpen = ref(false);
+const expertModeClient = ref(null);
+
+const hideExpertMode = (el) => {
+  expertModeClient.value = el;
+  isExpertWindowOpen.value = false;
+};
+
+const expertModeHandlerAlert = (validator) => {
+  expertModeClient.value = validator;
+  isExpertWindowOpen.value = true;
+};
+
 const selectedConfigServices = computed(() => {
   let services = [];
   const selectedSetup = setupStore.selectedSetup;
diff --git a/launcher/src/components/UI/control-page/sections/AlertSection.vue b/launcher/src/components/UI/control-page/sections/AlertSection.vue
index fbdc27695..306c091ec 100644
--- a/launcher/src/components/UI/control-page/sections/AlertSection.vue
+++ b/launcher/src/components/UI/control-page/sections/AlertSection.vue
@@ -1,9 +1,15 @@
 <template>
   <div class="w-full h-full col-start-7 col-end-10 row-start-2 row-span-full flex justify-center items-center pt-2 pb-1">
-    <ControlAlert />
+    <ControlAlert @expert-handler="expertHandler" />
   </div>
 </template>
 
 <script setup>
 import ControlAlert from "../components/alert/ControlAlert.vue";
+
+const emit = defineEmits(["expertHandler"]);
+
+const expertHandler = (data) => {
+  emit("expertHandler", data);
+};
 </script>
diff --git a/launcher/src/components/UI/node-page/sections/ExpertWindow.vue b/launcher/src/components/UI/node-page/sections/ExpertWindow.vue
index 26234eca6..bcf43bbf8 100755
--- a/launcher/src/components/UI/node-page/sections/ExpertWindow.vue
+++ b/launcher/src/components/UI/node-page/sections/ExpertWindow.vue
@@ -311,6 +311,7 @@ export default {
     bgOpacity: {
       type: String,
       required: false,
+      default: "opacity-100",
     },
     leftDistance: {
       type: String,

From 73182707a03d8603810b278d4c30f9327486c992 Mon Sep 17 00:00:00 2001
From: mabasian <54101509+mabasian@users.noreply.github.com>
Date: Fri, 13 Dec 2024 13:10:53 +0100
Subject: [PATCH 3/3] UPDATE: remove additional comment

---
 .../UI/control-page/components/alert/ControlAlert.vue           | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/launcher/src/components/UI/control-page/components/alert/ControlAlert.vue b/launcher/src/components/UI/control-page/components/alert/ControlAlert.vue
index 3af1869a2..32e0eec5b 100755
--- a/launcher/src/components/UI/control-page/components/alert/ControlAlert.vue
+++ b/launcher/src/components/UI/control-page/components/alert/ControlAlert.vue
@@ -215,7 +215,7 @@
         </template>
 
         <!-- csm green end -->
-        <!-- setting page have to add here -->
+
         <div
           v-if="synchronizationErrorControl && !alertShowState.includes('red')"
           class="alert-message_red"