No longer showing logged out users the profile pic thingy

ref #1

src/lib/Apiclient.js

@@ -18,6 +18,7 @@ export default class Apiclient {
 	}
 
 	static async getUrls() {
+		console.log("APICALL")
 		return (
 			await axios.get('https://kauft.es/api?showVisits=true', {
 				headers: { Authorization: `Bearer ${UserStore.state.token}` }
@@ -62,7 +63,9 @@ export default class Apiclient {
 	static async logout() {
 		return (
 			await axios.post(`https://kauft.es/api/auth/logout`, {}, {
-				headers: { Authorization: `Bearer ${UserStore.state.token}` }
+				headers: { Authorization: `Bearer ${UserStore.state.token}`,
+				validateStatus: null
+			}
 			})
 		).data;
 	}

src/lib/Sidebar.svelte

@@ -1,21 +1,10 @@
 <script>
 	import UserStore from '$lib/UserStore';
-	import { onDestroy, onMount } from 'svelte';
+	import { onDestroy } from 'svelte';
-	import * as localForage from 'localforage';
 	import Apiclient from './Apiclient';
 
 	$: logged_in = false;
 
-	onMount(() => {
-		localForage.getItem('userdata', (err, value) => {
-			if (value) {
-				if (value.token) {
-					UserStore.login(value);
-				}
-			}
-		});
-	});
-
 	const unsubscribe = UserStore.subscribe((value) => {
 		logged_in = value.isLoggedIn;
 	});
@@ -23,7 +12,7 @@
 	onDestroy(unsubscribe);
 
 	async function logout() {
-		await Apiclient.logout().catch((e)=>{});
+		await Apiclient.logout().catch((e) => {});
 		UserStore.logout();
 	}
 </script>
@@ -166,13 +155,15 @@
 			{/if}
 		</nav>
 
+		{#if logged_in}
 			<div class="flex items-center px-4 -mx-2">
 				<img
 					class="object-cover mx-2 rounded-full h-9 w-9"
 					src="https://images.unsplash.com/photo-1531427186611-ecfd6d936c79?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=634&q=80"
 					alt="avatar"
 				/>
-			<h4 class="mx-2 font-medium text-gray-800 dark:text-gray-200 hover:underline">John Doe</h4>
+				<h4 class="mx-2 font-medium text-gray-800 dark:text-gray-200 hover:underline">Username here</h4>
 			</div>
+		{/if}
 	</div>
 </div>

src/routes/__layout.svelte

@@ -2,8 +2,20 @@
 	import '../app.postcss';
 	import Sidebar from '$lib/Sidebar.svelte';
 	import UserStore from '$lib/UserStore';
+	import { onMount } from 'svelte';
+	import * as localForage from 'localforage';
 
+	onMount(() => {
 		UserStore.init();
+		localForage.getItem('userdata', (err, value) => {
+			if (value) {
+				if (value.token) {
+					UserStore.login(value);
+				}
+			}
+		});
+	});
+
 </script>
 
 <div style="min-height: 640px;" class="bg-white dark:bg-gray-800">

src/routes/details.svelte

@@ -1,8 +1,11 @@
 <script>
 	import { page } from '$app/stores';
 	import Apiclient from '$lib/Apiclient';
+	import UserStore from '$lib/UserStore';
+	import { onDestroy } from 'svelte';
 
 	let shortcode = $page.query.get('shortcode');
+
 	$: urlDetails = {
 		shortcode: 'Loading...',
 		url: 'Loading...',
@@ -10,13 +13,20 @@
 		visits: 'Loading...'
 	};
 	$: urlVisists = [];
+	let visitQuery;
 
+	const unsubscribe = UserStore.subscribe((value) => {
+		if (value.isLoggedIn) {
 			Apiclient.getUrlDetails(shortcode).then((res) => {
 				urlDetails = res;
 			});
-	let visitQuery = Apiclient.getUrlVisits(shortcode).then((res) => {
+			visitQuery = Apiclient.getUrlVisits(shortcode).then((res) => {
 				urlVisists = res;
 			});
+		}
+	});
+
+	onDestroy(unsubscribe);
 </script>
 
 <h2 class="text-3xl font-bold text-gray-800 dark:text-gray-100 pb-6">Details: {shortcode}</h2>

src/routes/links.svelte

@@ -1,9 +1,20 @@
 <script>
 	import Apiclient from '$lib/Apiclient';
+	import UserStore from '$lib/UserStore';
+	import { onDestroy } from 'svelte';
+
 	$: urls = [];
-	let urlQuery = Apiclient.getUrls().then((res) => {
+	let urlQuery;
+
+	const unsubscribe = UserStore.subscribe((value) => {
+		if (value.isLoggedIn) {
+			urlQuery = Apiclient.getUrls().then((res) => {
 				urls = res;
 			});
+		}
+	});
+
+	onDestroy(unsubscribe);
 
 	function deleteUrl(shortcode) {
 		Apiclient.deleteUrl(shortcode).then(() => {

src/routes/login.svelte

@@ -7,7 +7,6 @@ import Apiclient from '$lib/Apiclient';
 	$: password = "";
 	$: error = "";
 
-	UserStore.init();
 	async function login() {
 		try {
 			const login = await Apiclient.login(username, password);