From 74afccea75171c51186f8cbfc33421d83233e347 Mon Sep 17 00:00:00 2001
From: NoCrypt <57245077+NoCrypt@users.noreply.github.com>
Date: Sun, 1 Sep 2024 08:41:31 +0700
Subject: [PATCH] fix: adapt to migu

---
 common/App.svelte                             |  6 ++--
 common/Router.svelte                          |  5 +++
 common/components/GestureLock.svelte          | 10 ++++--
 common/components/Navbar.svelte               | 36 +++++++++----------
 common/views/Player/Player.svelte             | 10 +++---
 .../Settings/HomeSectionsSettings.svelte      |  6 ++--
 common/views/Settings/Settings.svelte         | 26 +++++++-------
 7 files changed, 53 insertions(+), 46 deletions(-)

diff --git a/common/App.svelte b/common/App.svelte
index 0d991b6..803c5d7 100644
--- a/common/App.svelte
+++ b/common/App.svelte
@@ -3,7 +3,7 @@
   import { writable } from 'simple-store-svelte'
   import { anilistClient } from '@/modules/anilist.js'
   import IPC from '@/modules/ipc.js'
-  import { rss } from './views/TorrentSearch/TorrentModal.svelte'
+  // import { rss } from './views/TorrentSearch/TorrentModal.svelte'
 
   export const page = writable('home')
   export const view = writable(null)
@@ -38,7 +38,7 @@
     if (!state) return
     ignoreNext = true
     view.set(null)
-    rss.set(null)
+    // rss.set(null)
     if (document.fullscreenElement) {
       document.exitFullscreen();
       if (state.type === 'view') page.set('home')
@@ -61,7 +61,6 @@
   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)
@@ -105,6 +104,7 @@
 
     $updateModal = false
   })
+  
 
 </script>
 
diff --git a/common/Router.svelte b/common/Router.svelte
index e6ae382..400e2d8 100644
--- a/common/Router.svelte
+++ b/common/Router.svelte
@@ -23,6 +23,7 @@
   import { client } from '@/modules/torrent.js';
   import { settings } from '@/modules/settings.js';
   import IPC from '@/modules/ipc.js';
+  import { rss } from './views/TorrentSearch/TorrentModal.svelte';
 
   export let page = 'home'
 
@@ -32,6 +33,10 @@
   onMount(() => {
     // Check update
     if($settings.enableAutoUpdate && SUPPORTS.update) IPC.emit('update')
+
+    window.addEventListener('popstate', e => {
+      $rss = null
+    })
   });
 
   function closeMiniplayer() {
diff --git a/common/components/GestureLock.svelte b/common/components/GestureLock.svelte
index 0eebe63..e18e4c0 100644
--- a/common/components/GestureLock.svelte
+++ b/common/components/GestureLock.svelte
@@ -1,5 +1,6 @@
 <script>
   import { click } from "@/modules/click.js";
+  import { Lock } from 'lucide-svelte'
 
   export let isLocked = false;
   let lockImmersed = false;
@@ -34,9 +35,12 @@
     style="padding: 28px"
   >
     <span
-      class="material-symbols-outlined pointer lock-button"
+      class="icon pointer lock-button"
       class:opacity-0={lockImmersed}
-      use:click={() => (isLocked = false)}>lock</span
+      use:click={() => (isLocked = false)}>
+        <Lock size='2.5rem' strokeWidth={2.5} />
+
+      </span
     >
   </div>
 {/if}
@@ -54,7 +58,7 @@
     color: white;
   }
 
