refactor(server): calculate asset type server side (#3200)

* refactor(server): calculate asset type server-side

* chore: open api

* chore: remove comments

* fix: linting

* update

* Revert "update"

This reverts commit dc58702923.

* fix: upload LivePhotos

* chore: remove unused request fields for upload

* remove unused method

* mobile-fix: livePhoto filename

* fix: revert check for livephotos filename and extension

---------

Co-authored-by: Alex Tran <alex.tran1502@gmail.com>

web/src/lib/utils/file-uploader.ts

@@ -1,11 +1,59 @@
 import { uploadAssetsStore } from '$lib/stores/upload';
-import { addAssetsToAlbum, getFileMimeType, getFilenameExtension } from '$lib/utils/asset-utils';
+import { addAssetsToAlbum, getFilenameExtension } from '$lib/utils/asset-utils';
 import type { AssetFileUploadResponseDto } from '@api';
 import axios from 'axios';
 import { combineLatestAll, filter, firstValueFrom, from, mergeMap, of } from 'rxjs';
-import type { UploadAsset } from '../models/upload-asset';
 import { notificationController, NotificationType } from './../components/shared-components/notification/notification';
 
+const extensions = [
+  '.3fr',
+  '.3gp',
+  '.ari',
+  '.arw',
+  '.avi',
+  '.avif',
+  '.cap',
+  '.cin',
+  '.cr2',
+  '.cr3',
+  '.crw',
+  '.dcr',
+  '.dng',
+  '.erf',
+  '.fff',
+  '.flv',
+  '.gif',
+  '.heic',
+  '.heif',
+  '.iiq',
+  '.jpeg',
+  '.jpg',
+  '.k25',
+  '.kdc',
+  '.mkv',
+  '.mov',
+  '.mp2t',
+  '.mp4',
+  '.mpeg',
+  '.mrw',
+  '.nef',
+  '.orf',
+  '.ori',
+  '.pef',
+  '.png',
+  '.raf',
+  '.raw',
+  '.rwl',
+  '.sr2',
+  '.srf',
+  '.srw',
+  '.tiff',
+  '.webm',
+  '.webp',
+  '.wmv',
+  '.x3f',
+];
+
 export const openFileUploadDialog = async (
   albumId: string | undefined = undefined,
   sharedKey: string | undefined = undefined,
@@ -16,52 +64,7 @@ export const openFileUploadDialog = async (
 
       fileSelector.type = 'file';
       fileSelector.multiple = true;
-
-      // When adding a content type that is unsupported by browsers, make sure
-      // to also add it to getFileMimeType() otherwise the upload will fail.
-      fileSelector.accept = [
-        'image/*',
-        'video/*',
-        '.3fr',
-        '.3gp',
-        '.ari',
-        '.arw',
-        '.avif',
-        '.cap',
-        '.cin',
-        '.cr2',
-        '.cr3',
-        '.crw',
-        '.dcr',
-        '.dng',
-        '.erf',
-        '.fff',
-        '.heic',
-        '.heif',
-        '.iiq',
-        '.insp',
-        '.insv',
-        '.jxl',
-        '.k25',
-        '.kdc',
-        '.m2ts',
-        '.mov',
-        '.mrw',
-        '.mts',
-        '.nef',
-        '.orf',
-        '.ori',
-        '.pef',
-        '.raf',
-        '.raf',
-        '.raw',
-        '.rwl',
-        '.sr2',
-        '.srf',
-        '.srw',
-        '.x3f',
-      ].join(',');
-
+      fileSelector.accept = extensions.join(',');
       fileSelector.onchange = async (e: Event) => {
         const target = e.target as HTMLInputElement;
         if (!target.files) {
@@ -87,10 +90,7 @@ export const fileUploadHandler = async (
 ) => {
   return firstValueFrom(
     from(files).pipe(
-      filter((file) => {
-        const assetType = getFileMimeType(file).split('/')[0];
-        return assetType === 'video' || assetType === 'image';
-      }),
+      filter((file) => extensions.includes('.' + getFilenameExtension(file.name))),
       mergeMap(async (file) => of(await fileUploader(file, albumId, sharedKey)), 2),
       combineLatestAll(),
     ),
@@ -103,51 +103,24 @@ async function fileUploader(
   albumId: string | undefined = undefined,
   sharedKey: string | undefined = undefined,
 ): Promise<string | undefined> {
-  const mimeType = getFileMimeType(asset);
-  const assetType = mimeType.split('/')[0].toUpperCase();
-  const fileExtension = getFilenameExtension(asset.name);
   const formData = new FormData();
   const fileCreatedAt = new Date(asset.lastModified).toISOString();
   const deviceAssetId = 'web' + '-' + asset.name + '-' + asset.lastModified;
 
   try {
-    // Create and add pseudo-unique ID of asset on the device
     formData.append('deviceAssetId', deviceAssetId);
-
-    // Get device id - for web -> use WEB
     formData.append('deviceId', 'WEB');
-
-    // Get asset type
-    formData.append('assetType', assetType);
-
-    // Get Asset Created Date
     formData.append('fileCreatedAt', fileCreatedAt);
-
-    // Get Asset Modified At
     formData.append('fileModifiedAt', new Date(asset.lastModified).toISOString());
-
-    // Set Asset is Favorite to false
     formData.append('isFavorite', 'false');
-
-    // Get asset duration
     formData.append('duration', '0:00:00.000000');
+    formData.append('assetData', new File([asset], asset.name));
 
-    // Get asset file extension
-    formData.append('fileExtension', '.' + fileExtension);
-
-    // Get asset binary data with a custom MIME type, because browsers will
-    // use application/octet-stream for unsupported MIME types, leading to
-    // failed uploads.
-    formData.append('assetData', new File([asset], asset.name, { type: mimeType }));
-
-    const newUploadAsset: UploadAsset = {
+    uploadAssetsStore.addNewUploadAsset({
       id: deviceAssetId,
       file: asset,
       progress: 0,
-      fileExtension: fileExtension,
-    };
-
-    uploadAssetsStore.addNewUploadAsset(newUploadAsset);
+    });
 
     const response = await axios.post(`/api/asset/upload`, formData, {
       params: {