refactor(web) open api client (#7103)

* refactor: person api

* refactor: shared link and others

web/src/routes/(user)/share/[key]/+page.svelte

@@ -1,14 +1,15 @@
 <script lang="ts">
   import AlbumViewer from '$lib/components/album-page/album-viewer.svelte';
+  import Button from '$lib/components/elements/buttons/button.svelte';
   import IndividualSharedViewer from '$lib/components/share-page/individual-shared-viewer.svelte';
   import ControlAppBar from '$lib/components/shared-components/control-app-bar.svelte';
   import ImmichLogo from '$lib/components/shared-components/immich-logo.svelte';
   import ThemeButton from '$lib/components/shared-components/theme-button.svelte';
-  import Button from '$lib/components/elements/buttons/button.svelte';
-  import { api, SharedLinkType } from '@api';
-  import type { PageData } from './$types';
-  import { handleError } from '$lib/utils/handle-error';
   import { user } from '$lib/stores/user.store';
+  import { handleError } from '$lib/utils/handle-error';
+  import { SharedLinkType } from '@api';
+  import { getMySharedLink } from '@immich/sdk';
+  import type { PageData } from './$types';
 
   export let data: PageData;
   let { sharedLink, passwordRequired, sharedLinkKey: key, meta } = data;
@@ -18,9 +19,8 @@
 
   const handlePasswordSubmit = async () => {
     try {
-      const result = await api.sharedLinkApi.getMySharedLink({ password, key });
+      sharedLink = await getMySharedLink({ password, key });
       passwordRequired = false;
-      sharedLink = result.data;
       isOwned = $user ? $user.id === sharedLink.userId : false;
       title = (sharedLink.album ? sharedLink.album.albumName : 'Public Share') + ' - Immich';
       description = sharedLink.description || `${sharedLink.assets.length} shared photos & videos.`;

web/src/routes/(user)/share/[key]/+page.ts

@@ -1,16 +1,17 @@
+import { getAssetThumbnailUrl } from '$lib/utils';
 import { authenticate } from '$lib/utils/auth';
-import { api, ThumbnailFormat } from '@api';
+import { ThumbnailFormat } from '@api';
+import { getMySharedLink } from '@immich/sdk';
+import { error as throwError } from '@sveltejs/kit';
 import type { AxiosError } from 'axios';
 import type { PageLoad } from './$types';
-import { error as throwError } from '@sveltejs/kit';
 
 export const load = (async ({ params }) => {
   const { key } = params;
   await authenticate({ public: true });
 
   try {
-    const { data: sharedLink } = await api.sharedLinkApi.getMySharedLink({ key });
-
+    const sharedLink = await getMySharedLink({ key });
     const assetCount = sharedLink.assets.length;
     const assetId = sharedLink.album?.albumThumbnailAssetId || sharedLink.assets[0]?.id;
 
@@ -19,9 +20,7 @@ export const load = (async ({ params }) => {
       meta: {
         title: sharedLink.album ? sharedLink.album.albumName : 'Public Share',
         description: sharedLink.description || `${assetCount} shared photos & videos.`,
-        imageUrl: assetId
-          ? api.getAssetThumbnailUrl(assetId, ThumbnailFormat.Webp, sharedLink.key)
-          : '/feature-panel.png',
+        imageUrl: assetId ? getAssetThumbnailUrl(assetId, ThumbnailFormat.Webp) : '/feature-panel.png',
       },
     };
   } catch (error) {

web/src/routes/(user)/share/[key]/photos/[assetId]/+page.ts

@@ -1,9 +1,9 @@
-import { api } from '@api';
+import { getAssetInfo } from '@immich/sdk';
 import type { PageLoad } from './$types';
 
 export const load = (async ({ params }) => {
   const { key, assetId } = params;
-  const { data: asset } = await api.assetApi.getAssetInfo({ id: assetId, key });
+  const asset = await getAssetInfo({ id: assetId, key });
 
   return {
     asset,