profile rest

client/app/pages/preferences.vue

@@ -47,19 +47,21 @@
     <!--      <label for="outputDevice">Output device</label> -->
     <!--    </PrimeFloatLabel> -->
 
-    <PrimeDivider align="left">
-      Hotkeys
-    </PrimeDivider>
+    <template v-if="isTauri">
+      <PrimeDivider align="left">
+        Hotkeys
+      </PrimeDivider>
 
-    <PrimeFloatLabel variant="on">
-      <PrimeInputText id="microphoneToggle" :model-value="toggleInputHotkey" fluid @keydown="setupToggleInputHotkey" />
-      <label for="microphoneToggle">Toggle microphone</label>
-    </PrimeFloatLabel>
+      <PrimeFloatLabel variant="on">
+        <PrimeInputText id="microphoneToggle" :model-value="toggleInputHotkey" fluid @keydown="setupToggleInputHotkey" />
+        <label for="microphoneToggle">Toggle microphone</label>
+      </PrimeFloatLabel>
 
-    <PrimeFloatLabel variant="on" class="mt-3">
-      <PrimeInputText id="soundToggle" :model-value="toggleOutputHotkey" fluid @keydown="setupToggleOutputHotkey" />
-      <label for="soundToggle">Toggle sound</label>
-    </PrimeFloatLabel>
+      <PrimeFloatLabel variant="on" class="mt-3">
+        <PrimeInputText id="soundToggle" :model-value="toggleOutputHotkey" fluid @keydown="setupToggleOutputHotkey" />
+        <label for="soundToggle">Toggle sound</label>
+      </PrimeFloatLabel>
+    </template>
 
     <PrimeDivider align="left">
       About
@@ -72,31 +74,28 @@
       COMMIT_SHA: {{ commitSha }}
     </p>
 
-    <PrimeButton
-      v-if="isTauri"
-      class="mt-3"
-      size="small"
-      label="Check for Updates"
-      fluid
-      severity="info"
-      :loading="checking"
-      @click="onCheckForUpdates"
-    />
-  </div>
-
-  <PrimeToast position="bottom-center" group="updater">
-    <template #container="slotProps">
-      <div class="p-3">
-        <div class="font-medium text-lg mb-4">
-          {{ slotProps.message.detail }}
-        </div>
-        <div class="flex gap-3">
-          <PrimeButton size="small" label="Update now" @click="() => {}" />
-          <PrimeButton size="small" label="Later" severity="secondary" outlined @click="slotProps.closeCallback()" />
-        </div>
-      </div>
+    <template v-if="isTauri">
+      <PrimeButton
+        v-if="lastUpdate"
+        class="mt-3"
+        size="small"
+        label="Install new version"
+        fluid
+        severity="success"
+        @click="navigateTo({ name: 'Updater' })"
+      />
+      <PrimeButton
+        v-else
+        class="mt-3"
+        size="small"
+        label="Check for Updates"
+        fluid
+        severity="info"
+        :loading="checking"
+        @click="checkForUpdates"
+      />
     </template>
-  </PrimeToast>
+  </div>
 </template>
 
 <script setup lang="ts">
@@ -106,7 +105,7 @@ definePageMeta({
   name: 'Preferences',
 })
 const { isTauri, version, commitSha } = useApp()
-const { checking, checkForUpdates } = useUpdater()
+const { checking, checkForUpdates, lastUpdate } = useUpdater()
 const {
   inputDeviceId,
   outputDeviceId,
@@ -121,8 +120,6 @@ const {
   audioOutputs,
 } = usePreferences()
 
-const toast = useToast()
-
 const setupToggleInputHotkey = (event: KeyboardEvent) => setupHotkey(event, toggleInputHotkey)
 const setupToggleOutputHotkey = (event: KeyboardEvent) => setupHotkey(event, toggleOutputHotkey)
 
@@ -162,23 +159,4 @@ function setupHotkey(event: KeyboardEvent, model: RemovableRef<string>) {
 
   model.value = hotkey.join('+')
 }
-
-async function onCheckForUpdates() {
-  const update = await checkForUpdates()
-
-  toast.removeGroup('updater')
-
-  if (!update) {
-    toast.add({ severity: 'success', summary: 'You are up to date', closable: false, life: 1000 })
-
-    return
-  }
-
-  toast.add({
-    group: 'updater',
-    severity: 'info',
-    detail: `Version ${update?.version ?? '1.0.1'} is available!`,
-    closable: false,
-  })
-}
 </script>