From a2576b044c7220825e39ce4d7a3defe38b45cb85 Mon Sep 17 00:00:00 2001
From: John O'Keefe <jrokeefe@protonmail.com>
Date: Sun, 29 Mar 2026 10:23:58 -0400
Subject: [PATCH] feat: implement dynamic sort parameter for AniList watchlist

Add configurable sort functionality to AniList watchlist system:

- Add aniListSort writable store to GlobalVariablesAndHelperFunctions
- Update Pagination component to subscribe to and use dynamic sort parameter
- Refactor CheckIfAniListLoggedInAndLoadWatchList to use sort from store
- Remove hardcoded MediaListSort.UpdatedTimeDesc in favor of configurable sort
- Improve code formatting with arrow functions and consistent spacing
- Add sort parameter to all GetAniListUserWatchingList calls

This allows users to customize their watchlist sorting preference instead of being limited to the default 'updated time descending' sort order.
---
 .../src/helperComponents/Pagination.svelte    | 28 ++++----
 ...ckIfAniListLoggedInAndLoadWatchList.svelte | 71 +++++++++++--------
 .../GlobalVariablesAndHelperFunctions.svelte  | 10 ++-
 3 files changed, 58 insertions(+), 51 deletions(-)

diff --git a/frontend/src/helperComponents/Pagination.svelte b/frontend/src/helperComponents/Pagination.svelte
index 0acaf50..061bc03 100644
--- a/frontend/src/helperComponents/Pagination.svelte
+++ b/frontend/src/helperComponents/Pagination.svelte
@@ -1,6 +1,7 @@
 <script lang="ts">
   import {
     aniListLoggedIn,
+    aniListSort,
     aniListWatchlist,
     animePerPage,
     watchListPage,
@@ -8,24 +9,21 @@
 
   import type { AniListCurrentUserWatchList } from "../anilist/types/AniListCurrentUserWatchListType";
   import { GetAniListUserWatchingList } from "../../wailsjs/go/main/App";
-  import { MediaListSort } from "../anilist/types/AniListTypes";
 
   let aniListWatchListLoaded: AniListCurrentUserWatchList;
   let page: number;
   let perPage: number;
+  let sort: string;
 
   watchListPage.subscribe((value) => (page = value));
   animePerPage.subscribe((value) => (perPage = value));
   aniListWatchlist.subscribe((value) => (aniListWatchListLoaded = value));
+  aniListSort.subscribe((value) => (sort = value));
 
   const perPageOptions = [10, 20, 50];
 
   function ChangeWatchListPage(newPage: number) {
-    GetAniListUserWatchingList(
-      newPage,
-      perPage,
-      MediaListSort.UpdatedTimeDesc,
-    ).then((result) => {
+    GetAniListUserWatchingList(newPage, perPage, sort).then((result) => {
       watchListPage.set(newPage);
       aniListWatchlist.set(result);
       aniListLoggedIn.set(true);
@@ -45,16 +43,14 @@
   function changeCountPerPage(
     e: Event & { currentTarget: HTMLSelectElement },
   ): void {
-    GetAniListUserWatchingList(
-      1,
-      Number(e.currentTarget.value),
-      MediaListSort.UpdatedTimeDesc,
-    ).then((result) => {
-      animePerPage.set(Number(e.currentTarget.value));
-      watchListPage.set(1);
-      aniListWatchlist.set(result);
-      aniListLoggedIn.set(true);
-    });
+    GetAniListUserWatchingList(1, Number(e.currentTarget.value), sort).then(
+      (result) => {
+        animePerPage.set(Number(e.currentTarget.value));
+        watchListPage.set(1);
+        aniListWatchlist.set(result);
+        aniListLoggedIn.set(true);
+      },
+    );
   }
 </script>
 
diff --git a/frontend/src/helperModules/CheckIfAniListLoggedInAndLoadWatchList.svelte b/frontend/src/helperModules/CheckIfAniListLoggedInAndLoadWatchList.svelte
index f278c28..cebdd5c 100644
--- a/frontend/src/helperModules/CheckIfAniListLoggedInAndLoadWatchList.svelte
+++ b/frontend/src/helperModules/CheckIfAniListLoggedInAndLoadWatchList.svelte
@@ -1,34 +1,47 @@
 <script lang="ts" context="module">
-    import {CheckIfAniListLoggedIn, GetAniListLoggedInUser, GetAniListUserWatchingList} from "../../wailsjs/go/main/App";
-    import {MediaListSort} from "../anilist/types/AniListTypes";
-    import { aniListUser, watchListPage, animePerPage, aniListPrimary, aniListLoggedIn, aniListWatchlist } from "./GlobalVariablesAndHelperFunctions.svelte"
+  import {
+    CheckIfAniListLoggedIn,
+    GetAniListLoggedInUser,
+    GetAniListUserWatchingList,
+  } from "../../wailsjs/go/main/App";
+  import {
+    aniListUser,
+    watchListPage,
+    animePerPage,
+    aniListPrimary,
+    aniListLoggedIn,
+    aniListWatchlist,
+    aniListSort,
+  } from "./GlobalVariablesAndHelperFunctions.svelte";
 
-    let isAniListPrimary: boolean
-    let page: number
-    let perPage: number
+  let isAniListPrimary: boolean;
+  let page: number;
+  let perPage: number;
+  let sort: string;
 
-    aniListPrimary.subscribe(value => isAniListPrimary = value)
-    watchListPage.subscribe(value => page = value)
-    animePerPage.subscribe(value => perPage = value)
+  aniListPrimary.subscribe((value) => (isAniListPrimary = value));
+  watchListPage.subscribe((value) => (page = value));
+  animePerPage.subscribe((value) => (perPage = value));
+  aniListSort.subscribe((value) => (sort = value));
 
-    export const LoadAniListUser = async () => {
-        await GetAniListLoggedInUser().then(user => {
-            aniListUser.set(user)
-        })
+  export const LoadAniListUser = async () => {
+    await GetAniListLoggedInUser().then((user) => {
+      aniListUser.set(user);
+    });
+  };
+
+  export const LoadAniListWatchList = async () => {
+    await GetAniListUserWatchingList(page, perPage, sort).then((watchList) => {
+      aniListWatchlist.set(watchList);
+    });
+  };
+
+  export const CheckIfAniListLoggedInAndLoadWatchList = async () => {
+    const loggedIn = await CheckIfAniListLoggedIn();
+    if (loggedIn) {
+      await LoadAniListUser();
+      if (isAniListPrimary) await LoadAniListWatchList();
     }
-
-    export const LoadAniListWatchList = async () => {
-        await GetAniListUserWatchingList(page, perPage, MediaListSort.UpdatedTimeDesc).then((watchList) => {
-            aniListWatchlist.set(watchList)
-        })
-    }
-
-    export const CheckIfAniListLoggedInAndLoadWatchList = async () => {
-        const loggedIn = await CheckIfAniListLoggedIn()
-        if (loggedIn) {
-            await LoadAniListUser()
-            if (isAniListPrimary) await LoadAniListWatchList()
-        }
-        aniListLoggedIn.set(loggedIn)
-    }
-</script>
\ No newline at end of file
+    aniListLoggedIn.set(loggedIn);
+  };
+</script>
diff --git a/frontend/src/helperModules/GlobalVariablesAndHelperFunctions.svelte b/frontend/src/helperModules/GlobalVariablesAndHelperFunctions.svelte
index 41c03a8..50bacec 100644
--- a/frontend/src/helperModules/GlobalVariablesAndHelperFunctions.svelte
+++ b/frontend/src/helperModules/GlobalVariablesAndHelperFunctions.svelte
@@ -53,6 +53,7 @@
   export let loading = writable(false);
   export let tableItems = writable([] as TableItems);
   export let watchlistNeedsRefresh = writable(false);
+  export let aniListSort = writable(MediaListSort.UpdatedTimeDesc);
 
   export let watchListPage = writable(1);
   export let animePerPage = writable(20);
@@ -60,6 +61,7 @@
   let isAniListPrimary: boolean;
   let page: number;
   let perPage: number;
+  let sort: string;
   let aniWatchlist: AniListCurrentUserWatchList;
   let currentAniListAnime: AniListGetSingleAnime;
 
@@ -73,6 +75,7 @@
   malLoggedIn.subscribe((value) => (isMalLoggedIn = value));
   simklLoggedIn.subscribe((value) => (isSimklLoggedIn = value));
   aniListAnime.subscribe((value) => (currentAniListAnime = value));
+  aniListSort.subscribe((value) => (sort = value));
 
   export async function GetAnimeSingleItem(
     aniId: number,
@@ -136,11 +139,7 @@
     GetAniListLoggedInUser().then((result) => {
       aniListUser.set(result);
       if (isAniListPrimary) {
-        GetAniListUserWatchingList(
-          page,
-          perPage,
-          MediaListSort.UpdatedTimeDesc,
-        ).then((result) => {
+        GetAniListUserWatchingList(page, perPage, sort).then((result) => {
           aniListWatchlist.set(result);
           aniListLoggedIn.set(true);
         });
@@ -184,4 +183,3 @@
     });
   }
 </script>
-