refactor(web) open api client (#7103)

* refactor: person api

* refactor: shared link and others

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

@@ -3,7 +3,8 @@
   import Thumbnail from '$lib/components/assets/thumbnail/thumbnail.svelte';
   import UserPageLayout from '$lib/components/layouts/user-page-layout.svelte';
   import { AppRoute } from '$lib/constants';
-  import { type SearchExploreResponseDto, api } from '@api';
+  import { getPeopleThumbnailUrl } from '$lib/utils';
+  import type { SearchExploreResponseDto } from '@immich/sdk';
   import type { PageData } from './$types';
 
   export let data: PageData;
@@ -58,7 +59,7 @@
               <ImageThumbnail
                 circle
                 shadow
-                url={api.getPeopleThumbnailUrl(person.id)}
+                url={getPeopleThumbnailUrl(person.id)}
                 altText={person.name}
                 widthStyle="100%"
               />

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

@@ -1,11 +1,11 @@
 import { authenticate } from '$lib/utils/auth';
-import { api } from '@api';
+import { getAllPeople, getExploreData } from '@immich/sdk';
 import type { PageLoad } from './$types';
 
 export const load = (async () => {
   await authenticate();
-  const { data: items } = await api.searchApi.getExploreData();
-  const { data: response } = await api.personApi.getAllPeople({ withHidden: false });
+  const [items, response] = await Promise.all([getExploreData(), getAllPeople({ withHidden: false })]);
+
   return {
     items,
     response,