docs: update AniList search query in Bruno collection

Add the genre field to the AniList Search GraphQL query in the Bruno API
collection. This keeps the API documentation collection in sync with the
application's query structure, allowing for testing and verification of
genre data retrieval from the AniList API.

AniListFunctions.go

@@ -93,6 +93,7 @@ func (a *App) GetAniListItem(aniId int, login bool) AniListGetSingleAnime {
 					timeUntilAiring
 					episode
 				  }
+				  genres
 				  tags{
 					id
 					name
@@ -222,6 +223,7 @@ func (a *App) AniListSearch(query string) any {
 						  timeUntilAiring
 						  episode
 						}
+						genres
 						tags{
 							id
 							name
@@ -307,6 +309,7 @@ func (a *App) GetAniListUserWatchingList(page int, perPage int, sort string) Ani
 						  timeUntilAiring
 						  episode
 						}
+						genres
 						tags{
 						  id
 						  name

AniListTypes.go

@@ -74,6 +74,7 @@ type MediaList struct {
 			TimeUntilAiring int `json:"timeUntilAiring"`
 			Episode         int `json:"episode"`
 		} `json:"nextAiringEpisode"`
+		Genres []string `json:"genres"`
 		Tags   []struct {
 			Id             int    `json:"id"`
 			Name           string `json:"name"`

MALUserFunctions.go

@@ -308,7 +308,16 @@ func refreshMyAnimeListAuthorizationToken() {
 
 func (a *App) GetMyAnimeListLoggedInUser() MyAnimeListUser {
 	a.MyAnimeListLogin()
+	user := createUser()
+	if user.Name == "" {
+		refreshMyAnimeListAuthorizationToken()
+		user = createUser()
+	}
 
+	return user
+}
+
+func createUser() MyAnimeListUser {
 	client := &http.Client{}
 
 	req, _ := http.NewRequest("GET", "https://api.myanimelist.net/v2/users/@me?fields=anime_statistics", nil)
@@ -335,6 +344,7 @@ func (a *App) GetMyAnimeListLoggedInUser() MyAnimeListUser {
 	}
 
 	return user
+
 }
 
 func (a *App) LogoutMyAnimeList() string {

app.go

@@ -3,9 +3,11 @@ package main
 import (
 	"context"
 	_ "embed"
+	"log"
+	"strings"
+
 	"github.com/wailsapp/wails/v2/pkg/options"
 	"github.com/wailsapp/wails/v2/pkg/runtime"
-	"strings"
 
 	"github.com/tidwall/gjson"
 )
@@ -43,3 +45,14 @@ func (a *App) onSecondInstanceLaunch(secondInstanceData options.SecondInstanceDa
 	runtime.Show(*wailsContext)
 	go runtime.EventsEmit(*wailsContext, "launchArgs", secondInstanceArgs)
 }
+
+func (a *App) ShowVersion() {
+	version := gjson.Get(wailsJSON, "info.productVersion")
+	_, err := runtime.MessageDialog(*wailsContext, runtime.MessageDialogOptions{
+		Title:   "Version",
+		Message: "AniTrack Version: " + version.String(),
+	})
+	if err != nil {
+		log.Println(err)
+	}
+}

bruno/AniTrack/AniList/Get Items/AniList Search.bru

@@ -33,6 +33,7 @@ body:graphql {
   						  english
   						  native
   						}
+        genre
   						description
   						coverImage {
   						  large

bruno/AniTrack/AniList/GetAuthorizationToken.bru

@@ -12,7 +12,7 @@ post {
 
 headers {
   Accept: application/json
-  Content-Type: application/json
+  Content-Type: application/x-www-form-urlencoded
 }
 
 body:form-urlencoded {
@@ -20,7 +20,7 @@ body:form-urlencoded {
   client_id: {{ANILIST_APP_ID}}
   client_secret: {{ANILIST_SECRET_TOKEN}}
   redirect_uri: http://localhost:6734/callback
-  code: {{code}}
+  code: {{ANILIST_CODE}}
 }
 
 body:multipart-form {

bruno/AniTrack/environments/Dev.bru

@@ -9,7 +9,7 @@ vars {
 }
 vars:secret [
   ANILIST_ACCESS_TOKEN,
-  code,
+  ANILIST_CODE,
   SIMKL_AUTH_TOKEN,
   MAL_CODE,
   MAL_VERIFIER,

build/install_linux.sh

@@ -0,0 +1,26 @@
+#!/bin/bash
+
+# copy desktop file
+if [ -e "~/.local/share/applications/AniTrack.desktop" ]; then
+  if [ -d "~/.local/share/applications/" ]; then
+    cp ./AniTrack.desktop ~/.local/share/applications/
+  else
+    mkdir -p ~/.local/share/applications/
+    cp ./AniTrack.desktop ~/.local/share/applications/
+  fi
+fi
+
+# copy icons to xdg folders
+for size in 32 48 64 128; do
+  xdg-icon-resource install --novendor --context apps --size $size ./icon/$size/AniTrack.png AniTrack
+done
+
+# copy AniTrack Binary to $HOME/Applications/
+if ! [ -d "~/Applications" ]; then
+  mkdir -p ~/Applications
+  cp ./bin/AniTrack ~/Applications/
+elif ! [[ -e ~/Applications/AniTrack ]]; then
+  cp ./bin/AniTrack ~/Applications/
+fi
+
+echo "AniTrack has been successfully installed."

frontend/src/App.svelte

@@ -1,7 +1,8 @@
 <script lang="ts">
     import {
-        aniListAnime,
+        aniListLoggedIn,
-        GetAnimeSingleItem,
+        malLoggedIn,
+        simklLoggedIn,
     } from "./helperModules/GlobalVariablesAndHelperFunctions.svelte";
     import {onMount} from "svelte";
     import Router from "svelte-spa-router"
@@ -13,12 +14,19 @@
     import { CheckIfMALLoggedInAndSetUser } from "./helperModules/CheckIfMyAnimeListLoggedIn.svelte";
     import {CheckIfSimklLoggedInAndSetUser} from "./helperModules/CheckIsSimklLoggedIn.svelte"
     import {CheckIfAniListLoggedIn} from "../wailsjs/go/main/App";
-    import {AniListGetSingleAnimeDefaultData} from "./helperDefaults/AniListGetSingleAnime";
 
     onMount(async () => {
-        await CheckIfAniListLoggedInAndLoadWatchList()
+        let isAniListLoggedIn: boolean
-        await CheckIfMALLoggedInAndSetUser()
+        let isMALLoggedIn: boolean
-        await CheckIfSimklLoggedInAndSetUser()
+        let isSimklLoggedIn: boolean
+        aniListLoggedIn.subscribe((value) => isAniListLoggedIn = value)
+        malLoggedIn.subscribe((value) => isMALLoggedIn = value)
+        simklLoggedIn.subscribe((value) => isSimklLoggedIn = value)
+
+        console.log(isAniListLoggedIn)
+        !isAniListLoggedIn && await CheckIfAniListLoggedInAndLoadWatchList()
+        !isMALLoggedIn && await CheckIfMALLoggedInAndSetUser()
+        !isSimklLoggedIn && await CheckIfSimklLoggedInAndSetUser()
     })
 </script>
 
@@ -27,17 +35,7 @@
     '/': Home,
     '/anime/:id': wrap({
         asyncComponent: () => import('./routes/AnimeRoutePage.svelte'),
-        conditions: [
+        conditions: [async () => await CheckIfAniListLoggedIn()],
-            async () => await CheckIfAniListLoggedIn(),
-            async (detail) => {
-                aniListAnime.update(value => {
-                    value = AniListGetSingleAnimeDefaultData
-                    return value
-                })
-                await GetAnimeSingleItem(Number(detail.params.id), true)
-                return Object.keys($aniListAnime).length!==0
-            },
-        ],
         loadingComponent: Spinner
     }),
     // '*': "Not Found"

frontend/src/anilist/types/AniListCurrentUserWatchListType.ts

@@ -2,79 +2,93 @@ export interface AniListCurrentUserWatchList {
   data: {
     Page: {
       pageInfo: {
-                total: number
+        total: number;
-                perPage: number
+        perPage: number;
-                currentPage: number
+        currentPage: number;
-                lastPage: number
+        lastPage: number;
-                hasNextPage: boolean
+        hasNextPage: boolean;
-            },
+      };
-            mediaList: MediaList[]
+      mediaList: MediaList[];
-        }
+    };
-    }
+  };
 }
 
 export interface AniListGetSingleAnime {
   data: {
-        MediaList: MediaList
+    MediaList: MediaList;
-    }
+  };
 }
 
 export interface MediaList {
-    id: number
+  id: number;
-    mediaId: number
+  mediaId: number;
-    userId: number
+  userId: number;
   media: {
-        id: number
+    id: number;
-        idMal: number
+    idMal: number;
     title: {
-            romaji: string
+      romaji: string;
-            english?: string
+      english?: string;
-            native: string
+      native: string;
-        }
+    };
-        description: string
+    description: string;
     coverImage: {
-            large: string
+      large: string;
-        }
+    };
-        season: string
+    season: string;
-        seasonYear: number
+    seasonYear: number;
-        status: string
+    status: string;
-        episodes?: number
+    episodes?: number;
     nextAiringEpisode?: {
-            airingAt: number
+      airingAt: number;
-            timeUntilAiring: number
+      timeUntilAiring: number;
-            episode: number
+      episode: number;
-        }
+    };
-    }
+    genres: string[];
-    status: string
+    tags: [
+      {
+        id: number;
+        name: string;
+        description: string;
+        rank: number;
+        isMediaSpoiler: boolean;
+        isAdult: boolean;
+      },
+    ];
+    isAdult: boolean;
+  };
+  status: string;
   startedAt: {
-        year: number
+    year: number;
-        month: number
+    month: number;
-        day: number
+    day: number;
-    }
+  };
   completedAt: {
-        year?: number
+    year?: number;
-        month?: number
+    month?: number;
-        day?: number
+    day?: number;
-    }
+  };
-    notes?: string
+  notes?: string;
-    progress: number
+  progress: number;
-    score: number
+  score: number;
-    repeat: number
+  repeat: number;
   user: {
-        id: number
+    id: number;
-        name: string
+    name: string;
     avatar: {
-            large: string
+      large: string;
-            medium: string
+      medium: string;
-        }
+    };
     statistics: {
       anime: {
-                count: number
+        count: number;
-                statuses: [{
+        statuses: [
-                    status: string
+          {
-                    count: number
+            status: string;
-                }]
+            count: number;
-            }
+          },
-        }
+        ];
-    }
+      };
+    };
+  };
 }

