feat(web): automatically update user info (#5647)

* use svelte store

* fix: websocket error when not authenticated

* more routes

web/src/routes/(user)/albums/+page.svelte

@@ -245,7 +245,7 @@
   </FullScreenModal>
 {/if}
 
-<UserPageLayout user={data.user} title={data.meta.title}>
+<UserPageLayout title={data.meta.title}>
   <div class="flex place-items-center gap-2" slot="buttons">
     <LinkButton on:click={handleCreateAlbum}>
       <div class="flex place-items-center gap-2 text-sm">
@@ -291,11 +291,7 @@
       <div class="grid grid-cols-[repeat(auto-fill,minmax(14rem,1fr))]">
         {#each $albums as album (album.id)}
           <a data-sveltekit-preload-data="hover" href="{AppRoute.ALBUMS}/{album.id}" animate:flip={{ duration: 200 }}>
-            <AlbumCard
-              {album}
-              on:showalbumcontextmenu={(e) => showAlbumContextMenu(e.detail, album)}
-              user={data.user}
-            />
+            <AlbumCard {album} on:showalbumcontextmenu={(e) => showAlbumContextMenu(e.detail, album)} />
           </a>
         {/each}
       </div>

web/src/routes/(user)/albums/+page.ts

@@ -3,11 +3,10 @@ import { api } from '@api';
 import type { PageLoad } from './$types';
 
 export const load = (async () => {
-  const user = await authenticate();
+  await authenticate();
   const { data: albums } = await api.albumApi.getAllAlbums();
 
   return {
-    user,
     albums,
     meta: {
       title: 'Albums',

web/src/routes/(user)/albums/[albumId]/+page.svelte

@@ -109,8 +109,8 @@
   const timelineInteractionStore = createAssetInteractionStore();
   const { selectedAssets: timelineSelected } = timelineInteractionStore;
 
-  $: isOwned = data.user.id == album.ownerId;
-  $: isAllUserOwned = Array.from($selectedAssets).every((asset) => asset.ownerId === data.user.id);
+  $: isOwned = $user.id == album.ownerId;
+  $: isAllUserOwned = Array.from($selectedAssets).every((asset) => asset.ownerId === $user.id);
   $: isAllFavorite = Array.from($selectedAssets).every((asset) => asset.isFavorite);
   $: {
     if (isShowActivity) {
@@ -343,7 +343,7 @@
   };
 
   const handleRemoveUser = async (userId: string) => {
-    if (userId == 'me' || userId === data.user.id) {
+    if (userId == 'me' || userId === $user.id) {
       goto(backUrl);
       return;
     }

web/src/routes/(user)/albums/[albumId]/+page.ts

@@ -3,12 +3,11 @@ import { api } from '@api';
 import type { PageLoad } from './$types';
 
 export const load = (async ({ params }) => {
-  const user = await authenticate();
+  await authenticate();
   const { data: album } = await api.albumApi.getAlbumInfo({ id: params.albumId, withoutAssets: true });
 
   return {
     album,
-    user,
     meta: {
       title: album.albumName,
     },