feat: unify update process for PC and Android

capacitor/src/ipc.js

@@ -36,13 +36,16 @@ main.once('version', async () => {
 })
 
 const updater = new AutoUpdater('https://api.github.com/repos/NoCrypt/migu/releases/latest');
+
 main.on('update', async () => {
-  console.log('[Android Updater] Checking for update...')
   await updater.initialize()
-  // await updater.performUpdate();
-  if (await updater.checkForUpdate()) main.emit('android-update-available')
+  if (await updater.checkForUpdate()) main.emit('update-available')
 })
 
-main.on('android-install-update', async () => {
+main.on('update-download', async () => {
   await updater.performUpdate();
-})
+})
+
+// main.on('quit-and-install', async () => {
+//   main.emit('android-update-downloaded')
+// })

common/App.svelte

@@ -2,7 +2,6 @@
   import { setContext } from 'svelte'
   import { writable } from 'simple-store-svelte'
   import { anilistClient } from '@/modules/anilist.js'
-  import IPC from '@/modules/ipc.js'
 
   export const page = writable('home')
   export const view = writable(null)
@@ -14,6 +13,8 @@
   IPC.on('schedule', () => {
     page.set('schedule')
   })
+
+
 </script>
 
 <script>
@@ -22,17 +23,60 @@
   import ViewAnime from './views/ViewAnime/ViewAnime.svelte'
   import TorrentModal from './views/TorrentSearch/TorrentModal.svelte'
   import Menubar from './components/Menubar.svelte'
-  import { Toaster } from 'svelte-sonner'
+  import { toast, Toaster } from 'svelte-sonner'
   import Logout from './components/Logout.svelte'
   import Navbar from './components/Navbar.svelte'
   import { SUPPORTS } from '@/modules/support.js';
+  import IPC from '@/modules/ipc.js'
+  import UpdateModal, { changeLog, updateModal } from './components/UpdateModal.svelte';
 
   setContext('view', view)
+
+  // Cleaning up your messy IPC UPDATER listeners, 
+  // and unify them for android. smh.
+  // Client IPC listener: update-available, update-downloading, update-downloaded
+  // Server IPC listener: update, update-download, quit-and-install
+
+  IPC.on('update-available', async () => {
+    if (localStorage.getItem('ignoredVersion') !== await changeLog[0].version) {
+      $updateModal = true
+    }
+    
+  })
+
+  IPC.on('update-downloading', () => {
+    toast.loading('Downloading Update...', {
+      duration: Number.POSITIVE_INFINITY, 
+      dismissable: false,
+      cancel:{
+        label: 'Hide',
+        onClick: () => {
+          toast.dismiss()
+        }
+      }
+    })
+  })
+
+  IPC.on('update-downloaded', () => {
+    toast.dismiss()
+    toast.success('Update Downloaded.', {
+      duration: Number.POSITIVE_INFINITY, 
+      action: {
+        label: 'Install',
+        onClick: () => IPC.emit('quit-and-install')
+      }
+    })
+
+    $updateModal = false
+  })
+  $updateModal = true
+
 </script>
 
 <div class='page-wrapper with-transitions bg-dark position-relative' data-sidebar-type='overlayed-all'>
   <Menubar bind:page={$page} />
   <ViewAnime />
+  <UpdateModal />
   <Logout />
   <Sidebar bind:page={$page} />
   <div class='overflow-hidden content-wrapper h-full z-10'>

common/Router.svelte