frontend/src/helperComponents/Anime.svelte

@@ -8,7 +8,7 @@
         simklLoggedIn,
     } from "../helperModules/GlobalVariablesAndHelperFunctions.svelte";
     import { push } from "svelte-spa-router";
-    import { Button } from "flowbite-svelte";
+    import WebsiteLink from "./WebsiteLink.svelte";
     import type { AniListGetSingleAnime } from "../anilist/types/AniListCurrentUserWatchListType";
     import Rating from "./Rating.svelte";
     import {
@@ -28,10 +28,7 @@
         StatusOptions,
     } from "../helperTypes/StatusTypes";
     import type { AniListUpdateVariables } from "../anilist/types/AniListTypes";
-    import {
+    import { convertDateToAniList } from "../helperFunctions/convertDateToAniList";
-        convertDateStringToAniList,
-        convertDateToAniList,
-    } from "../helperFunctions/convertDateToAniList";
     import {
         AniListDeleteEntry,
         AniListUpdateEntry,
@@ -45,6 +42,7 @@
     import { AddAnimeServiceToTable } from "../helperModules/AddAnimeServiceToTable.svelte";
     import { CheckIfAniListLoggedInAndLoadWatchList } from "../helperModules/CheckIfAniListLoggedInAndLoadWatchList.svelte";
     import Datepicker from "./Datepicker.svelte";
+    import { Badge, Tooltip } from "flowbite-svelte";
     const re = /^([0-9]{4})-([0-9]{2})-([0-9]{2})/;
 
     let isAniListLoggedIn: boolean;
@@ -216,9 +214,8 @@
             };
             await AniListUpdateEntry(body).then(
                 (value: AniListGetSingleAnime) => {
-                    /* TODO in future when you inevitably add tags to typescript, until Anilist fixes the api bug
+                    value.data.MediaList.media.tags =
-                    where tags break the SaveMediaListEntry return, you'll want to use this delete line
+                        currentAniListAnime.data.MediaList.media.tags;
-                    delete value.data.MediaList.media.tags */
                     aniListAnime.update((newValue) => {
                         newValue = value;
                         return newValue;
@@ -479,8 +476,23 @@
                             type="button"
                             id="decrement-button"
                             data-input-counter-decrement="quantity-input"
-                            on:click={() =>
+                            on:click={() => {
-                                (currentAniListAnime.data.MediaList.progress -= 1)}
+                                currentAniListAnime.data.MediaList.progress -= 1;
+                                if (
+                                    currentAniListAnime.data.MediaList
+                                        .progress <
+                                    currentAniListAnime.data.MediaList.media
+                                        .episodes
+                                ) {
+                                    startingAnilistStatusOption =
+                                        statusOptions[0];
+                                    if (
+                                        currentAniListAnime.data.MediaList
+                                            .repeat === 0
+                                    )
+                                        completedAtDate = null;
+                                }
+                            }}
                             class="bg-gray-700 hover:bg-gray-600 border-gray-600 border rounded-s-lg p-3 h-11 focus:ring-gray-700 focus:ring-2 focus:outline-none"
                         >
                             <svg
@@ -529,8 +541,29 @@
                             type="button"
                             id="increment-button"
                             data-input-counter-increment="quantity-input"
-                            on:click={() =>
+                            on:click={() => {
-                                (currentAniListAnime.data.MediaList.progress += 1)}
+                                currentAniListAnime.data.MediaList.progress += 1;
+                                if (
+                                    currentAniListAnime.data.MediaList.media
+                                        .episodes ===
+                                    currentAniListAnime.data.MediaList.progress
+                                ) {
+                                    startingAnilistStatusOption =
+                                        statusOptions[2];
+                                    completedAtDate = new Date();
+                                }
+                                if (
+                                    currentAniListAnime.data.MediaList
+                                        .progress -
+                                        1 ===
+                                    0
+                                ) {
+                                    startingAnilistStatusOption =
+                                        statusOptions[0];
+                                    if (startedAtDate === null)
+                                        startedAtDate = new Date();
+                                }
+                            }}
                             class="bg-gray-700 hover:bg-gray-600 border-gray-600 border rounded-e-lg p-3 h-11 focus:ring-gray-700 focus:ring-2 focus:outline-none"
                         >
                             <svg
@@ -564,8 +597,25 @@
                         </div>
                     {/if}
                 </div>
-
+                <div>
-
+                    <label
+                        for="status"
+                        class="text-left block mb-2 text-sm font-medium text-white"
+                        >Status</label
+                    >
+                    <select
+                        id="status"
+                        name="status"
+                        class="border text-sm rounded-lg
+                            block p-2.5 bg-gray-700 border-gray-600 placeholder-gray-400
+                            text-white focus:ring-blue-500 focus:border-blue-500"
+                        bind:value={startingAnilistStatusOption}
+                    >
+                        {#each statusOptions as option}
+                            <option value={option}>{option.aniList}</option>
+                        {/each}
+                    </select>
+                </div>
             </div>
             <div
                 class="flex flex-col md:flex-row md:pl-10 md:pr-10 pt-5 pb-5 justify-center md:gap-x-16 lg:gap-x-36"
@@ -649,7 +699,7 @@
         <div
             class="w-full mx-auto max-w-screen-xl p-4 md:flex md:items-center md:justify-end"
         >
-            <Button
+            <button
                 disabled={isSubmitting}
                 id="sync-button"
                 class="text-white {$submitSuccess
@@ -678,8 +728,8 @@
                     />
                 </svg>
                 Sync Changes
-            </Button>
+            </button>
-            <Button
+            <button
                 class="text-white bg-gray-800 border border-gray-600 focus:outline-none hover:bg-gray-700 focus:ring-4
                     focus:ring-gray-700 font-medium rounded-lg text-sm px-5 py-2.5 me-2 mb-2
                     hover:border-gray-600"
@@ -689,7 +739,7 @@
                 }}
             >
                 Go Home
-            </Button>
+            </button>
         </div>
     </div>
     <AnimeTable />
@@ -698,10 +748,10 @@
         <div
             class="w-full mx-auto max-w-screen-xl p-4 md:flex md:items-center md:justify-start"
         >
-            <Button
+            <button
                 disabled={isSubmitting}
                 id="delete-button"
-                class="text-white bg-red-700 {$submitSuccess
+                class="text-white {$submitSuccess
                     ? 'bg-green-600 hover:bg-green-700 focus:ring-4 focus:ring-green-800'
                     : 'bg-red-600 hover:bg-red-700 focus:ring-4 focus:ring-red-800'} font-medium rounded-lg text-sm px-5 py-2.5 me-2 mb-2 focus:outline-none"
                 on:click={deleteEntries}
@@ -727,12 +777,12 @@
                     />
                 </svg>
                 Delete Entries
-            </Button>
+            </button>
         </div>
         <div
             class="w-full mx-auto max-w-screen-xl p-4 md:flex md:items-center md:justify-end"
         >
-            <Button
+            <button
                 disabled={isSubmitting}
                 id="sync-button"
                 class="text-white {$submitSuccess
@@ -761,8 +811,8 @@
                     />
                 </svg>
                 Sync Changes
-            </Button>
+            </button>
-            <Button
+            <button
                 class="text-white bg-gray-800 border border-gray-600 focus:outline-none hover:bg-gray-700 focus:ring-4
                     focus:ring-gray-700 font-medium rounded-lg text-sm px-5 py-2.5 me-2 mb-2
                     hover:border-gray-600"
@@ -772,12 +822,50 @@
                 }}
             >
                 Go Home
