From aabab324135bde04b7cd1b32eaaf1b80bba2f897 Mon Sep 17 00:00:00 2001
From: ThaUnknown <6506529+ThaUnknown@users.noreply.github.com>
Date: Sat, 21 Jun 2025 17:59:38 +0200
Subject: [PATCH] feat: native update handling for forced updates

---
 package.json                               |  2 +-
 src/app.d.ts                               |  2 ++
 src/lib/modules/native.ts                  |  2 ++
 src/routes/update/+page.svelte             | 19 ++++++++-----------
 src/routes/update/InstallWaitButton.svelte | 13 +++++++++++++
 5 files changed, 26 insertions(+), 12 deletions(-)
 create mode 100644 src/routes/update/InstallWaitButton.svelte

diff --git a/package.json b/package.json
index b1a6d18..fb5101f 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "ui",
-	"version": "6.3.71",
+	"version": "6.3.72",
 	"license": "BUSL-1.1",
 	"private": true,
 	"packageManager": "pnpm@9.14.4",
diff --git a/src/app.d.ts b/src/app.d.ts
index 4ac17d5..6968866 100644
--- a/src/app.d.ts
+++ b/src/app.d.ts
@@ -79,6 +79,8 @@ export interface Native {
   openUIDevtools: () => Promise<void>
   openTorrentDevtools: () => Promise<void>
   checkUpdate: () => Promise<void>
+  updateAndRestart: () => Promise<void>
+  updateReady: () => Promise<void>
   toggleDiscordDetails: (enabled: boolean) => Promise<void>
   setMediaSession: (metadata: SessionMetadata, mediaId: number) => Promise<void>
   setPositionState: (state?: MediaPositionState) => Promise<void>
diff --git a/src/lib/modules/native.ts b/src/lib/modules/native.ts
index acf15f5..f0e039b 100644
--- a/src/lib/modules/native.ts
+++ b/src/lib/modules/native.ts
@@ -60,6 +60,8 @@ export default Object.assign<Native, Partial<Native>>({
   focus: async () => undefined,
   close: async () => undefined,
   checkUpdate: async () => undefined,
+  updateAndRestart: async () => undefined,
+  updateReady: () => sleep(rnd(10_000)),
   toggleDiscordDetails: async () => undefined,
   setMediaSession: async (metadata) => { navigator.mediaSession.metadata = new MediaMetadata({ title: metadata.title, artist: metadata.description, artwork: [{ src: metadata.image }] }) },
   setPositionState: async e => navigator.mediaSession.setPositionState(e),
diff --git a/src/routes/update/+page.svelte b/src/routes/update/+page.svelte
index 9435b1c..9067834 100644
--- a/src/routes/update/+page.svelte
+++ b/src/routes/update/+page.svelte
@@ -1,8 +1,9 @@
 <script lang='ts'>
+  import InstallWaitButton from './InstallWaitButton.svelte'
+
   import { Button } from '$lib/components/ui/button'
   import { Menubar } from '$lib/components/ui/menubar'
   import { Separator } from '$lib/components/ui/separator'
-  import * as Tooltip from '$lib/components/ui/tooltip'
   import native from '$lib/modules/native'
   import { outdatedComponent, uiUpdate } from '$lib/modules/update'
 
@@ -18,18 +19,14 @@
       <div class='text-xl text-wrap max-w-full text-center mb-6'>A mandatory update is available for the {#await outdatedComponent then name}{name}{/await}.<br />Please update to continue.</div>
       {#await outdatedComponent then name}
         {#if name === 'client'}
-          <!-- TODO: remove this github releases open and replace it with native client update call!!! -->
-          <Button class='text-md font-bold' size='lg' on:click={() => native.openURL('https://github.com/ThaUnknown/miru/releases/tag/v6.1.0')}>Install</Button>
+          {#await native.updateReady()}
+            <InstallWaitButton />
+          {:then _}
+            <Button class='text-md font-bold' size='lg' on:click={native.updateAndRestart}>Update</Button>
+          {/await}
         {:else}
           {#await uiUpdate}
-            <Tooltip.Root>
-              <Tooltip.Trigger let:builder>
-                <Button builders={[builder]} class='text-md font-bold !pointer-events-auto cursor-wait' disabled>Install</Button>
-              </Tooltip.Trigger>
-              <Tooltip.Content>
-                <p>Waiting for update to download</p>
-              </Tooltip.Content>
-            </Tooltip.Root>
+            <InstallWaitButton />
           {:then _}
             <Button class='text-md font-bold' size='lg' on:click={() => location.reload()}>Install</Button>
           {/await}
diff --git a/src/routes/update/InstallWaitButton.svelte b/src/routes/update/InstallWaitButton.svelte
new file mode 100644
index 0000000..0d6ea36
--- /dev/null
+++ b/src/routes/update/InstallWaitButton.svelte
@@ -0,0 +1,13 @@
+<script lang='ts'>
+  import { Button } from '$lib/components/ui/button'
+  import * as Tooltip from '$lib/components/ui/tooltip'
+</script>
+
+<Tooltip.Root>
+  <Tooltip.Trigger let:builder>
+    <Button builders={[builder]} class='text-md font-bold !pointer-events-auto cursor-wait' disabled>Install</Button>
+  </Tooltip.Trigger>
+  <Tooltip.Content>
+    <p>Waiting for update to download</p>
+  </Tooltip.Content>
+</Tooltip.Root>