@@ -36,39 +36,6 @@
     // Check update (ask if on Android, install if on PC)
     if($settings.enableAutoUpdate && SUPPORTS.update) IPC.emit('update')
     if (SUPPORTS.isAndroid) {
-      // Auto updater for android
-      IPC.on('android-update-available', () => {
-        toast.info('Update found', {
-          description: 'Wanna install it?',
-          action: {
-            label: 'Install now',
-            onClick: () => {
-              console.log(version)
-              IPC.emit('android-install-update')
-              toast.loading('Downloading...', {
-                description: 'Please allow the permission when asked. ',
-                duration: Number.POSITIVE_INFINITY, 
-                dismissable: false,
-                cancel:{
-                  label: 'Hide',
-                  onClick: () => {
-                    toast.dismiss()
-                  }
-                }
-              })
-            }
-          },
-          cancel: {
-            label: 'Never show again',
-            onClick: () => {
-              $settings.enableAutoUpdate = false
-              toast('Auto update disabled. You can re-enable it in Settings > App')
-            }
-          },
-          duration: Number.POSITIVE_INFINITY
-        })  
-      })
-
       // Back button support
       let backButtonPressTimeout;
       window.Capacitor.Plugins.App.addListener("backButton", () => {

common/components/Sidebar.svelte

@@ -10,33 +10,35 @@
   import { rss } from '@/views/TorrentSearch/TorrentModal.svelte'
   import IPC from '@/modules/ipc.js'
 
-  let wasUpdated = false
+  // let wasUpdated = false
 
-  globalThis.dd = IPC
+  // globalThis.dd = IPC
 
-  IPC.on('update-available', () => {
-    console.log('uwu')
-    if (!wasUpdated) {
-      // insert icon in 2nd to last position
-      links.splice(links.length - 1, 0, {
-        click: () => {
-          toast('Update is downloading...')
-        },
-        icon: 'download',
-        text: 'Update Downloading...'
-      })
-      links = links
-    }
-    wasUpdated = true
-  })
-  IPC.on('update-downloaded', () => {
-    links[links.length - 2].css = 'update'
-    links[links.length - 2].text = 'Update Ready!'
-    links[links.length - 2].click = () => {
-      IPC.emit('quit-and-install')
-    }
-    links = links
-  })
+  // IPC.on('update-available', () => {
+  //   console.log('uwu')
+  //   if (!wasUpdated) {
+  //     // insert icon in 2nd to last position
+  //     links.splice(links.length - 1, 0, {
+  //       click: () => {
+  //         toast('Update is downloading...')
+  //       },
+  //       icon: 'download',
+  //       text: 'Update Downloading...'
+  //     })
+  //     links = links
+  //   }
+  //   wasUpdated = true
+  // })
+  // IPC.on('update-downloaded', () => {
+  //   links[links.length - 2].css = 'update'
+  //   links[links.length - 2].text = 'Update Ready!'
+  //   links[links.length - 2].click = () => {
+  //     IPC.emit('quit-and-install')
+  //   }
+  //   links = links
+  // })
+
+  // Cleaned up to: common/App.svelte#L40
 
   const view = getContext('view')
 
@@ -109,7 +111,8 @@
       },
       page: 'watchtogether',
       icon: 'groups',
-      text: 'Watch Together'
+      text: 'Watch Together',
+      css: 'mb-auto'
     },
     // {
     //   click: () => {
@@ -125,7 +128,6 @@
         $view = null
         $rss = null
       },
-      css: 'mt-auto',
       page: 'settings',
       icon: 'settings',
       text: 'Settings'

common/components/UpdateModal.svelte