-            </Button>
+            </button>
         </div>
     </div>
 
+    <div class="flex m-5">
         <div>
+            <h3 class="text-2xl">Genres</h3>
+            {#each currentAniListAnime.data.MediaList.media.genres as genre}
+                <div>
+                    <Badge large border color="blue" class="m-1 w-52">
+                        <div>
+                            <WebsiteLink
+                                id={genre}
+                                url="https://anilist.co/search/anime/{genre}"
+                            />
+                        </div>
+                    </Badge>
+                    <Tooltip>{genre}</Tooltip>
+                </div>
+            {/each}
+            <h3 class="text-2xl">Tags</h3>
+            <div class="mt-2">
+                {#each currentAniListAnime.data.MediaList.media.tags as tag}
+                    <div>
+                        <Badge large border color="blue" class="m-1 w-52">
+                            <div>
+                                <WebsiteLink
+                                    id={tag.name}
+                                    url="https://anilist.co/search/anime/?genres={tag.name}"
+                                />
+                                <span class="text-xs">({tag.rank}%)</span>
+                            </div>
+                        </Badge>
+                        <Tooltip>{tag.description}</Tooltip>
+                    </div>
+                {/each}
+            </div>
+        </div>
+
+        <div class="ml-5">
             <h3 class="text-2xl">Summary</h3>
-        <p>{@html currentAniListAnime.data.MediaList.media.description}</p>
+            <p class="rounded border border-gray-700 p-2 mt-2">
+                {@html currentAniListAnime.data.MediaList.media.description}
+            </p>
+        </div>
     </div>
 </form>

frontend/src/helperComponents/AvatarMenu.svelte

@@ -13,11 +13,12 @@
         loginToSimkl,
         logoutOfAniList,
         logoutOfMAL,
-        logoutOfSimkl,
+        logoutOfSimkl
     } from "../helperModules/GlobalVariablesAndHelperFunctions.svelte";
     import * as runtime from "../../wailsjs/runtime";
     import type {MyAnimeListUser} from "../mal/types/MALTypes";
     import type {SimklUser} from "../simkl/types/simklTypes";
+    import { ShowVersion } from "../../wailsjs/go/main/App";
 
     let currentAniListUser: AniListUser;
     let currentMALUser: MyAnimeListUser;
@@ -36,6 +37,20 @@
     function dropdownUser(): void {
         let dropdown = document.querySelector("#userDropdown");
         dropdown.classList.toggle("hidden");
+
+        if (!dropdown.classList.contains("hidden")) {
+            document.addEventListener("click", clickOutside)
+        }
+    }
+
+    function clickOutside(event: Event): void {
+        let dropdown = document.querySelector("#userDropdown")
+        let toggleBtn = document.querySelector("#userDropdownButton")
+
+        if (!dropdown.contains(event.target as Node) && !toggleBtn.contains(event.target as Node)) {
+            dropdown.classList.add("hidden")
+            document.removeEventListener("click", clickOutside)
+        }
     }
 </script>
 
@@ -77,7 +92,10 @@
                 </li>
                 {:else}
                 <li>
-                    <button on:click={loginToAniList}
+                    <button on:click={() => {
+                        dropdownUser()
+                        loginToAniList()
+                    }}
                             class="block px-4 py-2 w-full hover:bg-gray-600 truncate hover:text-white">
                         <span class="maple-font text-lg mr-4">A</span>Login to AniList
                     </button>
@@ -94,7 +112,10 @@
                 </li>
             {:else}
                 <li>
-                    <button on:click={loginToMAL}
+                    <button on:click={() => {
+                        dropdownUser()
+                        loginToMAL()
+                    }}
                             class="block px-4 py-2 w-full hover:bg-gray-600 truncate hover:text-white">
                         <span class="maple-font text-lg mr-4">M</span>Login to MyAnimeList
                     </button>
@@ -111,7 +132,10 @@
                 </li>
             {:else}
                 <li>
-                    <button on:click={loginToSimkl}
+                    <button on:click={() => {
+                        dropdownUser()
+                        loginToSimkl()
+                    }}
                             class="block px-4 py-2 w-full hover:bg-gray-600 truncate hover:text-white">
                         <span class="maple-font text-lg mr-4">S</span>Login to Simkl
                     </button>
@@ -119,6 +143,15 @@
             {/if}
         </ul>
         <div class="py-2">
+            <button
+                    on:click={() => {
+                        dropdownUser()
+                        ShowVersion()
+                    }}
+                    class="block px-4 py-2 w-full text-sm hover:bg-gray-600 text-gray-200 over:text-white"
+            >
+               Version
+            </button>
             <button
                 on:click={() => runtime.Quit()}
                 class="block px-4 py-2 w-full text-sm hover:bg-gray-600 text-gray-200 over:text-white"

frontend/src/helperComponents/WebsiteLink.svelte

@@ -1,28 +1,32 @@
 <script lang="ts">
-  import {BrowserOpenURL} from "../../wailsjs/runtime"
+    import { BrowserOpenURL } from "../../wailsjs/runtime";
 
-  export let id: string
+    export let id: string;
-  let url = ""
+    export let url = "";
-  let isAniList = false
+    let isAniList = false;
-  let isMAL = false
+    let isMAL = false;
-  let isSimkl = false
+    let isSimkl = false;
-  let newId = id
+    let newId = id;
-  let re = /[ams]?-?(.*)/
+    let re = /[ams]?-?(.*)/;
     if (id !== undefined && id.length > 0) {
-    isAniList = id.includes("a-")
+        isAniList = id.includes("a-");
-    isMAL = id.includes("m-")
+        isMAL = id.includes("m-");
-    isSimkl = id.includes("s-")
+        isSimkl = id.includes("s-");
-    newId = id.match(re)[1]
+        if (isAniList || isMAL || isSimkl) newId = id.match(re)[1];
+        else newId = id;
     }
 
-
+    if (isAniList) url = `https://anilist.co/anime/${newId}`;
-  if (isAniList) url = `https://anilist.co/anime/${newId}`
+    if (isMAL) url = `https://myanimelist.net/anime/${newId}`;
-  if (isMAL) url = `https://myanimelist.net/anime/${newId}`
+    if (isSimkl) url = `https://simkl.com/anime/${newId}`;
-  if (isSimkl) url = `https://simkl.com/anime/${newId}`
 </script>
 
 {#if url.length > 0}
-  <button class="underline underline-offset-2 px-4 py-1" on:click={() => BrowserOpenURL(url)}>{newId}</button>
+    <button
+        type="button"
+        class="underline underline-offset-2 px-4 py-1"
+        on:click={() => BrowserOpenURL(url)}>{newId}</button
+    >
 {:else}
     {id}
 {/if}

frontend/src/routes/AnimeRoutePage.svelte

@@ -1,9 +1,23 @@
 <script lang="ts">
+    import { aniListAnime, GetAnimeSingleItem } from "../helperModules/GlobalVariablesAndHelperFunctions.svelte";
     import Anime from "../helperComponents/Anime.svelte"
+    import { AniListGetSingleAnimeDefaultData } from "../helperDefaults/AniListGetSingleAnime";
+    import Spinner from "../helperComponents/Spinner.svelte";
 
     export let params: Record<string, string>
+    let loadPromise = load(params.id)
+    $: loadPromise = load(params.id)
+
+    async function load(id: string) {
+        aniListAnime.update(() => AniListGetSingleAnimeDefaultData)
+        await GetAnimeSingleItem(Number(id), true)
+    }
 </script>
 
 {#key params.id}
+    {#await loadPromise}
+        <Spinner />
+    {:then _}
         <Anime />
+    {/await}
 {/key}

frontend/wailsjs/go/main/App.d.ts

@@ -42,6 +42,8 @@ export function MyAnimeListLogin():Promise<void>;
 
 export function MyAnimeListUpdate(arg1:main.MALAnime,arg2:main.MALUploadStatus):Promise<main.MalListStatus>;
 
+export function ShowVersion():Promise<void>;
+
 export function SimklGetUserWatchlist():Promise<main.SimklWatchListType>;
 
 export function SimklLogin():Promise<void>;

frontend/wailsjs/go/main/App.js

@@ -82,6 +82,10 @@ export function MyAnimeListUpdate(arg1, arg2) {
   return window['go']['main']['App']['MyAnimeListUpdate'](arg1, arg2);
 }
 
+export function ShowVersion() {
+  return window['go']['main']['App']['ShowVersion']();
+}
+
 export function SimklGetUserWatchlist() {
   return window['go']['main']['App']['SimklGetUserWatchlist']();
 }

frontend/wailsjs/go/models.ts

@@ -364,7 +364,7 @@ export namespace main {
 	    id: number;
 	    mediaId: number;
 	    userId: number;
-	    // Go type: struct { ID int "json:\"id\""; IDMal int "json:\"idMal\""; Title struct { Romaji string "json:\"romaji\""; English string "json:\"english\""; Native string "json:\"native\"" } "json:\"title\""; Description string "json:\"description\""; CoverImage struct { Large string "json:\"large\"" } "json:\"coverImage\""; Season string "json:\"season\""; SeasonYear int "json:\"seasonYear\""; Status string "json:\"status\""; Episodes int "json:\"episodes\""; NextAiringEpisode struct { AiringAt int "json:\"airingAt\""; TimeUntilAiring int "json:\"timeUntilAiring\""; Episode int "json:\"episode\"" } "json:\"nextAiringEpisode\""; Tags []struct { Id int "json:\"id\""; Name string "json:\"name\""; Description string "json:\"description\""; Rank int "json:\"rank\""; IsMediaSpoiler bool "json:\"isMediaSpoiler\""; IsAdult bool "json:\"isAdult\"" } "json:\"tags\""; IsAdult bool "json:\"isAdult\"" }
+	    // Go type: struct { ID int "json:\"id\""; IDMal int "json:\"idMal\""; Title struct { Romaji string "json:\"romaji\""; English string "json:\"english\""; Native string "json:\"native\"" } "json:\"title\""; Description string "json:\"description\""; CoverImage struct { Large string "json:\"large\"" } "json:\"coverImage\""; Season string "json:\"season\""; SeasonYear int "json:\"seasonYear\""; Status string "json:\"status\""; Episodes int "json:\"episodes\""; NextAiringEpisode struct { AiringAt int "json:\"airingAt\""; TimeUntilAiring int "json:\"timeUntilAiring\""; Episode int "json:\"episode\"" } "json:\"nextAiringEpisode\""; Genres []string "json:\"genres\""; Tags []struct { Id int "json:\"id\""; Name string "json:\"name\""; Description string "json:\"description\""; Rank int "json:\"rank\""; IsMediaSpoiler bool "json:\"isMediaSpoiler\""; IsAdult bool "json:\"isAdult\"" } "json:\"tags\""; IsAdult bool "json:\"isAdult\"" }
 	    media: any;
 	    status: string;
 	    // Go type: struct { Year int "json:\"year\""; Month int "json:\"month\""; Day int "json:\"day\"" }

go.mod

@@ -39,11 +39,11 @@ require (
 	github.com/valyala/fasttemplate v1.2.2 // indirect
 	github.com/wailsapp/go-webview2 v1.0.19 // indirect
 	github.com/wailsapp/mimetype v1.4.1 // indirect
-	golang.org/x/crypto v0.35.0 // indirect
+	golang.org/x/crypto v0.45.0 // indirect
-	golang.org/x/net v0.35.0 // indirect
+	golang.org/x/net v0.47.0 // indirect
-	golang.org/x/sys v0.30.0 // indirect
+	golang.org/x/sys v0.38.0 // indirect
-	golang.org/x/term v0.29.0 // indirect
+	golang.org/x/term v0.37.0 // indirect
-	golang.org/x/text v0.22.0 // indirect
+	golang.org/x/text v0.31.0 // indirect
 )
 
 // replace github.com/wailsapp/wails/v2 v2.9.1 => /home/nymusicman/go/pkg/mod

go.sum

@@ -85,24 +85,24 @@ github.com/wailsapp/mimetype v1.4.1 h1:pQN9ycO7uo4vsUUuPeHEYoUkLVkaRntMnHJxVwYhw
 github.com/wailsapp/mimetype v1.4.1/go.mod h1:9aV5k31bBOv5z6u+QP8TltzvNGJPmNJD4XlAL3U+j3o=
 github.com/wailsapp/wails/v2 v2.10.1 h1:QWHvWMXII2nI/nXz77gpPG8P3ehl6zKe+u4su5BWIns=
 github.com/wailsapp/wails/v2 v2.10.1/go.mod h1:zrebnFV6MQf9kx8HI4iAv63vsR5v67oS7GTEZ7Pz1TY=
-golang.org/x/crypto v0.35.0 h1:b15kiHdrGCHrP6LvwaQ3c03kgNhhiMgvlhxHQhmg2Xs=
+golang.org/x/crypto v0.45.0 h1:jMBrvKuj23MTlT0bQEOBcAE0mjg8mK9RXFhRH6nyF3Q=
-golang.org/x/crypto v0.35.0/go.mod h1:dy7dXNW32cAb/6/PRuTNsix8T+vJAqvuIy5Bli/x0YQ=
+golang.org/x/crypto v0.45.0/go.mod h1:XTGrrkGJve7CYK7J8PEww4aY7gM3qMCElcJQ8n8JdX4=
 golang.org/x/net v0.0.0-20210505024714-0287a6fb4125/go.mod h1:9nx3DQGgdP8bBQD5qxJ1jj9UTztislL4KSBs9R2vV5Y=
-golang.org/x/net v0.35.0 h1:T5GQRQb2y08kTAByq9L4/bz8cipCdA8FbRTXewonqY8=
+golang.org/x/net v0.47.0 h1:Mx+4dIFzqraBXUugkia1OOvlD6LemFo1ALMHjrXDOhY=
-golang.org/x/net v0.35.0/go.mod h1:EglIi67kWsHKlRzzVMUD93VMSWGFOMSZgxFjparz1Qk=
+golang.org/x/net v0.47.0/go.mod h1:/jNxtkgq5yWUGYkaZGqo27cfGZ1c5Nen03aYrrKpVRU=
 golang.org/x/sys v0.0.0-20200810151505-1b9f1253b3ed/go.mod h1:h1NjWce9XRLGQEsW7wpKNCjG9DtNlClVuFLEZdDNbEs=
 golang.org/x/sys v0.0.0-20201119102817-f84b799fce68/go.mod h1:h1NjWce9XRLGQEsW7wpKNCjG9DtNlClVuFLEZdDNbEs=
 golang.org/x/sys v0.0.0-20210423082822-04245dca01da/go.mod h1:h1NjWce9XRLGQEsW7wpKNCjG9DtNlClVuFLEZdDNbEs=
 golang.org/x/sys v0.1.0/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
 golang.org/x/sys v0.6.0/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
-golang.org/x/sys v0.30.0 h1:QjkSwP/36a20jFYWkSue1YwXzLmsV5Gfq7Eiy72C1uc=
+golang.org/x/sys v0.38.0 h1:3yZWxaJjBmCWXqhN1qh02AkOnCQ1poK6oF+a7xWL6Gc=
-golang.org/x/sys v0.30.0/go.mod h1:/VUhepiaJMQUp4+oa/7Zr1D23ma6VTLIYjOOTFZPUcA=
+golang.org/x/sys v0.38.0/go.mod h1:OgkHotnGiDImocRcuBABYBEXf8A9a87e/uXjp9XT3ks=
 golang.org/x/term v0.0.0-20201126162022-7de9c90e9dd1/go.mod h1:bj7SfCRtBDWHUb9snDiAeCFNEtKQo2Wmx5Cou7ajbmo=
-golang.org/x/term v0.29.0 h1:L6pJp37ocefwRRtYPKSWOWzOtWSxVajvz2ldH/xi3iU=
+golang.org/x/term v0.37.0 h1:8EGAD0qCmHYZg6J17DvsMy9/wJ7/D/4pV/wfnld5lTU=
-golang.org/x/term v0.29.0/go.mod h1:6bl4lRlvVuDgSf3179VpIxBF0o10JUpXWOnI7nErv7s=
+golang.org/x/term v0.37.0/go.mod h1:5pB4lxRNYYVZuTLmy8oR2BH8dflOR+IbTYFD8fi3254=
 golang.org/x/text v0.3.6/go.mod h1:5Zoc/QRtKVWzQhOtBMvqHzDpF6irO9z98xDceosuGiQ=
-golang.org/x/text v0.22.0 h1:bofq7m3/HAFvbF51jz3Q9wLg3jkvSPuiZu/pD1XwgtM=
+golang.org/x/text v0.31.0 h1:aC8ghyu4JhP8VojJ2lEHBnochRno1sgL6nEi9WGFGMM=
-golang.org/x/text v0.22.0/go.mod h1:YRoo4H8PVmsu+E3Ou7cqLVH8oXWIHVoX0jqUWALQhfY=
+golang.org/x/text v0.31.0/go.mod h1:tKRAlv61yKIjGGHX/4tP1LTbc13YSec1pxVEWXzfoeM=
 golang.org/x/tools v0.0.0-20180917221912-90fa682c2a6e/go.mod h1:n7NCudcB/nEzxVGmLbDWY5pfWTLqBcC2KZ6jyYvM4mQ=
 gopkg.in/check.v1 v1.0.0-20200902074654-038fdea0a05b h1:QRR6H1YWRnHb4Y/HeNFCTJLFVxaq6wH4YuVdsUOr75U=
 gopkg.in/check.v1 v1.0.0-20200902074654-038fdea0a05b/go.mod h1:Co6ibVJAznAaIkqp8huTwlJQCZ016jof/cbN4VW5Yz0=

wails.json

@@ -12,6 +12,6 @@
   },
   "info": {
     "productName": "AniTrack",
-    "productVersion": "0.1.7"
+    "productVersion": "0.5.0"
   }
 }