Fix advanced rendering, ads showing over modals (#3029)

apps/app-frontend/src/components/ui/settings/AppearanceSettings.vue

@@ -10,9 +10,13 @@ const themeStore = useTheming()
 const os = ref(await getOS())
 const settings = ref(await get())
 
-watch(settings, async () => {
-  await set(settings.value)
-})
+watch(
+  settings,
+  async () => {
+    await set(settings.value)
+  },
+  { deep: true },
+)
 </script>
 <template>
   <h2 class="m-0 text-2xl">Color theme</h2>
@@ -88,16 +92,11 @@ watch(settings, async () => {
     </div>
     <DropdownSelect
       id="opening-page"
+      v-model="settings.default_page"
       name="Opening page dropdown"
       :options="['Home', 'Library']"
-      :default-value="settings.default_page"
-      :model-value="settings.default_page"
       class="opening-page"
-      @change="
-        (e) => {
-          settings.default_page = e.option
-        }
-      "
+      @change="updateDefaultPage"
     />
   </div>
 </template>

apps/app-frontend/src/components/ui/settings/PrivacySettings.vue

@@ -6,15 +6,19 @@ import { optInAnalytics, optOutAnalytics } from '@/helpers/analytics'
 
 const settings = ref(await get())
 
-watch(settings, async () => {
-  if (settings.value.telemetry) {
-    optInAnalytics()
-  } else {
-    optOutAnalytics()
-  }
+watch(
+  settings,
+  async () => {
+    if (settings.value.telemetry) {
+      optInAnalytics()
+    } else {
+      optOutAnalytics()
+    }
 
-  await set(settings.value)
-})
+    await set(settings.value)
+  },
+  { deep: true },
+)
 </script>
 
 <template>

apps/app-frontend/src/components/ui/settings/ResourceManagementSettings.vue

@@ -10,15 +10,19 @@ import { open } from '@tauri-apps/plugin-dialog'
 
 const settings = ref(await get())
 
-watch(settings, async () => {
-  const setSettings = JSON.parse(JSON.stringify(settings.value))
+watch(
+  settings,
+  async () => {
+    const setSettings = JSON.parse(JSON.stringify(settings.value))
 
-  if (!setSettings.custom_dir) {
-    setSettings.custom_dir = null
-  }
+    if (!setSettings.custom_dir) {
+      setSettings.custom_dir = null
+    }
 
-  await set(setSettings)
-})
+    await set(setSettings)
+  },
+  { deep: true },
+)
 
 async function purgeCache() {
   await purge_cache_types([