@@ -0,0 +1,135 @@
+<script context='module'>
+  import { click } from '@/modules/click.js'
+  import { writable } from 'simple-store-svelte'
+  import IPC from '@/modules/ipc.js';
+
+  export const updateModal = writable(false)
+  export const changeLog = (async () => {
+    const res = await fetch('https://api.github.com/repos/NoCrypt/migu/releases')
+    const json = await res.json()
+    return [json.map(({ body, tag_name: version, published_at: date, assets }) => ({ body, version, date, assets }))[0]]
+  })()
+</script>
+
+<script>
+  import { SUPPORTS } from "@/modules/support.js";
+
+  let modal
+  let ignoreVersion = false
+  function close () {
+    if (ignoreVersion) {
+      changeLog.then((cl)=>localStorage.setItem('ignoredVersion', cl[0].version))
+    }
+    $updateModal = false
+  }
+  function checkClose ({ keyCode }) {
+    if (keyCode === 27) close()
+  }
+  function confirm () {
+    IPC.emit('update-download')
+    $updateModal = false
+  }
+  $: $updateModal && modal?.focus()
+
+</script>
+  
+  <div class='modal z-40' class:show={$updateModal}>
+    {#if $updateModal}
+      <div class='modal-dialog' on:pointerup|self={close} on:keydown={checkClose} tabindex='-1' role='button' bind:this={modal}>
+        <div class='modal-content d-flex justify-content-center flex-column' style="width: 70rem; overflow-y: hidden">
+          <button class='close pointer z-30 top-20 right-0 position-absolute' type='button' use:click={close}> &times; </button>
+          <!-- <h5 class='modal-title'>Update Available: v.5.6969</h5> -->
+          <p>
+            <!-- changelog -->
+            {#await changeLog}
+              {#each Array(1) as _}
+                <div class='row px-20 px-sm-0'>
+                  <div class='col-sm-3 my-20 order-last order-sm-first '>
+                    <div class='skeloader rounded w-100 h-10 bg-very-dark'>
+                      <div class='skeleloader-swipe' />
+                    </div>
+                  </div>
+                  <div class='col-sm-9'>
+                    <div class='skeloader rounded w-150 h-25 bg-very-dark mb-10'>
+                      <div class='skeleloader-swipe' />
+                    </div>
+                    <div class='skeloader rounded w-250 h-10 bg-very-dark mt-20'>
+                      <div class='skeleloader-swipe' />
+                    </div>
+                    <div class='skeloader rounded w-200 h-10 bg-very-dark mt-15'>
+                      <div class='skeleloader-swipe' />
+                    </div>
+                  </div>
+                </div>
+              {/each}
+          {:then changelog}
+            {#each changelog as { version, date, body }}
+              <div class='row px-20 px-sm-0 position-relative' tabindex='0' role='button'>
+                <div class='col-sm-9 pre-wrap text-muted'>
+                  <h2 class='mt-0 font-weight-bold text-white'>New Update Available</h2>
+                  {version} | {new Date(date).toLocaleDateString('en-US', { month: 'short', day: 'numeric', year: 'numeric' })} <br/>
+                  <hr />
+                  <h4 class='mt-0 font-weight-bold text-white'>Changelog</h4>
+                  {body.replaceAll('- ', '')}
+                </div>
+              </div>
+            {/each}
+          {:catch}
+            {#each Array(1) as _}
+              <div class='row px-20 px-sm-0'>
+                <div class='col-sm-3 my-20 order-last order-sm-first '>
+                  <div class='skeloader rounded w-100 h-10 bg-very-dark'>
+                    <div class='skeleloader-swipe' />
+                  </div>
+                </div>
+                <div class='col-sm-9'>
+                  <div class='skeloader rounded w-150 h-25 bg-very-dark mb-10'>
+                    <div class='skeleloader-swipe' />
+                  </div>
+                  <div class='skeloader rounded w-250 h-10 bg-very-dark mt-20'>
+                    <div class='skeleloader-swipe' />
+                  </div>
+                  <div class='skeloader rounded w-200 h-10 bg-very-dark mt-15'>
+                    <div class='skeleloader-swipe' />
+                  </div>
+                </div>
+              </div>
+            {/each}
+          {/await} 
+          </p>
+          {#if SUPPORTS.isAndroid}
+            <div class='px-20 text-left mt-20'>
+              <p class="pre-wrap text-muted italic">This update was served directly from the GitHub release. If you have downloaded this app from F-Droid or IzzyOnDroid, please be aware that updating this way did not go through the additional screening process typically performed by these platforms.</p>
+            </div>
+          {/if}
+          <div class=' text-right mt-20'>
+            <input type='checkbox' id='player-sub-blur' bind:checked={ignoreVersion}  />
+            <label for='player-sub-blur'>Ignore this version</label>
+          </div>
+          <div class='text-right mt-20'>
+            <button class='btn mr-5 btn-danger' type='button' on:click={close}>{ignoreVersion ? 'Ignore' : 'Cancel'}</button>
+            <button class='btn btn-primary' type='button' on:click={confirm}>Update</button>
+          </div>
+
+        </div>
+      </div>
+    {/if}
+  </div>
+  
+  <style>
+    .close {
+      top: 4rem !important;
+      left: unset !important;
+      right: 2.5rem !important;
+    }
+    .modal {
+        background-color: rgba(0, 0, 0, 0.4) !important;
+    }
+    .modal-dialog:focus-visible {
+      box-shadow: none !important;
+    }
+    .modal:focus-visible {
+      box-shadow: none !important;
+    }
+  </style>
+  

electron/src/main/updater.js

@@ -5,11 +5,17 @@ import { ipcMain, shell } from 'electron'
 log.initialize({ spyRendererConsole: true })
 log.transports.file.level = 'info'
 autoUpdater.logger = log
-ipcMain.on('update', () => {
-  autoUpdater.checkForUpdatesAndNotify()
+autoUpdater.autoDownload = false
+
+ipcMain.on('update', async () => {
+  await autoUpdater.checkForUpdates()
+})
+ipcMain.on('update-download', async () => {
+  await autoUpdater.downloadUpdate()
 })
 
-// autoUpdater.checkForUpdatesAndNotify()
+// ipcMain.on('quit-and-install') is on electron/src/main/app.js#L138
+
 export default class Updater {
   hasUpdate = false
   window