refactor(web): combine api and serverApi (#1833)

web/src/api/api.ts

@@ -1,3 +1,4 @@
+import { browser } from '$app/environment';
 import { env } from '$env/dynamic/public';
 import {
 	AlbumApi,
@@ -56,10 +57,11 @@ class ImmichApi {
 	}
 }
 
-// Browser side (public) API client
-export const api = new ImmichApi();
+const api = new ImmichApi();
 
-// Server side API client
-export const serverApi = new ImmichApi();
-const immich_server_url = env.PUBLIC_IMMICH_SERVER_URL || 'http://immich-server:3001';
-serverApi.setBaseUrl(immich_server_url);
+if (!browser) {
+	const serverUrl = env.PUBLIC_IMMICH_SERVER_URL || 'http://immich-server:3001';
+	api.setBaseUrl(serverUrl);
+}
+
+export { api };

web/src/routes/+layout.server.ts

@@ -1,4 +1,4 @@
-import { serverApi } from '@api';
+import { api } from '@api';
 import type { LayoutServerLoad } from './$types';
 
 export const load = (async ({ cookies }) => {
@@ -8,8 +8,8 @@ export const load = (async ({ cookies }) => {
 			return { user: undefined };
 		}
 
-		serverApi.setAccessToken(accessToken);
-		const { data: user } = await serverApi.userApi.getMyUserInfo();
+		api.setAccessToken(accessToken);
+		const { data: user } = await api.userApi.getMyUserInfo();
 
 		return { user };
 	} catch (e) {

web/src/routes/+page.server.ts

@@ -1,5 +1,5 @@
 export const prerender = false;
-import { serverApi } from '@api';
+import { api } from '@api';
 import { redirect } from '@sveltejs/kit';
 import type { PageServerLoad } from './$types';
 
@@ -9,7 +9,7 @@ export const load: PageServerLoad = async ({ parent }) => {
 		throw redirect(302, '/photos');
 	}
 
-	const { data } = await serverApi.userApi.getUserCount(true);
+	const { data } = await api.userApi.getUserCount(true);
 
 	if (data.userCount > 0) {
 		// Redirect to login page if an admin is already registered.

web/src/routes/admin/server-status/+page.server.ts

@@ -1,5 +1,5 @@
 import { redirect } from '@sveltejs/kit';
-import { serverApi } from '@api';
+import { api } from '@api';
 import type { PageServerLoad } from './$types';
 
 export const load: PageServerLoad = async ({ parent }) => {
@@ -11,7 +11,7 @@ export const load: PageServerLoad = async ({ parent }) => {
 		throw redirect(302, '/photos');
 	}
 
-	const { data: allUsers } = await serverApi.userApi.getAllUsers(false);
+	const { data: allUsers } = await api.userApi.getAllUsers(false);
 
 	return {
 		allUsers,

web/src/routes/admin/user-management/+page.server.ts

@@ -1,5 +1,5 @@
 import { redirect } from '@sveltejs/kit';
-import { serverApi } from '@api';
+import { api } from '@api';
 import type { PageServerLoad } from './$types';
 
 export const load: PageServerLoad = async ({ parent }) => {
@@ -11,7 +11,7 @@ export const load: PageServerLoad = async ({ parent }) => {
 		throw redirect(302, '/photos');
 	}
 
-	const { data: allUsers } = await serverApi.userApi.getAllUsers(false);
+	const { data: allUsers } = await api.userApi.getAllUsers(false);
 
 	return {
 		user,

web/src/routes/albums/+page.server.ts

@@ -1,6 +1,6 @@
 import { redirect } from '@sveltejs/kit';
 import type { PageServerLoad } from './$types';
-import { serverApi } from '@api';
+import { api } from '@api';
 
 export const load: PageServerLoad = async ({ parent }) => {
 	try {
@@ -10,7 +10,7 @@ export const load: PageServerLoad = async ({ parent }) => {
 			throw Error('User is not logged in');
 		}
 
-		const { data: albums } = await serverApi.albumApi.getAllAlbums();
+		const { data: albums } = await api.albumApi.getAllAlbums();
 
 		return {
 			user: user,

web/src/routes/albums/[albumId]/+page.server.ts

@@ -1,7 +1,7 @@
 import { redirect } from '@sveltejs/kit';
 
 import type { PageServerLoad } from './$types';
-import { serverApi } from '@api';
+import { api } from '@api';
 
 export const load: PageServerLoad = async ({ parent, params }) => {
 	const { user } = await parent();
@@ -13,7 +13,7 @@ export const load: PageServerLoad = async ({ parent, params }) => {
 	const albumId = params['albumId'];
 
 	try {
-		const { data: album } = await serverApi.albumApi.getAlbumInfo(albumId);
+		const { data: album } = await api.albumApi.getAlbumInfo(albumId);
 		return {
 			album,
 			meta: {

web/src/routes/auth/login/+page.server.ts

@@ -1,9 +1,9 @@
 import { redirect } from '@sveltejs/kit';
 import type { PageServerLoad } from './$types';
-import { serverApi } from '@api';
+import { api } from '@api';
 
 export const load: PageServerLoad = async () => {
-	const { data } = await serverApi.userApi.getUserCount(true);
+	const { data } = await api.userApi.getUserCount(true);
 	if (data.userCount === 0) {
 		// Admin not registered
 		throw redirect(302, '/auth/register');

web/src/routes/auth/logout/+server.ts

@@ -1,10 +1,9 @@
 import { json } from '@sveltejs/kit';
-import { api, serverApi } from '@api';
+import { api } from '@api';
 import type { RequestHandler } from '@sveltejs/kit';
 
 export const POST = (async ({ cookies }) => {
 	api.removeAccessToken();
-	serverApi.removeAccessToken();
 
 	cookies.delete('immich_auth_type', { path: '/' });
 	cookies.delete('immich_access_token', { path: '/' });

web/src/routes/auth/register/+page.server.ts

@@ -1,9 +1,9 @@
 import { redirect } from '@sveltejs/kit';
 import type { PageServerLoad } from './$types';
-import { serverApi } from '@api';
+import { api } from '@api';
 
 export const load: PageServerLoad = async () => {
-	const { data } = await serverApi.userApi.getUserCount(true);
+	const { data } = await api.userApi.getUserCount(true);
 	if (data.userCount != 0) {
 		// Admin has been registered, redirect to login
 		throw redirect(302, '/auth/login');

web/src/routes/share/[key]/+page.server.ts

@@ -2,7 +2,7 @@ export const prerender = false;
 import { error } from '@sveltejs/kit';
 
 import { getThumbnailUrl } from '$lib/utils/asset-utils';
-import { serverApi, ThumbnailFormat } from '@api';
+import { api, ThumbnailFormat } from '@api';
 import type { PageServerLoad } from './$types';
 import featurePanelUrl from '$lib/assets/feature-panel.png';
 
@@ -12,7 +12,7 @@ export const load: PageServerLoad = async ({ params, parent }) => {
 	const { key } = params;
 
 	try {
-		const { data: sharedLink } = await serverApi.shareApi.getMySharedLink({ params: { key } });
+		const { data: sharedLink } = await api.shareApi.getMySharedLink({ params: { key } });
 
 		const assetCount = sharedLink.assets.length;
 		const assetId = sharedLink.album?.albumThumbnailAssetId || sharedLink.assets[0]?.id;

web/src/routes/share/[key]/photos/[assetId]/+page.server.ts

@@ -1,13 +1,13 @@
 export const prerender = false;
 import { error } from '@sveltejs/kit';
 
-import { serverApi } from '@api';
+import { api } from '@api';
 import type { PageServerLoad } from './$types';
 
 export const load: PageServerLoad = async ({ params }) => {
 	try {
 		const { key, assetId } = params;
-		const { data: asset } = await serverApi.assetApi.getAssetById(assetId, {
+		const { data: asset } = await api.assetApi.getAssetById(assetId, {
 			params: { key }
 		});
 

web/src/routes/sharing/+page.server.ts

@@ -1,7 +1,7 @@
 import { redirect } from '@sveltejs/kit';
 export const prerender = false;
 
-import { serverApi } from '@api';
+import { api } from '@api';
 import type { PageServerLoad } from './$types';
 
 export const load: PageServerLoad = async ({ parent }) => {
@@ -11,7 +11,7 @@ export const load: PageServerLoad = async ({ parent }) => {
 			throw redirect(302, '/auth/login');
 		}
 
-		const { data: sharedAlbums } = await serverApi.albumApi.getAllAlbums(true);
+		const { data: sharedAlbums } = await api.albumApi.getAllAlbums(true);
 
 		return {
 			user: user,