From a0e193e3435bec109e2df48e004c215ddae1190e Mon Sep 17 00:00:00 2001
From: John O'Keefe <jokeefe@fastmail.com>
Date: Tue, 13 Aug 2024 19:36:39 -0400
Subject: [PATCH] fixed frontend login updating

---
 frontend/src/App.svelte                       | 28 +++++++++++--------
 .../GlobalVariablesAndHelperFunctions.svelte  | 23 +++++++++++++--
 2 files changed, 36 insertions(+), 15 deletions(-)

diff --git a/frontend/src/App.svelte b/frontend/src/App.svelte
index 080e1ef..ec600d8 100644
--- a/frontend/src/App.svelte
+++ b/frontend/src/App.svelte
@@ -12,6 +12,8 @@
         simklUser,
         simklWatchList,
         title,
+        watchListPage,
+        animePerPage,
     } from "./GlobalVariablesAndHelperFunctions.svelte";
     import {
         CheckIfAniListLoggedIn,
@@ -41,8 +43,10 @@
     aniListWatchlist.subscribe((value) => aniListWatchListLoaded = value)
 
 
-    let page = 1
-    let perPage = 20
+    let page: number
+    let perPage: number
+    watchListPage.subscribe(value => page = value)
+    animePerPage.subscribe(value => perPage = value)
     const size = "xl"
 
     onMount(async () => {
@@ -84,9 +88,9 @@
         })
     })
 
