View assets detail and download operation (#198)

* Fixed not displaying default user profile picture

* Added buttons to close viewer and micro-interaction for navigating assets left, right

* Add additional buttons to the control bar

* Display EXIF info

* Added map to detail info

* Handle user input keyboard

* Fixed incorrect file name when downloading multiple files

* Implemented download panel

web/src/lib/components/shared/navigation-bar.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+	import { goto } from '$app/navigation';
 	import { page } from '$app/stores';
 	import type { ImmichUser } from '$lib/models/immich-user';
 	import { onMount } from 'svelte';
@@ -11,13 +12,19 @@
 	let shouldShowProfileImage = false;
 
 	onMount(async () => {
-		const res = await fetch(`${serverEndpoint}/user/profile-image/${user.id}`);
+		const res = await fetch(`${serverEndpoint}/user/profile-image/${user.id}`, { method: 'GET' });
 
 		if (res.status == 200) shouldShowProfileImage = true;
 	});
+
 	const getFirstLetter = (text?: string) => {
 		return text?.charAt(0).toUpperCase();
 	};
+
+	const navigateToAdmin = () => {
+		console.log('Navigating to admin page');
+		goto('/admin');
+	};
 </script>
 
 <section id="dashboard-navbar" class="fixed w-screen  z-[100] bg-immich-bg text-sm">
@@ -33,11 +40,11 @@
 			<!-- <div>Upload</div> -->
 
 			{#if user.isAdmin}
-				<a
+				<button
 					class={`hover:text-immich-primary font-medium ${
 						$page.url.pathname == '/admin' && 'text-immich-primary underline'
 					}`}
-					href="/admin">Administration</a
+					on:click={navigateToAdmin}>Administration</button
 				>
 			{/if}