From 53326b7e2f90b9c45bb5e63dc5e57660310d7710 Mon Sep 17 00:00:00 2001
From: Jakob Scheid <jakob.scheid@icloud.com>
Date: Fri, 24 Jul 2026 11:59:08 +0200
Subject: [PATCH] feat(settings): make setting input reactive to stored setting

---
 .../settings/components/SettingsInput.vue         | 15 ++++++++++++---
 1 file changed, 12 insertions(+), 3 deletions(-)

diff --git a/src/features/settings/components/SettingsInput.vue b/src/features/settings/components/SettingsInput.vue
index b46d7eb..18b7367 100644
--- a/src/features/settings/components/SettingsInput.vue
+++ b/src/features/settings/components/SettingsInput.vue
@@ -19,7 +19,7 @@ import Icon from '@/features/icons/components/Icon.vue';
 
 import { useSettingsStore } from '../stores/settingsStore';
 
-import { computed, useId } from 'vue';
+import { computed, ref, useId, watch } from 'vue';
 import { useI18n } from 'vue-i18n';
 
 const { t } = useI18n();
@@ -35,8 +35,9 @@ const props = defineProps({
 
 const store = useSettingsStore();
 
-const inputModel = defineModel();
-inputModel.value = store.get(props.path);
+const inputModel = ref(store.get(props.path));
+let oldInputValue = inputModel.value;
+
 const inputId = useId();
 const inputLabelId = useId();
 
@@ -50,6 +51,14 @@ const hasChanged = computed(() =>
     inputModel.value !== store.get(props.path)
 );
 
+watch(store, (newValue) => {
+    const newInputValue = newValue.get(props.path);
+    if (inputModel.value === oldInputValue) {
+        inputModel.value = newInputValue;
+        oldInputValue = newInputValue;
+    };
+});
+
 const apply = function apply () {
     store.set(props.path, inputModel.value);
 };