-    function ChangeWathcListPage(newPage: number) {
+    function ChangeWatchListPage(newPage: number) {
         GetAniListUserWatchingList(newPage, perPage, MediaListSort.UpdatedTimeDesc).then((result) => {
-            page = newPage
+            watchListPage.set(newPage)
             aniListWatchlist.set(result)
             aniListLoggedIn.set(true)
         })
@@ -111,19 +115,19 @@
                             </li>
                         {:else}
                             <li>
-                                <button on:click={() => ChangeWathcListPage(page-1)}
+                                <button on:click={() => ChangeWatchListPage(page-1)}
                                    class="flex items-center justify-center px-4 h-10 ms-0 leading-tight text-gray-500 bg-white border border-e-0 border-gray-300 rounded-s-lg hover:bg-gray-100 hover:text-gray-700 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white">Previous</button>
                             </li>
                         {/if}
                         {#each {length: aniListWatchListLoaded.data.Page.pageInfo.lastPage} as _, i}
                             {#if i+1 === page}
                                 <li>
-                                    <button on:click={() => ChangeWathcListPage(i+1)}
+                                    <button on:click={() => ChangeWatchListPage(i+1)}
                                             class="flex items-center justify-center px-4 h-10 leading-tight border border-gray-300 bg-gray-100 dark:border-gray-700 dark:bg-gray-700 dark:text-white">{i+1}</button>
                                 </li>
                             {:else}
                                 <li>
-                                    <button on:click={() => ChangeWathcListPage(i+1)}
+                                    <button on:click={() => ChangeWatchListPage(i+1)}
                                        class="flex items-center justify-center px-4 h-10 leading-tight text-gray-500 bg-white border border-gray-300 hover:bg-gray-100 hover:text-gray-700 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white">{i+1}</button>
                                 </li>
                             {/if}
@@ -136,7 +140,7 @@
                             </li>
                         {:else}
                             <li>
-                                <button on:click={() => ChangeWathcListPage(page+1)}
+                                <button on:click={() => ChangeWatchListPage(page+1)}
                                    class="flex items-center justify-center px-4 h-10 leading-tight text-gray-500 bg-white border border-gray-300 rounded-e-lg hover:bg-gray-100 hover:text-gray-700 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white">Next</button>
                             </li>
                         {/if}
@@ -188,19 +192,19 @@
                             </li>
                         {:else}
                             <li>
-                                <button on:click={() => ChangeWathcListPage(page-1)}
+                                <button on:click={() => ChangeWatchListPage(page-1)}
                                         class="flex items-center justify-center px-4 h-10 ms-0 leading-tight text-gray-500 bg-white border border-e-0 border-gray-300 rounded-s-lg hover:bg-gray-100 hover:text-gray-700 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white">Previous</button>
                             </li>
                         {/if}
                         {#each {length: aniListWatchListLoaded.data.Page.pageInfo.lastPage} as _, i}
                             {#if i+1 === page}
                                 <li>
-                                    <button on:click={() => ChangeWathcListPage(i+1)}
+                                    <button on:click={() => ChangeWatchListPage(i+1)}
                                             class="flex items-center justify-center px-4 h-10 leading-tight border border-gray-300 bg-gray-100 dark:border-gray-700 dark:bg-gray-700 dark:text-white">{i+1}</button>
                                 </li>
                             {:else}
                                 <li>
-                                    <button on:click={() => ChangeWathcListPage(i+1)}
+                                    <button on:click={() => ChangeWatchListPage(i+1)}
                                             class="flex items-center justify-center px-4 h-10 leading-tight text-gray-500 bg-white border border-gray-300 hover:bg-gray-100 hover:text-gray-700 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white">{i+1}</button>
                                 </li>
                             {/if}
@@ -213,7 +217,7 @@
                             </li>
                         {:else}
                             <li>
-                                <button on:click={() => ChangeWathcListPage(page+1)}
+                                <button on:click={() => ChangeWatchListPage(page+1)}
                                         class="flex items-center justify-center px-4 h-10 leading-tight text-gray-500 bg-white border border-gray-300 rounded-e-lg hover:bg-gray-100 hover:text-gray-700 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white">Next</button>
                             </li>
                         {/if}
diff --git a/frontend/src/GlobalVariablesAndHelperFunctions.svelte b/frontend/src/GlobalVariablesAndHelperFunctions.svelte
index 33d11bf..741977b 100644
--- a/frontend/src/GlobalVariablesAndHelperFunctions.svelte
+++ b/frontend/src/GlobalVariablesAndHelperFunctions.svelte
@@ -1,7 +1,7 @@
 <script lang="ts" context="module">
     import {
         GetAniListItem,
-        GetAniListLoggedInUser, GetMyAnimeListLoggedInUser,
+        GetAniListLoggedInUser, GetAniListUserWatchingList, GetMyAnimeListLoggedInUser,
         GetSimklLoggedInUser
     } from "../wailsjs/go/main/App";
     import type {
@@ -10,7 +10,7 @@
     } from "./anilist/types/AniListCurrentUserWatchListType.js";
     import {writable} from 'svelte/store'
     import type {SimklUser, SimklWatchList} from "./simkl/types/simklTypes";
-    import {type AniListUser} from "./anilist/types/AniListTypes";
+    import {type AniListUser, MediaListSort} from "./anilist/types/AniListTypes";
     import type {MyAnimeListUser} from "./mal/types/MALTypes";
 
     export let aniListAnime: AniListGetSingleAnime
@@ -26,6 +26,16 @@
     export let malUser = writable({} as MyAnimeListUser)
     export let aniListWatchlist = writable({} as AniListCurrentUserWatchList)
 
+    export let watchListPage = writable(1)
+    export let animePerPage = writable(20)
+
+    let isAniListPrimary: boolean
+    let page: number
+    let perPage: number
+    aniListPrimary.subscribe(value => isAniListPrimary = value)
+    watchListPage.subscribe(value => page = value)
+    animePerPage.subscribe(value => perPage = value)
+
     export function GetAniListSingleItemAndOpenModal(aniId: number, login: boolean): void {
         GetAniListItem(aniId, login).then(result => {
             aniListAnime = result
@@ -46,7 +56,14 @@
     export function loginToAniList(): void {
         GetAniListLoggedInUser().then(result => {
             aniListUser.set(result)
-            aniListLoggedIn.set(true)
+            if (isAniListPrimary) {
+                GetAniListUserWatchingList(page, perPage, MediaListSort.UpdatedTimeDesc).then((result) => {
+                    aniListWatchlist.set(result)
+                    aniListLoggedIn.set(true)
+                })
+            } else {
+                aniListLoggedIn.set(true)
+            }
         })
     }