refactor: sharing page actions (#25368)

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

@@ -5,6 +5,8 @@
   import EmptyPlaceholder from '$lib/components/shared-components/empty-placeholder.svelte';
   import UserAvatar from '$lib/components/shared-components/user-avatar.svelte';
   import { Route } from '$lib/route';
+  import { getAlbumsActions } from '$lib/services/album.service';
+  import { getSharedLinksActions } from '$lib/services/shared-link.service';
   import {
     AlbumFilter,
     AlbumGroupBy,
@@ -13,15 +15,12 @@
     SortOrder,
     type AlbumViewSettings,
   } from '$lib/stores/preferences.store';
-  import { createAlbumAndRedirect } from '$lib/utils/album-utils';
-  import { Button, HStack, Text } from '@immich/ui';
-  import { mdiLink, mdiPlusBoxOutline } from '@mdi/js';
   import { t } from 'svelte-i18n';
   import type { PageData } from './$types';
 
-  interface Props {
+  type Props = {
     data: PageData;
-  }
+  };
 
   let { data }: Props = $props();
 
@@ -34,26 +33,12 @@
     sortOrder: SortOrder.Desc,
     collapsedGroups: {},
   };
+
+  const { Create: CreateAlbum } = $derived(getAlbumsActions($t));
+  const { ViewAll: ViewSharedLinks } = $derived(getSharedLinksActions($t));
 </script>
 
-<UserPageLayout title={data.meta.title}>
-  {#snippet buttons()}
-    <HStack gap={0}>
-      <Button
-        leadingIcon={mdiPlusBoxOutline}
-        onclick={() => createAlbumAndRedirect()}
-        size="small"
-        variant="ghost"
-        color="secondary"
-      >
-        <Text class="hidden md:block">{$t('create_album')}</Text>
-      </Button>
-      <Button leadingIcon={mdiLink} href={Route.sharedLinks()} size="small" variant="ghost" color="secondary">
-        <Text class="hidden md:block">{$t('shared_links')}</Text>
-      </Button>
-    </HStack>
-  {/snippet}
-
+<UserPageLayout title={data.meta.title} actions={[ViewSharedLinks, CreateAlbum]}>
   <div class="flex flex-col">
     {#if data.partners.length > 0}
       <div class="mb-6 mt-2">