-  .material-symbols-outlined {
+  .icon {
     font-size: 2.8rem;
     padding: 1.5rem;
     display: flex;
diff --git a/common/components/Navbar.svelte b/common/components/Navbar.svelte
index 7d0996c..ba2c938 100644
--- a/common/components/Navbar.svelte
+++ b/common/components/Navbar.svelte
@@ -4,7 +4,7 @@
   import { rss } from '@/views/TorrentSearch/TorrentModal.svelte'
   import NavbarLink from './NavbarLink.svelte'
   import { MagnifyingGlass } from 'svelte-radix'
-  import { Users, Clock, Settings, Heart, ListVideo } from 'lucide-svelte'
+  import { Users, Clock, Settings, Heart, ListVideo, House } from 'lucide-svelte'
   const view = getContext('view')
   export let page
 
@@ -15,34 +15,34 @@
     $rss = null
   }
 
-  function close () {
-    page = 'home'
-    noModals()
-  }
 </script>
 
-<nav class='navbar navbar-fixed-bottom d-block d-md-none border-0 bg-dark'>
+<nav class='navbar navbar-fixed-bottom d-block d-md-none border-0 bg-dark' style='border-top: 1.5px #fff2 solid !important;'>
   <div class='navbar-menu h-full d-flex flex-row justify-content-center align-items-center m-0 pb-5' class:animate={page !== 'player'}>
-    <img src='./logo_filled.png' class='w-50 h-50 m-10 pointer p-5' alt='ico' use:click={close} />
-    <NavbarLink click={() => { page = 'search' }} _page='search' css='ml-auto' icon='search' {page} let:active>
-      <MagnifyingGlass size='2rem' class='flex-shrink-0 p-5 w-30 h-30 m-5 rounded' stroke-width={active ? '2' : '0'} stroke='currentColor' />
+    <!-- <img src='./logo_filled.png' class='w-50 h-50 m-10 pointer p-5' alt='ico'  /> -->
+    <NavbarLink click={() => { page = 'home'; noModals()}} _page='home' icon='home' {page} let:active>
+      <House size='2.2rem' class='flex-shrink-0 p-5 w-30 h-30 m-5 rounded' strokeWidth={active ? '3.5' : '2'} />
     </NavbarLink>
-    <NavbarLink click={() => { page = 'schedule' }} _page='schedule' icon='schedule' {page} let:active>
-      <Clock size='2rem' class='flex-shrink-0 p-5 w-30 h-30 m-5 rounded' strokeWidth={active ? '3.5' : '2'} />
+    <NavbarLink click={() => { page = 'search'; noModals()}} _page='search' icon='search' {page} let:active>
+      <MagnifyingGlass size='2.2rem' class='flex-shrink-0 p-5 w-30 h-30 m-5 rounded' stroke-width={active ? '2' : '0'} stroke='currentColor' />
     </NavbarLink>
     {#if $media?.media}
-      <NavbarLink click={() => { $view = $media.media }} icon='queue_music' {page} let:active>
-        <ListVideo size='2rem' class='flex-shrink-0 p-5 w-30 h-30 m-5 rounded' strokeWidth={active ? '3.5' : '2'} />
+      <NavbarLink click={() => { noModals(false) }} icon='queue_music' {page} let:active>
+        <ListVideo size='2.2rem' class='flex-shrink-0 p-5 w-30 h-30 m-5 rounded' strokeWidth={active ? '3.5' : '2'} />
+      </NavbarLink>
+    {:else}
+      <NavbarLink click={() => { page = 'schedule'; noModals() }} _page='schedule' icon='schedule' {page} let:active>
+        <Clock size='2.2rem' class='flex-shrink-0 p-5 w-30 h-30 m-5 rounded' strokeWidth={active ? '3.5' : '2'} />
       </NavbarLink>
     {/if}
-    <NavbarLink click={() => { page = 'watchtogether' }} _page='watchtogether' icon='groups' {page} let:active>
-      <Users size='2rem' class='flex-shrink-0 p-5 w-30 h-30 m-5 rounded' strokeWidth={active ? '3.5' : '2'} />
+    <NavbarLink click={() => { page = 'watchtogether'; noModals() }} _page='watchtogether' icon='groups' {page} let:active>
+      <Users size='2.2rem' class='flex-shrink-0 p-5 w-30 h-30 m-5 rounded' strokeWidth={active ? '3.5' : '2'} />
     </NavbarLink>
     <!-- <NavbarLink click={() => { IPC.emit('open', 'https://github.com/sponsors/ThaUnknown/') }} icon='favorite' css='ml-auto donate' {page} let:active>
-      <Heart size='2rem' class='flex-shrink-0 p-5 w-30 h-30 m-5 rounded donate' strokeWidth={active ? '3.5' : '2'} fill='currentColor' />
+      <Heart size='2.2rem' class='flex-shrink-0 p-5 w-30 h-30 m-5 rounded donate' strokeWidth={active ? '3.5' : '2'} fill='currentColor' />
     </NavbarLink> -->
-    <NavbarLink click={() => { page = 'settings' }} _page='settings' icon='settings' css='ml-auto' {page} let:active>
-      <Settings size='2rem' class='flex-shrink-0 p-5 w-30 h-30 m-5 rounded' strokeWidth={active ? '3.5' : '2'} />
+    <NavbarLink click={() => { page = 'settings'; noModals() }} _page='settings' icon='settings' css='ml-auto' {page} let:active>
+      <Settings size='2.2rem' class='flex-shrink-0 p-5 w-30 h-30 m-5 rounded' strokeWidth={active ? '3.5' : '2'} />
     </NavbarLink>
   </div>
 </nav>
diff --git a/common/views/Player/Player.svelte b/common/views/Player/Player.svelte
index 40d10da..8b7aa6c 100644
--- a/common/views/Player/Player.svelte
+++ b/common/views/Player/Player.svelte
@@ -18,7 +18,7 @@
   import { SUPPORTS } from '@/modules/support.js'
   import 'rvfc-polyfill'
   import IPC from '@/modules/ipc.js'
-  import { ArrowDown, ArrowUp, Captions, Cast, CircleHelp, Contrast, FastForward, Keyboard, List, ListMusic, ListVideo, Maximize, Minimize, Pause, PictureInPicture, PictureInPicture2, Play, Proportions, RefreshCcw, Rewind, RotateCcw, RotateCw, ScreenShare, SkipBack, SkipForward, Users, Volume1, Volume2, VolumeX } from 'lucide-svelte'
+  import { ArrowDown, ArrowUp, Captions, Cast, CircleHelp, Contrast, FastForward, Keyboard, List, ListMusic, ListVideo, Lock, Maximize, Minimize, Pause, PictureInPicture, PictureInPicture2, Play, Proportions, RefreshCcw, Rewind, RotateCcw, RotateCw, ScreenShare, SkipBack, SkipForward, Users, Volume1, Volume2, VolumeX } from 'lucide-svelte'
   import { swipeControls } from '@/modules/swipecontrol.js';
   import { volumeScroll } from '@/modules/volumescroll.js';
   import GestureLock from '@/components/GestureLock.svelte';
@@ -1249,7 +1249,9 @@
         <Keyboard size='2.5rem' strokeWidth={2.5} />
       </span>
       {#if SUPPORTS.isAndroid}
-        <span class='material-symbols-outlined ctrl' use:click={() => (isLocked = true)}> lock </span>
+        <span class='icon ctrl mr-5 d-flex align-items-center h-full' use:click={() => (isLocked = true)}>
+          <Lock size='2.5rem' strokeWidth={2.5} />
+        </span>
       {/if}
       {#if 'audioTracks' in HTMLVideoElement.prototype && video?.audioTracks?.length > 1}
         <div class='dropdown dropup with-arrow' use:click={toggleDropdown}>
@@ -1434,10 +1436,6 @@
     align-items: center;
     height: 100%;
   }
-  .bind.material-symbols-outlined {
-    font-size: 2.2rem !important;
-    font-weight: unset !important;
-  }
   .stats {
     font-size: 2.3rem !important;
     padding-top: 1.5rem;
diff --git a/common/views/Settings/HomeSectionsSettings.svelte b/common/views/Settings/HomeSectionsSettings.svelte
index f66df03..4367cef 100644
--- a/common/views/Settings/HomeSectionsSettings.svelte
+++ b/common/views/Settings/HomeSectionsSettings.svelte
@@ -17,7 +17,7 @@
 
   $: {
     if (draggingItemIndex != null && hoveredItemIndex != null && draggingItemIndex !== hoveredItemIndex) {
-      swapItem(draggingItemIndex, hoveredItemIndex)
+      [homeSections[draggingItemIndex], homeSections[hoveredItemIndex]] = [homeSections[hoveredItemIndex], homeSections[draggingItemIndex]]
 
       draggingItemIndex = hoveredItemIndex
     }
@@ -78,12 +78,12 @@
       <div class='input-group-prepend'>
         <!-- svelte-ignore a11y-no-noninteractive-tabindex -->
         <!-- svelte-ignore a11y-click-events-have-key-events -->
-        <button on:click={() => moveItem(index, 'up')} class='input-group-text d-flex justify-content-center px-5 material-symbols-outlined font-size-20 pointer'><ArrowUp size='1.8rem' /></button>
+        <button on:click={() => moveItem(index, 'up')} class='input-group-text d-flex justify-content-center px-5 font-size-20 pointer'><ArrowUp size='1.8rem' /></button>
       </div>
       <div class='input-group-prepend'>
         <!-- svelte-ignore a11y-no-noninteractive-tabindex -->
         <!-- svelte-ignore a11y-click-events-have-key-events -->
-        <button on:click={() => moveItem(index, 'down')} class='input-group-text d-flex justify-content-center px-5 material-symbols-outlined font-size-20 pointer'><ArrowDown size='1.8rem' /></button>
+        <button on:click={() => moveItem(index, 'down')} class='input-group-text d-flex justify-content-center px-5 font-size-20 pointer'><ArrowDown size='1.8rem' /></button>
       </div>
     {/if}
     <select class='form-control bg-dark w-400 mw-full' bind:value={homeSections[index]}>
diff --git a/common/views/Settings/Settings.svelte b/common/views/Settings/Settings.svelte
index b35a6eb..9f869ff 100644
--- a/common/views/Settings/Settings.svelte
+++ b/common/views/Settings/Settings.svelte
@@ -16,7 +16,7 @@
     sunos: 'SunOS',
     win32: 'Windows'
   }
-  export let version = '1.0.0'
+  let version = '1.0.0'
   IPC.on('version', data => (version = data))
   IPC.emit('version')
 
@@ -57,11 +57,11 @@
     app: {
       name: 'App',
       icon: Settings
+    },
+    changelog: {
+      name: 'Changelog',
+      icon: Logs
     }
-    // changelog: {
-    //   name: 'Changelog',
-    //   icon: Logs
-    // }
   }
   function pathListener (data) {
     $settings.torrentPathNew = data
@@ -75,7 +75,7 @@
     if (anilistClient.userID?.viewer?.data?.Viewer) {
       $logout = true
     } else {
-      IPC.emit('open', 'https://anilist.co/api/v2/oauth/authorize?client_id=20321&response_type=token') // Change redirect_url to migu://auth/
+      IPC.emit('open', 'https://anilist.co/api/v2/oauth/authorize?client_id=20321&response_type=token') // Change redirect_url to migu://auth
       if (platformMap[window.version.platform] === 'Linux') {
         toast('Support Notification', {
           description: "If your linux distribution doesn't support custom protocol handlers, you can simply paste the full URL into the app.",
@@ -95,7 +95,7 @@
 </script>
 
 <Tabs>
-  <div class='d-flex w-full h-full position-relative settings root flex-md-row flex-column overflow-y-auto overflow-y-md-hidden' style="padding-top: var(--safe-area-top)" use:smoothScroll>
+  <div class='d-flex w-full h-full position-relative settings root flex-md-row flex-column overflow-y-auto overflow-y-md-hidden' use:smoothScroll>
     <div class='d-flex flex-column flex-row h-full w-md-300 bg-dark position-relative px-20 px-md-0 flex-basis-0-md-custom'>
       <div class='px-20 py-15 font-size-24 font-weight-semi-bold'>Settings</div>
       {#each Object.values(groups) as group}
@@ -106,8 +106,8 @@
           </div>
         </TabLabel>
       {/each}
-      <div class='pointer my-5 rounded' tabindex='0' role='button' use:click={() => IPC.emit('open', 'https://github.com/sponsors/ThaUnknown/')}>
-        <!-- <div class='px-20 py-10 d-flex align-items-center'>
+      <!-- <div class='pointer my-5 rounded' tabindex='0' role='button' use:click={() => IPC.emit('open', 'https://github.com/sponsors/ThaUnknown/')}>
+        <div class='px-20 py-10 d-flex align-items-center'>
           <Heart class='pr-10 d-inline-flex' size='3.1rem' />
           <div class='font-size-16 line-height-normal'>Donate</div>
         </div>
@@ -150,11 +150,11 @@
     </Tab>
     <Tab>
       <div class='root h-full w-full overflow-y-md-auto p-20' use:smoothScroll>
-        <AppSettings {version} bind:settings={$settings} />
+        <AppSettings {version} settings={$settings} />
         <div class='h-250' />
       </div>
     </Tab>
-    <!-- <Tab>
+    <Tab>
       <div class='root my-20 px-20 overflow-y-md-auto w-full' use:smoothScroll>
         <div class='h-300 row px-20 px-sm-0'>
           <div class='col-sm-3 d-none d-sm-flex' />
@@ -220,10 +220,10 @@
               </div>
             </div>
           {/each}
-        {/await} 
+        {/await}
         <div class='h-250 d-md-none' />
       </div>
-    </Tab> -->
+    </Tab>
   </div>
 </Tabs>