From 95de7e3270ad994c5946b6bc0cb7af03e0377b0a Mon Sep 17 00:00:00 2001
From: Alexandre Rousseau <alexandre@rsseau.fr>
Date: Tue, 1 Oct 2024 21:50:37 +0200
Subject: [PATCH] fix(ui): make `CoreSwitchInput` reactive to state change.
 WF-81

---
 .../src/components/core/input/CoreSwitchInput.vue   | 13 ++++++++-----
 1 file changed, 8 insertions(+), 5 deletions(-)

diff --git a/src/ui/src/components/core/input/CoreSwitchInput.vue b/src/ui/src/components/core/input/CoreSwitchInput.vue
index 0ab7f23a6..66c64c63e 100644
--- a/src/ui/src/components/core/input/CoreSwitchInput.vue
+++ b/src/ui/src/components/core/input/CoreSwitchInput.vue
@@ -20,7 +20,7 @@
 </template>
 
 <script lang="ts">
-import { inject } from "vue";
+import { inject, watch } from "vue";
 import { ref } from "vue";
 import { FieldType } from "@/writerTypes";
 import {
@@ -29,7 +29,6 @@ import {
 	separatorColor,
 	cssClasses,
 } from "@/renderer/sharedStyleFields";
-import { onMounted } from "vue";
 import BaseInputWrapper from "../base/BaseInputWrapper.vue";
 import { ComponentPublicInstance } from "vue";
 
@@ -89,9 +88,13 @@ function handleToggle() {
 	handleInput(toggleValue.value, "wf-toggle");
 }
 
-onMounted(() => {
-	toggleValue.value = !!formValue.value;
-});
+watch(
+	formValue,
+	() => {
+		toggleValue.value = !!formValue.value;
+	},
+	{ immediate: true },
+);
 </script>
 
 <style scoped>