Fix saving collection, update dependencies, remove console logs.

package.json

@@ -13,18 +13,18 @@
     "format": "prettier --write --plugin-search-dir=. ."
   },
   "devDependencies": {
-    "@playwright/test": "^1.24.2",
+    "@playwright/test": "^1.25.1",
     "@rgossiaux/svelte-headlessui": "1.0.2",
     "@rgossiaux/svelte-heroicons": "^0.1.2",
-    "@sveltejs/adapter-auto": "1.0.0-next.65",
-    "@sveltejs/kit": "1.0.0-next.431",
+    "@sveltejs/adapter-auto": "1.0.0-next.69",
+    "@sveltejs/kit": "1.0.0-next.448",
     "@types/cookie": "^0.5.1",
-    "@types/node": "^18.6.4",
-    "@typescript-eslint/eslint-plugin": "^5.32.0",
-    "@typescript-eslint/parser": "^5.32.0",
+    "@types/node": "^18.7.13",
+    "@typescript-eslint/eslint-plugin": "^5.35.1",
+    "@typescript-eslint/parser": "^5.35.1",
     "carbon-components-svelte": "^0.67.7",
     "carbon-icons-svelte": "^11.2.0",
-    "eslint": "^8.21.0",
+    "eslint": "^8.23.0",
     "eslint-config-prettier": "^8.1.0",
     "eslint-plugin-svelte3": "^4.0.0",
     "just-debounce-it": "^3.0.1",
@@ -32,11 +32,11 @@
     "prettier-plugin-svelte": "^2.7.0",
     "sass": "^1.54.3",
     "svelte": "^3.49.0",
-    "svelte-check": "^2.8.0",
+    "svelte-check": "^2.9.0",
     "svelte-preprocess": "^4.10.7",
     "tslib": "^2.0.0",
-    "typescript": "^4.7.4",
-    "vite": "^3.0.4"
+    "typescript": "^4.8.2",
+    "vite": "^3.0.9"
   },
   "type": "module",
   "dependencies": {

src/lib/components/preferences/gameCollection.svelte

@@ -1,6 +1,23 @@
 <script lang="ts">
+  import { browser } from '$app/environment';
+  import { collectionStore } from '$root/lib/stores/collectionStore';
+  import { ToastType } from '$root/lib/types';
   import { SaveIcon, TrashIcon } from '@rgossiaux/svelte-heroicons/outline';
-  import { clearCollection, saveCollection } from '$root/lib/util/manipulateCollection';
+  import { toast } from '../toast/toast';
+
+  function saveCollection() {
+    console.log('Saving collection');
+    console.log('collectionStore', $collectionStore);
+    if (!browser) return;
+    localStorage.collection = JSON.stringify($collectionStore);
+    toast.send('Saved collection', { duration: 3000, type: ToastType.INFO });
+  }
+
+  function clearCollection() {
+    if (!browser) return;
+    localStorage.collection = [];
+    toast.send('Cleared collection', { duration: 3000, type: ToastType.INFO });
+  }
 </script>
 
 <div>

src/lib/components/preferences/themes.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
   import { fade } from 'svelte/transition';
-  import { browser } from '$app/env';
+  import { browser } from '$app/environment';
   import {
     Listbox,
     ListboxButton,

src/lib/util/manipulateCollection.ts

@@ -1,7 +1,7 @@
 import { collectionStore } from '$lib/stores/collectionStore';
 import { toast } from '$lib/components/toast/toast';
 import { ToastType, type GameType, type SavedGameType } from '$lib/types';
-import { browser } from '$app/env';
+import { browser } from '$app/environment';
 
 function convertToSavedGame(game: GameType): SavedGameType {
   return {
@@ -20,17 +20,3 @@ export function removeFromCollection(game: GameType) {
   collectionStore.remove(game.id);
   toast.send("Removed from collection", { duration: 3000, type: ToastType.INFO });
 }
-
-export function saveCollection() {
-  console.log('Saving collection');
-  console.log('collectionStore', collectionStore);
-  if (!browser) return;
-  localStorage.collection = JSON.stringify(collectionStore);
-  toast.send('Saved collection', { duration: 3000, type: ToastType.INFO });
-}
-
-export function clearCollection() {
-  if (!browser) return;
-  localStorage.collection = [];
-  toast.send('Cleared collection', { duration: 3000, type: ToastType.INFO });
-}

src/routes/+layout.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-  import { browser } from '$app/env';
+  import { browser } from '$app/environment';
   import { navigating } from '$app/stores';
   import debounce from 'just-debounce-it';
   import { Toy } from '@leveluptuts/svelte-toy';
@@ -29,10 +29,10 @@
     let collectionEmpty = $collectionStore.length === 0 || false;
     console.log('collectionEmpty', collectionEmpty);
     console.log('localStorage.collection', localStorage.collection);
-    if (collectionEmpty && localStorage?.collection && localStorage.collection.length !== 0) {
+    if (collectionEmpty && localStorage?.collection && localStorage?.collection?.length !== 0) {
       const collection = JSON.parse(localStorage.collection);
       console.log('collection', collection);
-      if (collection && collection.length !== 0) {
+      if (collection?.length !== 0) {
         collectionStore.addAll(collection);
       }
     }

src/routes/api.ts

@@ -19,7 +19,7 @@ export function boardGameApi(
   queryParams: Record<string, string>,
   data?: Record<string, unknown>
 ) {
-  console.log('queryParams', queryParams);
+  // console.log('queryParams', queryParams);
   queryParams.client_id = import.meta.env.VITE_PUBLIC_CLIENT_ID;
   const urlQueryParams = new URLSearchParams(queryParams);
   const url = `${base}/${resource}${urlQueryParams ? `?${urlQueryParams}` : ''}`;

src/routes/game/[id]/+page.server.ts

@@ -13,7 +13,7 @@ export const load: PageServerLoad = async ({ params }: GamePageParams) => {
   const queryParams = {
     ids: `${params?.id}`
   };
-  console.log('queryParams', queryParams);
+  // console.log('queryParams', queryParams);
   const response = await boardGameApi('get', `search`, queryParams);
   if (response.status === 404) {
     return {
@@ -25,7 +25,7 @@ export const load: PageServerLoad = async ({ params }: GamePageParams) => {
     const gameResponse = await response.json();
     // console.log('gameResponse', gameResponse);
     // const games = gameResponse?.games;
-    console.log('game response', gameResponse?.games[0]);
+    // console.log('game response', gameResponse?.games[0]);
     return {
       game: gameResponse?.games[0]
     };