AniListFunctions.go

@@ -3,7 +3,6 @@ package main
 import (
 	"bytes"
 	"encoding/json"
-	"fmt"
 	"io"
 	"log"
 	"net/http"
@@ -91,15 +90,6 @@ func (a *App) GetAniListItem(aniId int, login bool) AniListGetSingleAnime {
 					timeUntilAiring
 					episode
 				  }
-				  tags{
-					id
-					name
-					description
-					rank
-					isMediaSpoiler
-					isAdult
-				  }
-				  isAdult
 				}
 				status
 				startedAt{
@@ -190,15 +180,6 @@ func (a *App) AniListSearch(query string) any {
 						  timeUntilAiring
 						  episode
 						}
-						tags{
-							id
-							name
-							description
-							rank
-							isMediaSpoiler
-							isAdult
-						  }
-					    isAdult
 					}
 				}
 			}
@@ -275,15 +256,6 @@ func (a *App) GetAniListUserWatchingList(page int, perPage int, sort string) Ani
 						  timeUntilAiring
 						  episode
 						}
-						tags{
-						  id
-						  name
-						  description
-						  rank
-						  isMediaSpoiler
-						  isAdult
-						}
-						isAdult
 					  }
 					  status
 					  startedAt {
@@ -358,7 +330,7 @@ func (a *App) GetAniListUserWatchingList(page int, perPage int, sort string) Ani
 
 func (a *App) AniListUpdateEntry(
 	mediaId int,
-	progress int,
+	progress string,
 	status string,
 	score float64,
 	repeat int,
@@ -382,7 +354,7 @@ func (a *App) AniListUpdateEntry(
 	}
 	type Variables struct {
 		MediaId     int         `json:"mediaId"`
-		Progress    int         `json:"progress"`
+		Progress    string      `json:"progress"`
 		Status      string      `json:"status"`
 		Score       float64     `json:"score"`
 		Repeat      int         `json:"repeat"`
@@ -391,10 +363,10 @@ func (a *App) AniListUpdateEntry(
 		CompletedAt CompletedAt `json:"completedAt"`
 	}
 	body := struct {
-		Query     string    `json:"query"`
+		Mutation  string    `json:"mutation"`
 		Variables Variables `json:"variables"`
 	}{
-		Query: `
+		Mutation: `
 			mutation(
 			  $mediaId:Int, 
 			  $progress:Int, 
@@ -455,8 +427,6 @@ func (a *App) AniListUpdateEntry(
 
 	returnedBody, _ := AniListQuery(body, true)
 
-	fmt.Println(string(returnedBody))
-
 	var post interface{}
 	err := json.Unmarshal(returnedBody, &post)
 	if err != nil {

AniListTypes.go

@@ -68,15 +68,6 @@ type MediaList struct {
 			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"`
 	} `json:"media"`
 	Status    string `json:"status"`
 	StartedAt struct {
@@ -91,7 +82,7 @@ type MediaList struct {
 	} `json:"completedAt"`
 	Notes    string `json:"notes"`
 	Progress int    `json:"progress"`
-	Score    float64 `json:"score"`
+	Score    int    `json:"score"`
 	Repeat   int    `json:"repeat"`
 	User     struct {
 		ID     int    `json:"id"`
@@ -112,66 +103,66 @@ type MediaList struct {
 	} `json:"user"`
 }
 
-//var MediaListSort = struct {
+var MediaListSort = struct {
-//	MediaId               string
+	MediaId               string
-//	MediaIdDesc           string
+	MediaIdDesc           string
-//	Score                 string
+	Score                 string
-//	ScoreDesc             string
+	ScoreDesc             string
-//	Status                string
+	Status                string
-//	StatusDesc            string
+	StatusDesc            string
-//	Progress              string
+	Progress              string
-//	ProgressDesc          string
+	ProgressDesc          string
-//	ProgressVolumes       string
+	ProgressVolumes       string
-//	ProgressVolumesDesc   string
+	ProgressVolumesDesc   string
-//	Repeat                string
+	Repeat                string
-//	RepeatDesc            string
+	RepeatDesc            string
-//	Priority              string
+	Priority              string
-//	PriorityDesc          string
+	PriorityDesc          string
-//	StartedOn             string
+	StartedOn             string
-//	StartedOnDesc         string
+	StartedOnDesc         string
-//	FinishedOn            string
+	FinishedOn            string
-//	FinishedOnDesc        string
+	FinishedOnDesc        string
-//	AddedTime             string
+	AddedTime             string
-//	AddedTimeDesc         string
+	AddedTimeDesc         string
-//	UpdatedTime           string
+	UpdatedTime           string
-//	UpdatedTimeDesc       string
+	UpdatedTimeDesc       string
-//	MediaTitleRomaji      string
+	MediaTitleRomaji      string
-//	MediaTitleRomajiDesc  string
+	MediaTitleRomajiDesc  string
-//	MediaTitleEnglish     string
+	MediaTitleEnglish     string
-//	MediaTitleEnglishDesc string
+	MediaTitleEnglishDesc string
-//	MediaTitleNative      string
+	MediaTitleNative      string
-//	MediaTitleNativeDesc  string
+	MediaTitleNativeDesc  string
-//	MediaPopularity       string
+	MediaPopularity       string
-//	MediaPopularityDesc   string
+	MediaPopularityDesc   string
-//}{
+}{
-//	MediaId:               "MEDIA_ID",
+	MediaId:               "MEDIA_ID",
-//	MediaIdDesc:           "MEDIA_ID_DESC",
+	MediaIdDesc:           "MEDIA_ID_DESC",
-//	Score:                 "SCORE",
+	Score:                 "SCORE",
-//	ScoreDesc:             "SCORE_DESC",
+	ScoreDesc:             "SCORE_DESC",
-//	Status:                "STATUS",
+	Status:                "STATUS",
-//	StatusDesc:            "STATUS_DESC",
+	StatusDesc:            "STATUS_DESC",
-//	Progress:              "PROGRESS",
+	Progress:              "PROGRESS",
-//	ProgressDesc:          "PROGRESS_DESC",
+	ProgressDesc:          "PROGRESS_DESC",
-//	ProgressVolumes:       "PROGRESS_VOLUMES",
+	ProgressVolumes:       "PROGRESS_VOLUMES",
-//	ProgressVolumesDesc:   "PROGRESS_VOLUMES_DESC",
+	ProgressVolumesDesc:   "PROGRESS_VOLUMES_DESC",
-//	Repeat:                "REPEAT",
+	Repeat:                "REPEAT",
-//	RepeatDesc:            "REPEAT_DESC",
+	RepeatDesc:            "REPEAT_DESC",
-//	Priority:              "PRIORITY",
+	Priority:              "PRIORITY",
-//	PriorityDesc:          "PRIORITY_DESC",
+	PriorityDesc:          "PRIORITY_DESC",
-//	StartedOn:             "STARTED_ON",
+	StartedOn:             "STARTED_ON",
-//	StartedOnDesc:         "STARTED_ON_DESC",
+	StartedOnDesc:         "STARTED_ON_DESC",
-//	FinishedOn:            "FINISHED_ON",
+	FinishedOn:            "FINISHED_ON",
-//	FinishedOnDesc:        "FINISHED_ON_DESC",
+	FinishedOnDesc:        "FINISHED_ON_DESC",
-//	AddedTime:             "ADDED_TIME",
+	AddedTime:             "ADDED_TIME",
-//	AddedTimeDesc:         "ADDED_TIME_DESC",
+	AddedTimeDesc:         "ADDED_TIME_DESC",
-//	UpdatedTime:           "UPDATED_TIME",
+	UpdatedTime:           "UPDATED_TIME",
-//	UpdatedTimeDesc:       "UPDATED_TIME_DESC",
+	UpdatedTimeDesc:       "UPDATED_TIME_DESC",
-//	MediaTitleRomaji:      "MEDIA_TITLE_ROMAJI",
+	MediaTitleRomaji:      "MEDIA_TITLE_ROMAJI",
-//	MediaTitleRomajiDesc:  "MEDIA_TITLE_ROMAJI_DESC",
+	MediaTitleRomajiDesc:  "MEDIA_TITLE_ROMAJI_DESC",
-//	MediaTitleEnglish:     "MEDIA_TITLE_ENGLISH",
+	MediaTitleEnglish:     "MEDIA_TITLE_ENGLISH",
-//	MediaTitleEnglishDesc: "MEDIA_TITLE_ENGLISH_DESC",
+	MediaTitleEnglishDesc: "MEDIA_TITLE_ENGLISH_DESC",
-//	MediaTitleNative:      "MEDIA_TITLE_NATIVE",
+	MediaTitleNative:      "MEDIA_TITLE_NATIVE",
-//	MediaTitleNativeDesc:  "MEDIA_TITLE_NATIVE_DESC",
+	MediaTitleNativeDesc:  "MEDIA_TITLE_NATIVE_DESC",
-//	MediaPopularity:       "MEDIA_POPULARITY",
+	MediaPopularity:       "MEDIA_POPULARITY",
-//	MediaPopularityDesc:   "MEDIA_POPULARITY_DESC",
+	MediaPopularityDesc:   "MEDIA_POPULARITY_DESC",
-//}
+}

SimklTypes.go

@@ -30,7 +30,7 @@ type SimklWatchList struct {
 	Anime []struct {
 		LastWatchedAt         string `json:"last_watched_at" ts_type:"last_watched_at"`
 		Status                string `json:"status" ts_type:"status"`
-		UserRating            float64 `json:"user_rating" ts_type:"user_rating"`
+		UserRating            int    `json:"user_rating" ts_type:"user_rating"`
 		LastWatched           string `json:"last_watched" ts_type:"last_watched"`
 		NextToWatch           string `json:"next_to_watch" ts_type:"next_to_watch"`
 		WatchedEpisodesCount  int    `json:"watched_episodes_count" ts_type:"watched_episodes_count"`

SimklUserFunctions.go

@@ -157,6 +157,8 @@ func getSimklAuthorizationToken(content string) SimklJWT {
 func (a *App) GetSimklLoggedInUser() SimklUser {
 	a.SimklLogin()
 
+	fmt.Println("Token: ", simklJwt.AccessToken)
+
 	client := &http.Client{}
 
 	req, _ := http.NewRequest("POST", "https://api.simkl.com/users/settings", nil)

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

@@ -24,14 +24,6 @@ body:graphql {
       media {
         id
         idMal
-        tags{
-          id
-          name
-          description
-          rank
-          isMediaSpoiler
-          isAdult
-        }
         title {
           romaji
           english
@@ -50,7 +42,6 @@ body:graphql {
           timeUntilAiring
           episode
         }
-        isAdult
       }
       status
       startedAt {

bruno/AniTrack/environments/Dev.bru

@@ -6,6 +6,5 @@ vars {
 }
 vars:secret [
   code,
-  SIMKL_AUTH_TOKEN,
+  SIMKL_AUTH_TOKEN
-  ANILIST_ACCESS_TOKEN
 ]

frontend/package.json

@@ -27,7 +27,6 @@
     "@ernane/svelte-star-rating": "^1.1.7",
     "@popperjs/core": "^2.11.8",
     "flowbite": "^2.4.1",
-    "flowbite-svelte": "^0.46.15",
+    "flowbite-svelte": "^0.46.15"
-    "moment": "^2.30.1"
   }
 }

frontend/src/App.svelte

@@ -1,39 +1,53 @@
 <script lang="ts">
-    import {
+    import {anilistModal, GetAniListSingleItemAndOpenModal, title} from "./GetAniListSingleItemAndOpenModal.svelte";
-        anilistModal,
-        GetAniListSingleItemAndOpenModal,
-        title,
-        simklWatchList,
-        aniListLoggedIn,
-        simklLoggedIn
-    } from "./GlobalVariablesAndHelperFunctions.svelte";
     import {
         CheckIfAniListLoggedIn,
         CheckIfSimklLoggedIn,
         GetAniListLoggedInUser,
         GetAniListUserWatchingList,
-        GetSimklLoggedInUser,
+        GetSimklLoggedInUser, SimklGetUserWatchlist,
-        SimklGetUserWatchlist,
     } from "../wailsjs/go/main/App";
     import {type AniListUser, MediaListSort} from "./anilist/types/AniListTypes";
     import type {AniListCurrentUserWatchList} from "./anilist/types/AniListCurrentUserWatchListType"
     import Header from "./Header.svelte";
-    import {Button, Rating} from "flowbite-svelte";
+    import StarRatting from '@ernane/svelte-star-rating'
-    import {default as Modal} from "./modal/Modal.svelte"
+    import {Button, Modal} from "flowbite-svelte";
+
     import ChangeDataDialogue from "./ChangeDataDialogue.svelte";
     import {onMount} from "svelte";
-    import type {SimklUser} from "./simkl/types/simklTypes";
+    import type {SimklUser, SimklWatchList} from "./simkl/types/simklTypes";
+    import {writable} from "svelte/store";
 
+    const config = {
+        readOnly: false,
+        countStars: 5,
+        range: {
+            min: 0,
+            max: 5,
+            step: 0.5
+        },
+        score: 0.0,
+        showScore: true,
+        scoreFormat: function () {
+            return `(${this.score.toFixed(1)}/${this.countStars})`
+        },
+        name: "",
+        starConfig: {
+            size: 20,
+            fillColor: '#F9ED4F',
+            strokeColor: "#e2c714",
+            unfilledColor: '#FFF',
+            strokeUnfilledColor: '#000'
+        }
+    }
+
+    let aniListLoggedIn = false
     let aniListPrimary = true
     let simklUser: SimklUser
+    let simklLoggedIn = false
     let aniListUser: AniListUser
     let aniListWatchlist: AniListCurrentUserWatchList
-    let isAniListLoggedIn: boolean
+    export let simklWatchList = writable({} as SimklWatchList)
-    let isSimklLoggedIn: boolean
-
-    aniListLoggedIn.subscribe((value) => isAniListLoggedIn = value)
-    simklLoggedIn.subscribe((value) => isSimklLoggedIn = value)
-
     let page = 1
     let perPage = 20
     const size = "xl"
@@ -46,10 +60,10 @@
                     if (aniListPrimary) {
                         GetAniListUserWatchingList(page, perPage, MediaListSort.UpdatedTimeDesc).then((result) => {
                             aniListWatchlist = result
-                            aniListLoggedIn.set(true)
+                            aniListLoggedIn = true
                         })
                     } else {
-                        aniListLoggedIn.set(result)
+                        aniListLoggedIn = result
                     }
                 })
             }
@@ -61,7 +75,7 @@
                     simklUser = result
                     SimklGetUserWatchlist().then(result => {
                         simklWatchList.set(result)
-                        simklLoggedIn.set(result)
+                        simklLoggedIn = result
                     })
                 })
             }
@@ -71,38 +85,38 @@
     function loginToSimkl(): void {
         GetSimklLoggedInUser().then(result => {
             simklUser = result
-            simklLoggedIn.set(true)
+            simklLoggedIn = true
         })
     }
 
     function loginToAniList(): void {
         GetAniListLoggedInUser().then(result => {
             aniListUser = result
-            aniListLoggedIn.set(true)
+            aniListLoggedIn = true
             if (aniListPrimary) {
                 GetAniListUserWatchingList(page, perPage, MediaListSort.UpdatedTimeDesc).then(result => aniListWatchlist = result)
             }
         })
     }
 
-    // function anilistGetUserWatchlist(): void {
+    function anilistGetUserWatchlist(): void {
-    //     GetAniListUserWatchingList(page, perPage, MediaListSort.UpdatedTimeDesc).then((result) => {
+        GetAniListUserWatchingList(page, perPage, MediaListSort.UpdatedTimeDesc).then((result) => {
-    //         aniListWatchlist = result
+            aniListWatchlist = result
-    //         aniListLoggedIn.set(true)
+            aniListLoggedIn = true
-    //     })
+        })
-    // }
+    }
-    //
+
-    // let count = 1;
+    let count = 1;
-    //
+
-    // const decrement = () => {
+    const decrement = () => {
-    //     if (count > 0) {
+        if (count > 0) {
-    //         count--
+            count--
-    //     }
+        }
-    // }
+    }
-    //
+
-    // const increment = () => {
+    const increment = () => {
-    //     count++
+        count++
-    // }
+    }
 
 
 </script>
@@ -110,42 +124,39 @@
 <Header/>
 
 <main>
-    {#if isAniListLoggedIn}
+    {#if aniListLoggedIn}
-        <div>You are logged into AniList, {aniListUser.data.Viewer.name}!</div>
+        <div>You are logged into AniList, {aniListWatchlist.data.Page.mediaList[0].user.name}!</div>
     {:else}
         <button class="btn" on:click={loginToAniList}>Login to AniList</button>
     {/if}
 
-    {#if isSimklLoggedIn}
+    {#if simklLoggedIn}
         <div>You are logged into Simkl, {simklUser.user.name}</div>
     {:else}
         <Button class="btn" on:click={loginToSimkl}>Login to Simkl</Button>
     {/if}
 
-    {#if isAniListLoggedIn}
+    {#if aniListLoggedIn}
-        <div class="mx-auto max-w-2xl p-4 sm:p-6 lg:max-w-7xl lg:px-8">
+        <div class="mx-auto max-w-2xl px-4 py-16 sm:px-6 sm:py-24 lg:max-w-7xl lg:px-8">
-            <h1 class="text-left text-xl font-bold mb-4">Your Watching List</h1>
+            <h1>Your Watching List</h1>
 
             <div class="grid grid-cols-1 gap-x-6 gap-y-10 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 xl:gap-x-8">
                 {#each aniListWatchlist.data.Page.mediaList as media}
                     <div class="aspect-h-1 aspect-w-1 w-full overflow-hidden rounded-lg xl:aspect-h-8 xl:aspect-w-7">
-                        <div class="flex flex-col items-center group">
+                        <button on:click={() => GetAniListSingleItemAndOpenModal(media.media.id, true)} class="group">
-                            <button on:click={() => GetAniListSingleItemAndOpenModal(media.media.id, true)}>
+                            <div class="flex flex-col items-center">
                                 <img class="rounded-lg" src={media.media.coverImage.large} alt={
                                 media.media.title.english === "" ?
                                     media.media.title.romaji :
                                     media.media.title.english
                             }/>
-                            </button>
+                                {config.score = media.score / 2.0}
-                            <Rating id="anime-rating" total={5} size={35} rating={media.score/2.0} />
+                                <StarRatting {config}/>
-                            <button class="mt-4 text-md font-semibold text-white-700"
+                                <h3 class="mt-4 text-sm text-white-700">{
-                                    on:click={() => GetAniListSingleItemAndOpenModal(media.media.id, true)}>
-                                {
                                     media.media.title.english === "" ?
                                         media.media.title.romaji :
                                         media.media.title.english
-                                }
+                                }</h3>
-                            </button>
                                 <p class="mt-1 text-lg font-medium text-white-900">{media.progress}
                                     / {media.media.nextAiringEpisode.episode !== 0 ?
                                         media.media.nextAiringEpisode.episode - 1 : media.media.episodes}</p>
@@ -154,12 +165,47 @@
                                         Episodes: {media.media.episodes}</p>
                                 {/if}
                             </div>
+                        </button>
                     </div>
                 {/each}
             </div>
         </div>
     {/if}
 
+    <div class="flex items-center justify-center">
+        <button on:click={decrement}
+                class="flex justify-center items-center w-10 h-10 rounded-full text-white focus:outline-none bg-gray-400 hover:bg-gray-500">
+            <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M20 12H4"></path>
+            </svg>
+        </button>
+        <input bind:value={count} class="text-2xl font-bold mx-4"/>
+        <button on:click={increment}
+                class="flex justify-center items-center w-10 h-10 rounded-full text-white focus:outline-none bg-indigo-500 hover:bg-indigo-600">
+            <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6v12M6 12h12"></path>
+            </svg>
+        </button>
+    </div>
+    <!--    <div class="relative max-w-sm">-->
+    <!--        <div class="absolute inset-y-0 start-0 flex items-center ps-3.5 pointer-events-none">-->
+    <!--            <svg class="w-4 h-4 text-gray-500 dark:text-gray-400" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 20 20">-->
+    <!--                <path d="M20 4a2 2 0 0 0-2-2h-2V1a1 1 0 0 0-2 0v1h-3V1a1 1 0 0 0-2 0v1H6V1a1 1 0 0 0-2 0v1H2a2 2 0 0 0-2 2v2h20V4ZM0 18a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V8H0v10Zm5-8h10a1 1 0 0 1 0 2H5a1 1 0 0 1 0-2Z"/>-->
+    <!--            </svg>-->
+    <!--        </div>-->
+    <!--        <input-->
+    <!--                datepicker-->
+    <!--                datepicker-buttons-->
+    <!--                datepicker-autoselect-today-->
+    <!--                datepicker-autohide-->
+    <!--                datepicker-title="Started At"-->
+    <!--                id="startedAt"-->
+    <!--                type="text"-->
+    <!--                class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500-->
+    <!--                            focus:border-blue-500 block w-full ps-10 p-2.5 dark:bg-gray-700 dark:border-gray-600-->
+    <!--                            dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"-->
+    <!--                placeholder="Select date">-->
+    <!--    </div>-->
     <Modal title={$title} bind:open={$anilistModal} {size} autoclose={false}>
         <ChangeDataDialogue/>
     </Modal>

frontend/src/ChangeDataDialogue.svelte

@@ -1,90 +1,7 @@
 <script lang="ts">
-    import {
+    import {anime} from "./GetAniListSingleItemAndOpenModal.svelte";
-        anilistModal,
-        simklWatchList,
-        aniListLoggedIn,
-        simklLoggedIn
-    } from "./GlobalVariablesAndHelperFunctions.svelte";
-    import {aniListAnime} from "./GlobalVariablesAndHelperFunctions.svelte";
     import {Button} from "flowbite-svelte";
-    // @ts-ignore
     import StarRatting from "@ernane/svelte-star-rating"
-    import moment from 'moment'
-    import { Table, TableBody, TableBodyCell, TableBodyRow, TableHead, TableHeadCell } from 'flowbite-svelte';
-    import { writable } from 'svelte/store';
-    import type {SimklAnime} from "./simkl/types/simklTypes";
-    import { get } from 'svelte/store';
-    import {AniListUpdateEntry} from "../wailsjs/go/main/App";
-
-    const simklWatch = get(simklWatchList);
-    let isAniListLoggedIn: boolean
-    let isSimklLoggedIn: boolean
-
-    aniListLoggedIn.subscribe((value) => isAniListLoggedIn = value)
-    simklLoggedIn.subscribe((value) => isSimklLoggedIn = value)
-
-    const simklAnime: SimklAnime | undefined = simklWatch.anime.filter((x) => Number(x.show.ids.mal) === aniListAnime.data.MediaList.media.idMal)[0]
-
-    let items = [];
-
-    if(isAniListLoggedIn) {
-        items.push({
-            id: aniListAnime.data.MediaList.id,
-            service: "AniList",
-            progress: aniListAnime.data.MediaList.progress,
-            status: aniListAnime.data.MediaList.status,
-            startedAt: `${aniListAnime.data.MediaList.startedAt.month}-${aniListAnime.data.MediaList.startedAt.day}-${aniListAnime.data.MediaList.startedAt.year}`,
-            completedAt: `${aniListAnime.data.MediaList.completedAt.month}-${aniListAnime.data.MediaList.completedAt.day}-${aniListAnime.data.MediaList.completedAt.year}`,
-            score: aniListAnime.data.MediaList.score,
-            repeat: aniListAnime.data.MediaList.repeat,
-            notes: aniListAnime.data.MediaList.notes
-        })
-    }
-
-    if(isSimklLoggedIn && simklAnime !== undefined) {
-        items.push({
-            id: simklAnime.show.ids.simkl,
-            service: "Simkl",
-            progress: simklAnime.watched_episodes_count,
-            status: simklAnime.status,
-            startedAt: "",
-            completedAt: "",
-            score: simklAnime.user_rating,
-            repeat: 0,
-            notes: ""
-        })
-    }
-
-    const sortKey = writable('service'); // default sort key
-    const sortDirection = writable(1); // default sort direction (ascending)
-    const sortItems = writable(items.slice()); // make a copy of the items array
-
-    // Define a function to sort the items
-    const sortTable = (key: any) => {
-        // If the same key is clicked, reverse the sort direction
-        if ($sortKey === key) {
-            sortDirection.update((val) => -val);
-        } else {
-            sortKey.set(key);
-            sortDirection.set(1);
-        }
-    };
-
-    $: {
-        const key = $sortKey;
-        const direction = $sortDirection;
-        const sorted = [...$sortItems].sort((a, b) => {
-            const aVal = a[key];
-            const bVal = b[key];
-            if (aVal < bVal) {
-                return -direction;
-            } else if (aVal > bVal) {
-                return direction;
-            }
-            return 0;
-        });
-        sortItems.set(sorted);
-    }
 
     const ratingInWords = {
         0: "Not Reviewed",
@@ -100,14 +17,9 @@
         10: "Masterpiece",
     }
 
-    const hide = (e) => {
+    const title = anime.data.MediaList.media.title.english !== "" ?
-        e.preventDefault();
+        anime.data.MediaList.media.title.english :
-        anilistModal.set(false)
+        anime.data.MediaList.media.title.romaji
-    };
-
-    const title = aniListAnime.data.MediaList.media.title.english !== "" ?
-        aniListAnime.data.MediaList.media.title.english :
-        aniListAnime.data.MediaList.media.title.romaji
 
     let config = {
         readOnly: false,
@@ -117,7 +29,7 @@
             max: 5,
             step: 0.5
         },
-        score: aniListAnime.data.MediaList.score / 2,
+        score: anime.data.MediaList.score / 2,
         showScore: false,
         scoreFormat: function () {
             return `(${this.score.toFixed(1)}/${this.countStars})`
@@ -133,36 +45,41 @@
     }
 
     let values = {
-        progress: aniListAnime.data.MediaList.progress,
+        progress: anime.data.MediaList.progress,
-        status: aniListAnime.data.MediaList.status,
+        status: anime.data.MediaList.status,
         startedAt: {
-            year: aniListAnime.data.MediaList.startedAt.year,
+            year: anime.data.MediaList.startedAt.year,
-            month: aniListAnime.data.MediaList.startedAt.month,
+            month: anime.data.MediaList.startedAt.month,
-            day: aniListAnime.data.MediaList.startedAt.day
+            day: anime.data.MediaList.startedAt.day
         },
         completedAt: {
-            year: aniListAnime.data.MediaList.completedAt.year,
+            year: anime.data.MediaList.completedAt.year,
-            month: aniListAnime.data.MediaList.completedAt.month,
+            month: anime.data.MediaList.completedAt.month,
-            day: aniListAnime.data.MediaList.completedAt.day
+            day: anime.data.MediaList.completedAt.day
         },
-        repeat: aniListAnime.data.MediaList.repeat,
+        repeat: anime.data.MediaList.repeat,
-        score: aniListAnime.data.MediaList.score,
+        score: anime.data.MediaList.score,
-        notes: aniListAnime.data.MediaList.notes
+        notes: anime.data.MediaList.notes
     }
-    let startedAtDate: string
-    let completedAtDate: string
 
     const changeRating = (e) => {
         config.score = e.target.valueAsNumber
         values.score = e.target.valueAsNumber * 2
     }
 
+    let count = 1;
 
-    if (values.startedAt.year > 0) {
+    const decrement = () => {
-        let startedAtISODate = new Date(values.startedAt.year, values.startedAt.month - 1, values.startedAt.day)
+        if (count > 0) {
-        let startedAtMoment = moment(startedAtISODate)
+            count--
-        startedAtDate = startedAtMoment.format('YYYY-MM-DD')
         }
+    }
+
+    const increment = () => {
+        count++
+    }
+
+    let startedAtDate = `${values.startedAt.year}-${values.startedAt.month}-${values.startedAt.day}`
 
     const transformStartedAtDate = (e) => {
         const re = /^([0-9]{4})-([0-9]{2})-([0-9]{2})/
@@ -172,62 +89,31 @@
         values.startedAt.day = Number(date[3])
     }
 
-    if (values.completedAt.year > 0) {
+    console.log(startedAtDate)
-        let completedAtISODate = new Date(values.completedAt.year, values.completedAt.month - 1, values.completedAt.day)
-        let completedAtMoment = moment(completedAtISODate)
-        completedAtDate = completedAtMoment.format('YYYY-MM-DD')
-    }
-
-    const transformCompletedAtDate = (e) => {
-        const re = /^([0-9]{4})-([0-9]{2})-([0-9]{2})/
-        const date = re.exec(e.target.value)
-        values.completedAt.year = Number(date[1])
-        values.completedAt.month = Number(date[2])
-        values.completedAt.day = Number(date[3])
-    }
-
-    const submitData = async () => {
-       await AniListUpdateEntry(
-            aniListAnime.data.MediaList.mediaId,
-            values.progress,
-            values.status,
-            values.score,
-            values.repeat,
-            values.notes,
-            values.startedAt.year,
-            values.startedAt.month,
-            values.startedAt.day,
-            values.completedAt.year,
-            values.completedAt.month,
-            values.completedAt.day
-        ).then((value) => {
-           console.log(value)
-       })
-
-    }
 </script>
 
-<div id="inapp-data">
+<div>
-    <div class="grid grid-cols-1 md:grid-cols-10 grid-flow-col gap-4">
+    <div class="grid grid-rows-2 grid-cols-10 grid-flow-col gap-4 mt-10">
-        <div class="md:col-span-2 space-y-3">
+        <div class="row-span-2 col-span-2 space-y-3">
-            <img class="rounded-lg" src={aniListAnime.data.MediaList.media.coverImage.large} alt="{title} Cover Image">
+            <img class="rounded-lg" src={anime.data.MediaList.media.coverImage.large} alt="{title} Cover Image">
             <StarRatting bind:config on:change={changeRating}/>
             <p>Rating:  {config.score * 2}</p>
             <p>{ratingInWords[config.score * 2]}</p>
         </div>
 
-        <div class="md:col-span-8 ">
+        <div class="col-span-8 z-30">
-            <div class="flex flex-col md:flex-row md:pl-10 md:pr-10 pt-5 pb-5 justify-center md:gap-x-24 lg:gap-x-56">
+            <div class="flex flex-row p-10 justify-center gap-x-56">
-                <div>
+
-                    <label for="episodes" class="text-left block mb-2 text-sm font-medium text-gray-900 dark:text-white">Episode
+
-                        Progress</label>
+                <div class="mr-4">
+                    <label for="episodes" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">Episode Progress</label>
                     <input
                             type="number"
                             name="episodes"
                             min="0"
                             id="episodes"
                             class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600
-                            focus:border-primary-600 block w-24 p-2.5 dark:bg-gray-600 dark:border-gray-500 dark:placeholder-gray-400
+                            focus:border-primary-600 block w-full p-2.5 dark:bg-gray-600 dark:border-gray-500 dark:placeholder-gray-400
                             dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500"
                             bind:value={values.progress}
                             required>
@@ -235,13 +121,13 @@
 
 
                 <div>
-                    <label for="status"
+                    <label for="status" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">Select
-                           class="text-left block mb-2 text-sm font-medium text-gray-900 dark:text-white">Status</label>
+                        your
+                        country</label>
                     <select id="status"
                             class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500
                             focus:border-blue-500 block p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400
                             dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
-                            bind:value={values.status}
                     >
 
                         <option>CURRENT</option>
@@ -253,141 +139,58 @@
                     </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">
+            <div class="flex flex-row p-10 justify-center">
 
-                <div>
+                <div class="relative z-40 max-w-sm">
-
-                    <label for="startedAt" class="text-left block mb-2 text-sm font-medium text-gray-900 dark:text-white">Date
-                        Started</label>
-                    <div class="relative max-w-sm">
                     <div class="absolute inset-y-0 start-0 flex items-center ps-3.5 pointer-events-none">
-                            <svg class="w-4 h-4 text-gray-500 dark:text-gray-400" aria-hidden="true"
+                        <svg class="w-4 h-4 text-gray-500 dark:text-gray-400" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 20 20">
-                                 xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 20 20">
                             <path d="M20 4a2 2 0 0 0-2-2h-2V1a1 1 0 0 0-2 0v1h-3V1a1 1 0 0 0-2 0v1H6V1a1 1 0 0 0-2 0v1H2a2 2 0 0 0-2 2v2h20V4ZM0 18a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V8H0v10Zm5-8h10a1 1 0 0 1 0 2H5a1 1 0 0 1 0-2Z"/>
                         </svg>
                     </div>
+<!--                    <input-->
+<!--                            datepicker-->
+<!--                            datepicker-buttons-->
+<!--                            datepicker-autoselect-today-->
+<!--                            datepicker-autohide-->
+<!--                            datepicker-title="Started At"-->
+<!--                            id="startedAt"-->
+<!--                            type="text"-->
+<!--                            name="startedAt"-->
+<!--                            class="z-50 bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500-->
+<!--                            focus:border-blue-500 block w-full ps-10 p-2.5 dark:bg-gray-700 dark:border-gray-600-->
+<!--                            dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"-->
+<!--                            value={`${values.startedAt.year}-${values.startedAt.month}-${values.startedAt.day}`}-->
+<!--                            on:change={transformStartedAtDate}-->
+<!--                    >-->
                     <input
                             id="startedAt"
                             type="date"
                             name="startedAt"
-                                class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500
+                            class="z-50 bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500
                             focus:border-blue-500 block w-full ps-10 p-2.5 dark:bg-gray-700 dark:border-gray-600
                             dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
                             value={startedAtDate}
-                                placeholder="Date Started"
                             on:change={transformStartedAtDate}
                     >
                 </div>
-                </div>
-                <div>
 
-                    <label for="completedAt" class="text-left block mb-2 text-sm font-medium text-gray-900 dark:text-white">Date
-                        Completed</label>
-                    <div class="relative max-w-sm">
-                        <div class="absolute inset-y-0 start-0 flex items-center ps-3.5 pointer-events-none">
-                            <svg class="w-4 h-4 text-gray-500 dark:text-gray-400" aria-hidden="true"
-                                 xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 20 20">
-                                <path d="M20 4a2 2 0 0 0-2-2h-2V1a1 1 0 0 0-2 0v1h-3V1a1 1 0 0 0-2 0v1H6V1a1 1 0 0 0-2 0v1H2a2 2 0 0 0-2 2v2h20V4ZM0 18a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V8H0v10Zm5-8h10a1 1 0 0 1 0 2H5a1 1 0 0 1 0-2Z"/>
-                            </svg>
-                        </div>
-                        <input
-                                id="completedAt"
-                                type="date"
-                                name="completedAt"
-                                class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500
-                            focus:border-blue-500 block w-full ps-10 p-2.5 dark:bg-gray-700 dark:border-gray-600
-                            dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
-                                value={completedAtDate}
-                                placeholder="Date Completed"
-                                on:change={transformCompletedAtDate}
-                        >
-                    </div>
-                </div>
-                <div>
-                    <label for="repeat"
-                           class="text-left block mb-2 text-sm font-medium text-gray-900 dark:text-white">Rewatched</label>
-                    <input
-                            type="number"
-                            name="repeat"
-                            min="0"
-                            id="repeat"
-                            class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600
-                            focus:border-primary-600 block w-24 p-2.5 dark:bg-gray-600 dark:border-gray-500 dark:placeholder-gray-400
-                            dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500"
-                            bind:value={values.repeat}
-                            required>
-                </div>
-            </div>
-            <div class="flex flex-col md:flex-row md:pl-10 md:pr-10 pt-5 pb-5 justify-center">
-                <div class="w-full">
-                    <label for="notes" class="text-left block mb-2 text-sm font-medium text-gray-900 dark:text-white">Your
-                        notes</label>
-                    <textarea id="notes" rows="3"
-                              class="block p-2.5 w-full text-sm text-gray-900 bg-gray-50 rounded-lg border border-gray-300 focus:ring-blue-500 focus:border-blue-500 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
-                              placeholder="Write your thoughts here..."
-                              bind:value={values.notes}></textarea>
             </div>
         </div>
     </div>
-    </div>
+    <footer class="bg-white rounded-lg shadow m-4 dark:bg-gray-800">
-    <div id="external-data">
-        <div id="anilist-data" 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 group">
-            <h2 class="text-left mb-1 text-base font-semibold text-gray-900 dark:text-white">AniList</h2>
-        </div>
-    </div>
-
-    <Table hoverable={true}>
-        <TableHead>
-            <TableHeadCell class="cursor-pointer" on:click={() => sortTable('id')}>ID</TableHeadCell>
-            <TableHeadCell class="cursor-pointer" on:click={() => sortTable('service')}>Service</TableHeadCell>
-            <TableHeadCell class="cursor-pointer" on:click={() => sortTable('progress')}>Episode Progress</TableHeadCell>
-            <TableHeadCell class="cursor-pointer" on:click={() => sortTable('status')}>Status</TableHeadCell>
-            <TableHeadCell class="cursor-pointer" on:click={() => sortTable('startedAt')}>Date Started</TableHeadCell>
-            <TableHeadCell class="cursor-pointer" on:click={() => sortTable('completedAt')}>Date Completed</TableHeadCell>
-            <TableHeadCell class="cursor-pointer" on:click={() => sortTable('score')}>Rating</TableHeadCell>
-            <TableHeadCell class="cursor-pointer" on:click={() => sortTable('repeat')}>Rewatches</TableHeadCell>
-            <TableHeadCell>Notes</TableHeadCell>
-        </TableHead>
-        <TableBody tableBodyClass="divide-y">
-            {#each $sortItems as item}
-                <TableBodyRow>
-                    <TableBodyCell class="overflow-x-auto">{item.id}</TableBodyCell>
-                    <TableBodyCell class="overflow-x-auto">{item.service}</TableBodyCell>
-                    <TableBodyCell class="overflow-x-auto">{item.progress}</TableBodyCell>
-                    <TableBodyCell class="overflow-x-auto">{item.status}</TableBodyCell>
-                    <TableBodyCell class="overflow-x-auto">{item.startedAt}</TableBodyCell>
-                    <TableBodyCell class="overflow-x-auto">{item.completedAt}</TableBodyCell>
-                    <TableBodyCell class="overflow-x-auto">{item.score}</TableBodyCell>
-                    <TableBodyCell class="overflow-x-auto">{item.repeat}</TableBodyCell>
-                    <TableBodyCell class="overflow-x-auto">{item.notes}</TableBodyCell>
-                </TableBodyRow>
-            {/each}
-        </TableBody>
-    </Table>
-
-
-    <div class="bg-white rounded-lg shadow max-w-4-4 dark:bg-gray-800">
         <div class="w-full mx-auto max-w-screen-xl p-4 md:flex md:items-center md:justify-end">
             <Button
                     class="text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:ring-blue-300 font-medium
                     rounded-lg text-sm px-5 py-2.5 me-2 mb-2 dark:bg-blue-600 dark:hover:bg-blue-700 focus:outline-none
                     dark:focus:ring-blue-800"
-                    on:click={submitData}>Sync Changes
+                    on:click={() => alert('Handle "success"')}>Sync Changes
             </Button>
             <Button
                     class="text-gray-900 bg-white border border-gray-300 focus:outline-none hover:bg-gray-100 focus:ring-4
                     focus:ring-gray-100 font-medium rounded-lg text-sm px-5 py-2.5 me-2 mb-2 dark:bg-gray-800 dark:text-white
-                    dark:border-gray-600 dark:hover:bg-gray-700 dark:hover:border-gray-600 dark:focus:ring-gray-700"
+                    dark:border-gray-600 dark:hover:bg-gray-700 dark:hover:border-gray-600 dark:focus:ring-gray-700">
-                    on:click={hide}>
                 Cancel
             </Button>
         </div>
-    </div>
+    </footer>
-
-    <div>
-        <h3 class="text-2xl">
-            Summary
-        </h3>
-        <p>{@html aniListAnime.data.MediaList.media.description}</p>
-    </div>
 </div>

frontend/src/GetAniListSingleItemAndOpenModal.svelte

@@ -2,21 +2,17 @@
     import {GetAniListItem} from "../wailsjs/go/main/App";
     import type {AniListGetSingleAnime} from "./anilist/types/AniListCurrentUserWatchListType.js";
     import {writable} from 'svelte/store'
-    import type {SimklWatchList} from "./simkl/types/simklTypes";
 
-    export let aniListAnime: AniListGetSingleAnime
+    export let anime: AniListGetSingleAnime
     export let title = writable("")
     export let anilistModal = writable(false);
-    export let aniListLoggedIn = writable(false)
-    export let simklLoggedIn = writable(false)
-    export let simklWatchList = writable({} as SimklWatchList)
 
     export function GetAniListSingleItemAndOpenModal(aniId: number, login: boolean): void {
         GetAniListItem(aniId, login).then(result => {
-            aniListAnime = result
+            anime = result
-            title.set(aniListAnime.data.MediaList.media.title.english === "" ?
+            title.set(anime.data.MediaList.media.title.english === "" ?
-                aniListAnime.data.MediaList.media.title.romaji :
+                anime.data.MediaList.media.title.romaji :
-                aniListAnime.data.MediaList.media.title.english)
+                anime.data.MediaList.media.title.english)
             anilistModal.set(true)
         })
     }

frontend/src/Search.svelte

@@ -2,7 +2,7 @@
 
     import {AniListSearch} from "../wailsjs/go/main/App";
     import type {AniSearchList} from "./anilist/types/AniListTypes";
-    import {GetAniListSingleItemAndOpenModal} from "./GlobalVariablesAndHelperFunctions.svelte";
+    import {GetAniListSingleItemAndOpenModal} from "./GetAniListSingleItemAndOpenModal.svelte";
 
     let aniSearch = ""
     let aniListSearch: AniSearchList
@@ -51,18 +51,14 @@
                 aria-labelledby="aniListSearchButton">
                 {#each aniListSearch.data.Page.media as media}
                     <li class="w-full">
-                        <div class="flex w-full items-start p-1 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white rounded-lg">
                         <button on:click={() => {
                             GetAniListSingleItemAndOpenModal(media.id, false)
                         }}
-                                    >
+                                class="flex w-full items-start p-1 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white rounded-lg">
                             <img class="rounded-bl-lg rounded-tl-lg max-w-24 max-h-24" src={media.coverImage.large}
                                  alt="{media.title.english === '' || media.title.english === null ?  media.title.romaji : media.title.english} Cover">
+                            <p class="bg-gray-800 text-left w-full h-24 p-2 rounded-tr-lg rounded-br-lg">{media.title.english === '' || media.title.english === null ? media.title.romaji : media.title.english }</p>
                         </button>
-                                <button class="rounded-bl-lg rounded-tl-lg w-full h-24" on:click={() => {
-                                GetAniListSingleItemAndOpenModal(media.id, false)
-                            }} >{media.title.english === '' || media.title.english === null ? media.title.romaji : media.title.english }</button>
-                        </div>
                     </li>
                 {/each}
             </ul>

frontend/src/modal/Modal.svelte

@@ -1,155 +0,0 @@
-<script>import { twMerge } from "tailwind-merge";
-import { Frame } from "flowbite-svelte";
-import { createEventDispatcher } from "svelte";
-import {CloseButton} from "flowbite-svelte";
-import focusTrap from "../../node_modules/flowbite-svelte/dist/utils/focusTrap.js";
-export let open = false;
-export let title = "";
-export let size = "md";
-export let color = "default";
-export let placement = "center";
-export let autoclose = false;
-export let outsideclose = false;
-export let dismissable = true;
-export let backdropClass = "fixed inset-0 z-20 bg-gray-900 bg-opacity-50 dark:bg-opacity-80";
-export let classBackdrop = void 0;
-export let dialogClass = "fixed top-0 start-0 end-0 h-modal md:inset-0 md:h-full z-30 w-full p-4 flex";
-export let classDialog = void 0;
-export let defaultClass = "relative flex flex-col mx-auto";
-export let headerClass = "flex justify-between items-center p-4 md:p-5 rounded-t-lg";
-export let classHeader = void 0;
-export let bodyClass = "p-4 md:p-5 space-y-4 flex-1 overflow-y-auto overscroll-contain";
-export let classBody = void 0;
-export let footerClass = "flex items-center p-4 md:p-5 space-x-3 rtl:space-x-reverse rounded-b-lg";
-export let classFooter = void 0;
-const dispatch = createEventDispatcher();
-$: dispatch(open ? "open" : "close");
-function prepareFocus(node) {
-  const walker = document.createTreeWalker(node, NodeFilter.SHOW_ELEMENT);
-  let n;
-  while (n = walker.nextNode()) {
-    if (n instanceof HTMLElement) {
-      const el = n;
-      const [x, y] = isScrollable(el);
-      if (x || y) el.tabIndex = 0;
-    }
-  }
-  node.focus();
-}
-const getPlacementClasses = (placement2) => {
-  switch (placement2) {
-    case "top-left":
-      return ["justify-start", "items-start"];
-    case "top-center":
-      return ["justify-center", "items-start"];
-    case "top-right":
-      return ["justify-end", "items-start"];
-    case "center-left":
-      return ["justify-start", "items-center"];
-    case "center":
-      return ["justify-center", "items-center"];
-    case "center-right":
-      return ["justify-end", "items-center"];
-    case "bottom-left":
-      return ["justify-start", "items-end"];
-    case "bottom-center":
-      return ["justify-center", "items-end"];
-    case "bottom-right":
-      return ["justify-end", "items-end"];
-    default:
-      return ["justify-center", "items-center"];
-  }
-};
-const sizes = {
-  xs: "max-w-md",
-  sm: "max-w-lg",
-  md: "max-w-2xl",
-  lg: "max-w-4xl",
-  xl: "max-w-6xl"
-};
-const onAutoClose = (e) => {
-  const target = e.target;
-  if (autoclose && target?.tagName === "BUTTON") hide(e);
-};
-const onOutsideClose = (e) => {
-  const target = e.target;
-  if (outsideclose && target === e.currentTarget) hide(e);
-};
-const hide = (e) => {
-  e.preventDefault();
-  open = false;
-};
-const isScrollable = (e) => [e.scrollWidth > e.clientWidth && ["scroll", "auto"].indexOf(getComputedStyle(e).overflowX) >= 0, e.scrollHeight > e.clientHeight && ["scroll", "auto"].indexOf(getComputedStyle(e).overflowY) >= 0];
-function handleKeys(e) {
-  if (e.key === "Escape" && dismissable) return hide(e);
-}
-$: backdropCls = twMerge(backdropClass, classBackdrop);
-$: dialogCls = twMerge(dialogClass, classDialog, getPlacementClasses(placement));
-$: frameCls = twMerge(defaultClass, "w-full divide-y", $$props.class);
-$: headerCls = twMerge(headerClass, classHeader);
-$: bodyCls = twMerge(bodyClass, classBody);
-$: footerCls = twMerge(footerClass, classFooter);
-</script>
-
-{#if open}
-  <!-- backdrop -->
-  <div class={backdropCls}></div>
-  <!-- dialog -->
-  <!-- svelte-ignore a11y-no-noninteractive-element-interactions -->
-  <div on:keydown={handleKeys} on:wheel|preventDefault|nonpassive use:prepareFocus use:focusTrap on:click={onAutoClose} on:mousedown={onOutsideClose} class={dialogCls} tabindex="-1" aria-modal="true" role="dialog">
-    <div class="flex relative {sizes[size]} w-full max-h-full">
-      <!-- Modal content -->
-      <Frame rounded shadow {...$$restProps} class={frameCls} {color}>
-        <!-- Modal header -->
-        {#if $$slots.header || title}
-          <Frame class={headerCls} {color}>
-            <slot name="header">
-              <h3 class="text-xl font-semibold {color === 'default' ? '' : 'text-gray-900 dark:text-white'} p-0">
-                {title}
-              </h3>
-            </slot>
-            {#if dismissable}<CloseButton name="Close modal" {color} on:click={hide} />{/if}
-          </Frame>
-        {/if}
-        <!-- Modal body -->
-        <div class={bodyCls} role="document" on:keydown|stopPropagation={handleKeys} on:wheel|stopPropagation|passive>
-          {#if dismissable && !$$slots.header && !title}
-            <CloseButton name="Close modal" class="absolute top-3 end-2.5" {color} on:click={hide} />
-          {/if}
-          <slot></slot>
-        </div>
-        <!-- Modal footer -->
-        {#if $$slots.footer}
-          <Frame class={footerCls} {color}>
-            <slot name="footer"></slot>
-          </Frame>
-        {/if}
-      </Frame>
-    </div>
-  </div>
-{/if}
-
-<!--
-@component
-[Go to docs](https://flowbite-svelte.com/)
-## Props
-@prop export let open: boolean = false;
-@prop export let title: string = '';
-@prop export let size: SizeType = 'md';
-@prop export let color: ComponentProps<Frame>['color'] = 'default';
-@prop export let placement: ModalPlacementType = 'center';
-@prop export let autoclose: boolean = false;
-@prop export let outsideclose: boolean = false;
-@prop export let dismissable: boolean = true;
-@prop export let backdropClass: string = 'fixed inset-0 z-40 bg-gray-900 bg-opacity-50 dark:bg-opacity-80';
-@prop export let classBackdrop: string | undefined = undefined;
-@prop export let dialogClass: string = 'fixed top-0 start-0 end-0 h-modal md:inset-0 md:h-full z-50 w-full p-4 flex';
-@prop export let classDialog: string | undefined = undefined;
-@prop export let defaultClass: string = 'relative flex flex-col mx-auto';
-@prop export let headerClass: string = 'flex justify-between items-center p-4 md:p-5 rounded-t-lg';
-@prop export let classHeader: string | undefined = undefined;
-@prop export let bodyClass: string = 'p-4 md:p-5 space-y-4 flex-1 overflow-y-auto overscroll-contain';
-@prop export let classBody: string | undefined = undefined;
-@prop export let footerClass: string = 'flex items-center p-4 md:p-5 space-x-3 rtl:space-x-reverse rounded-b-lg';
-@prop export let classFooter: string | undefined = undefined;
--->

frontend/src/modal/Modal.svelte.d.ts

@@ -1,77 +0,0 @@
-import { SvelteComponentTyped } from "svelte";
-import type { Dismissable, SizeType } from '../types';
-import type { ModalPlacementType } from '../types';
-declare const __propDef: {
-    props: import("svelte/elements").HTMLAnchorAttributes & {
-        tag?: string;
-        color?: import("../utils/Frame.svelte").FrameColor;
-        rounded?: boolean;
-        border?: boolean;
-        shadow?: boolean;
-        node?: HTMLElement | undefined;
-        use?: import("svelte/action").Action<HTMLElement, any>;
-        options?: object;
-        class?: string;
-        role?: string;
-        open?: boolean;
-        transition?: (node: HTMLElement, params: any) => import("svelte/transition").TransitionConfig;
-        params?: any;
-    } & Dismissable & {
-        open?: boolean;
-        title?: string;
-        size?: SizeType;
-        placement?: ModalPlacementType;
-        autoclose?: boolean;
-        outsideclose?: boolean;
-        backdropClass?: string;
-        classBackdrop?: string;
-        dialogClass?: string;
-        classDialog?: string;
-        defaultClass?: string;
-        headerClass?: string;
-        classHeader?: string;
-        bodyClass?: string;
-        classBody?: string;
-        footerClass?: string;
-        classFooter?: string;
-    };
-    events: {
-        wheel: WheelEvent;
-    } & {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {
-        header: {};
-        default: {};
-        footer: {};
-    };
-};
-export type ModalProps = typeof __propDef.props;
-export type ModalEvents = typeof __propDef.events;
-export type ModalSlots = typeof __propDef.slots;
-/**
- * [Go to docs](https://flowbite-svelte.com/)
- * ## Props
- * @prop export let open: boolean = false;
- * @prop export let title: string = '';
- * @prop export let size: SizeType = 'md';
- * @prop export let color: ComponentProps<Frame>['color'] = 'default';
- * @prop export let placement: ModalPlacementType = 'center';
- * @prop export let autoclose: boolean = false;
- * @prop export let outsideclose: boolean = false;
- * @prop export let dismissable: boolean = true;
- * @prop export let backdropClass: string = 'fixed inset-0 z-40 bg-gray-900 bg-opacity-50 dark:bg-opacity-80';
- * @prop export let classBackdrop: string | undefined = undefined;
- * @prop export let dialogClass: string = 'fixed top-0 start-0 end-0 h-modal md:inset-0 md:h-full z-50 w-full p-4 flex';
- * @prop export let classDialog: string | undefined = undefined;
- * @prop export let defaultClass: string = 'relative flex flex-col mx-auto';
- * @prop export let headerClass: string = 'flex justify-between items-center p-4 md:p-5 rounded-t-lg';
- * @prop export let classHeader: string | undefined = undefined;
- * @prop export let bodyClass: string = 'p-4 md:p-5 space-y-4 flex-1 overflow-y-auto overscroll-contain';
- * @prop export let classBody: string | undefined = undefined;
- * @prop export let footerClass: string = 'flex items-center p-4 md:p-5 space-x-3 rtl:space-x-reverse rounded-b-lg';
- * @prop export let classFooter: string | undefined = undefined;
- */
-export default class Modal extends SvelteComponentTyped<ModalProps, ModalEvents, ModalSlots> {
-}
-export {};

frontend/src/simkl/types/simklTypes.ts

@@ -19,10 +19,7 @@ export type SimklUser = {
 }
 
 export type SimklWatchList = {
-    anime: [SimklAnime]
+    anime: [{
-}
-
-export type SimklAnime = {
         last_watched_at: string,
         status: string
         user_rating: number,
@@ -58,4 +55,5 @@ export type SimklAnime = {
             }
         },
         anime_type: string
+    }]
 }

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

@@ -6,7 +6,7 @@ export function AniListLogin():Promise<void>;
 
 export function AniListSearch(arg1:string):Promise<any>;
 
-export function AniListUpdateEntry(arg1:number,arg2:number,arg3:string,arg4:number,arg5:number,arg6:string,arg7:number,arg8:number,arg9:number,arg10:number,arg11:number,arg12:number):Promise<any>;
+export function AniListUpdateEntry(arg1:number,arg2:string,arg3:string,arg4:number,arg5:number,arg6:string,arg7:number,arg8:number,arg9:number,arg10:number,arg11:number,arg12:number):Promise<any>;
 
 export function CheckIfAniListLoggedIn():Promise<boolean>;
 

frontend/wailsjs/go/models.ts

@@ -95,7 +95,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\"" }
 	    media: any;
 	    status: string;
 	    // Go type: struct { Year int "json:\"year\""; Month int "json:\"month\""; Day int "json:\"day\"" }