mirror of
https://github.com/immich-app/immich
synced 2025-11-14 17:36:12 +00:00
fix(web/server) uploaded asset in shared link not loaded (#1766)
* fix(web/server): Uploaded asset to shared link does not get added to the shared link/album * remove unused code * Add endpoints for each remove and add assets to shared link * Update api * Added deletion logic * Convert callback to async/await * Fix linter * Fix test * Fix server test * added test * Test coverage * modify DTO * Add notification * fix test
This commit is contained in:
parent
125ec1e85f
commit
b660240059
25 changed files with 583 additions and 526 deletions
222
web/src/api/open-api/api.ts
generated
222
web/src/api/open-api/api.ts
generated
|
|
@ -4,7 +4,7 @@
|
|||
* Immich
|
||||
* Immich API
|
||||
*
|
||||
* The version of the OpenAPI document: 1.46.1
|
||||
* The version of the OpenAPI document: 1.47.2
|
||||
*
|
||||
*
|
||||
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
|
||||
|
|
@ -2083,19 +2083,6 @@ export interface UpdateAssetDto {
|
|||
*/
|
||||
'isFavorite'?: boolean;
|
||||
}
|
||||
/**
|
||||
*
|
||||
* @export
|
||||
* @interface UpdateAssetsToSharedLinkDto
|
||||
*/
|
||||
export interface UpdateAssetsToSharedLinkDto {
|
||||
/**
|
||||
*
|
||||
* @type {Array<string>}
|
||||
* @memberof UpdateAssetsToSharedLinkDto
|
||||
*/
|
||||
'assetIds': Array<string>;
|
||||
}
|
||||
/**
|
||||
*
|
||||
* @export
|
||||
|
|
@ -3588,6 +3575,45 @@ export class AlbumApi extends BaseAPI {
|
|||
*/
|
||||
export const AssetApiAxiosParamCreator = function (configuration?: Configuration) {
|
||||
return {
|
||||
/**
|
||||
*
|
||||
* @param {AddAssetsDto} addAssetsDto
|
||||
* @param {*} [options] Override http request option.
|
||||
* @throws {RequiredError}
|
||||
*/
|
||||
addAssetsToSharedLink: async (addAssetsDto: AddAssetsDto, options: AxiosRequestConfig = {}): Promise<RequestArgs> => {
|
||||
// verify required parameter 'addAssetsDto' is not null or undefined
|
||||
assertParamExists('addAssetsToSharedLink', 'addAssetsDto', addAssetsDto)
|
||||
const localVarPath = `/asset/shared-link/add`;
|
||||
// use dummy base URL string because the URL constructor only accepts absolute URLs.
|
||||
const localVarUrlObj = new URL(localVarPath, DUMMY_BASE_URL);
|
||||
let baseOptions;
|
||||
if (configuration) {
|
||||
baseOptions = configuration.baseOptions;
|
||||
}
|
||||
|
||||
const localVarRequestOptions = { method: 'PATCH', ...baseOptions, ...options};
|
||||
const localVarHeaderParameter = {} as any;
|
||||
const localVarQueryParameter = {} as any;
|
||||
|
||||
// authentication bearer required
|
||||
// http bearer authentication required
|
||||
await setBearerAuthToObject(localVarHeaderParameter, configuration)
|
||||
|
||||
|
||||
|
||||
localVarHeaderParameter['Content-Type'] = 'application/json';
|
||||
|
||||
setSearchParams(localVarUrlObj, localVarQueryParameter);
|
||||
let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
|
||||
localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};
|
||||
localVarRequestOptions.data = serializeDataIfNeeded(addAssetsDto, localVarRequestOptions, configuration)
|
||||
|
||||
return {
|
||||
url: toPathString(localVarUrlObj),
|
||||
options: localVarRequestOptions,
|
||||
};
|
||||
},
|
||||
/**
|
||||
* Check duplicated asset before uploading - for Web upload used
|
||||
* @param {CheckDuplicateAssetDto} checkDuplicateAssetDto
|
||||
|
|
@ -4232,6 +4258,45 @@ export const AssetApiAxiosParamCreator = function (configuration?: Configuration
|
|||
options: localVarRequestOptions,
|
||||
};
|
||||
},
|
||||
/**
|
||||
*
|
||||
* @param {RemoveAssetsDto} removeAssetsDto
|
||||
* @param {*} [options] Override http request option.
|
||||
* @throws {RequiredError}
|
||||
*/
|
||||
removeAssetsFromSharedLink: async (removeAssetsDto: RemoveAssetsDto, options: AxiosRequestConfig = {}): Promise<RequestArgs> => {
|
||||
// verify required parameter 'removeAssetsDto' is not null or undefined
|
||||
assertParamExists('removeAssetsFromSharedLink', 'removeAssetsDto', removeAssetsDto)
|
||||
const localVarPath = `/asset/shared-link/remove`;
|
||||
// use dummy base URL string because the URL constructor only accepts absolute URLs.
|
||||
const localVarUrlObj = new URL(localVarPath, DUMMY_BASE_URL);
|
||||
let baseOptions;
|
||||
if (configuration) {
|
||||
baseOptions = configuration.baseOptions;
|
||||
}
|
||||
|
||||
const localVarRequestOptions = { method: 'PATCH', ...baseOptions, ...options};
|
||||
const localVarHeaderParameter = {} as any;
|
||||
const localVarQueryParameter = {} as any;
|
||||
|
||||
// authentication bearer required
|
||||
// http bearer authentication required
|
||||
await setBearerAuthToObject(localVarHeaderParameter, configuration)
|
||||
|
||||
|
||||
|
||||
localVarHeaderParameter['Content-Type'] = 'application/json';
|
||||
|
||||
setSearchParams(localVarUrlObj, localVarQueryParameter);
|
||||
let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
|
||||
localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};
|
||||
localVarRequestOptions.data = serializeDataIfNeeded(removeAssetsDto, localVarRequestOptions, configuration)
|
||||
|
||||
return {
|
||||
url: toPathString(localVarUrlObj),
|
||||
options: localVarRequestOptions,
|
||||
};
|
||||
},
|
||||
/**
|
||||
*
|
||||
* @param {SearchAssetDto} searchAssetDto
|
||||
|
|
@ -4361,45 +4426,6 @@ export const AssetApiAxiosParamCreator = function (configuration?: Configuration
|
|||
options: localVarRequestOptions,
|
||||
};
|
||||
},
|
||||
/**
|
||||
*
|
||||
* @param {UpdateAssetsToSharedLinkDto} updateAssetsToSharedLinkDto
|
||||
* @param {*} [options] Override http request option.
|
||||
* @throws {RequiredError}
|
||||
*/
|
||||
updateAssetsInSharedLink: async (updateAssetsToSharedLinkDto: UpdateAssetsToSharedLinkDto, options: AxiosRequestConfig = {}): Promise<RequestArgs> => {
|
||||
// verify required parameter 'updateAssetsToSharedLinkDto' is not null or undefined
|
||||
assertParamExists('updateAssetsInSharedLink', 'updateAssetsToSharedLinkDto', updateAssetsToSharedLinkDto)
|
||||
const localVarPath = `/asset/shared-link`;
|
||||
// use dummy base URL string because the URL constructor only accepts absolute URLs.
|
||||
const localVarUrlObj = new URL(localVarPath, DUMMY_BASE_URL);
|
||||
let baseOptions;
|
||||
if (configuration) {
|
||||
baseOptions = configuration.baseOptions;
|
||||
}
|
||||
|
||||
const localVarRequestOptions = { method: 'PATCH', ...baseOptions, ...options};
|
||||
const localVarHeaderParameter = {} as any;
|
||||
const localVarQueryParameter = {} as any;
|
||||
|
||||
// authentication bearer required
|
||||
// http bearer authentication required
|
||||
await setBearerAuthToObject(localVarHeaderParameter, configuration)
|
||||
|
||||
|
||||
|
||||
localVarHeaderParameter['Content-Type'] = 'application/json';
|
||||
|
||||
setSearchParams(localVarUrlObj, localVarQueryParameter);
|
||||
let headersFromBaseOptions = baseOptions && baseOptions.headers ? baseOptions.headers : {};
|
||||
localVarRequestOptions.headers = {...localVarHeaderParameter, ...headersFromBaseOptions, ...options.headers};
|
||||
localVarRequestOptions.data = serializeDataIfNeeded(updateAssetsToSharedLinkDto, localVarRequestOptions, configuration)
|
||||
|
||||
return {
|
||||
url: toPathString(localVarUrlObj),
|
||||
options: localVarRequestOptions,
|
||||
};
|
||||
},
|
||||
/**
|
||||
*
|
||||
* @param {AssetTypeEnum} assetType
|
||||
|
|
@ -4518,6 +4544,16 @@ export const AssetApiAxiosParamCreator = function (configuration?: Configuration
|
|||
export const AssetApiFp = function(configuration?: Configuration) {
|
||||
const localVarAxiosParamCreator = AssetApiAxiosParamCreator(configuration)
|
||||
return {
|
||||
/**
|
||||
*
|
||||
* @param {AddAssetsDto} addAssetsDto
|
||||
* @param {*} [options] Override http request option.
|
||||
* @throws {RequiredError}
|
||||
*/
|
||||
async addAssetsToSharedLink(addAssetsDto: AddAssetsDto, options?: AxiosRequestConfig): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<SharedLinkResponseDto>> {
|
||||
const localVarAxiosArgs = await localVarAxiosParamCreator.addAssetsToSharedLink(addAssetsDto, options);
|
||||
return createRequestFunction(localVarAxiosArgs, globalAxios, BASE_PATH, configuration);
|
||||
},
|
||||
/**
|
||||
* Check duplicated asset before uploading - for Web upload used
|
||||
* @param {CheckDuplicateAssetDto} checkDuplicateAssetDto
|
||||
|
|
@ -4687,6 +4723,16 @@ export const AssetApiFp = function(configuration?: Configuration) {
|
|||
const localVarAxiosArgs = await localVarAxiosParamCreator.getUserAssetsByDeviceId(deviceId, options);
|
||||
return createRequestFunction(localVarAxiosArgs, globalAxios, BASE_PATH, configuration);
|
||||
},
|
||||
/**
|
||||
*
|
||||
* @param {RemoveAssetsDto} removeAssetsDto
|
||||
* @param {*} [options] Override http request option.
|
||||
* @throws {RequiredError}
|
||||
*/
|
||||
async removeAssetsFromSharedLink(removeAssetsDto: RemoveAssetsDto, options?: AxiosRequestConfig): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<SharedLinkResponseDto>> {
|
||||
const localVarAxiosArgs = await localVarAxiosParamCreator.removeAssetsFromSharedLink(removeAssetsDto, options);
|
||||
return createRequestFunction(localVarAxiosArgs, globalAxios, BASE_PATH, configuration);
|
||||
},
|
||||
/**
|
||||
*
|
||||
* @param {SearchAssetDto} searchAssetDto
|
||||
|
|
@ -4720,16 +4766,6 @@ export const AssetApiFp = function(configuration?: Configuration) {
|
|||
const localVarAxiosArgs = await localVarAxiosParamCreator.updateAsset(assetId, updateAssetDto, options);
|
||||
return createRequestFunction(localVarAxiosArgs, globalAxios, BASE_PATH, configuration);
|
||||
},
|
||||
/**
|
||||
*
|
||||
* @param {UpdateAssetsToSharedLinkDto} updateAssetsToSharedLinkDto
|
||||
* @param {*} [options] Override http request option.
|
||||
* @throws {RequiredError}
|
||||
*/
|
||||
async updateAssetsInSharedLink(updateAssetsToSharedLinkDto: UpdateAssetsToSharedLinkDto, options?: AxiosRequestConfig): Promise<(axios?: AxiosInstance, basePath?: string) => AxiosPromise<SharedLinkResponseDto>> {
|
||||
const localVarAxiosArgs = await localVarAxiosParamCreator.updateAssetsInSharedLink(updateAssetsToSharedLinkDto, options);
|
||||
return createRequestFunction(localVarAxiosArgs, globalAxios, BASE_PATH, configuration);
|
||||
},
|
||||
/**
|
||||
*
|
||||
* @param {AssetTypeEnum} assetType
|
||||
|
|
@ -4760,6 +4796,15 @@ export const AssetApiFp = function(configuration?: Configuration) {
|
|||
export const AssetApiFactory = function (configuration?: Configuration, basePath?: string, axios?: AxiosInstance) {
|
||||
const localVarFp = AssetApiFp(configuration)
|
||||
return {
|
||||
/**
|
||||
*
|
||||
* @param {AddAssetsDto} addAssetsDto
|
||||
* @param {*} [options] Override http request option.
|
||||
* @throws {RequiredError}
|
||||
*/
|
||||
addAssetsToSharedLink(addAssetsDto: AddAssetsDto, options?: any): AxiosPromise<SharedLinkResponseDto> {
|
||||
return localVarFp.addAssetsToSharedLink(addAssetsDto, options).then((request) => request(axios, basePath));
|
||||
},
|
||||
/**
|
||||
* Check duplicated asset before uploading - for Web upload used
|
||||
* @param {CheckDuplicateAssetDto} checkDuplicateAssetDto
|
||||
|
|
@ -4912,6 +4957,15 @@ export const AssetApiFactory = function (configuration?: Configuration, basePath
|
|||
getUserAssetsByDeviceId(deviceId: string, options?: any): AxiosPromise<Array<string>> {
|
||||
return localVarFp.getUserAssetsByDeviceId(deviceId, options).then((request) => request(axios, basePath));
|
||||
},
|
||||
/**
|
||||
*
|
||||
* @param {RemoveAssetsDto} removeAssetsDto
|
||||
* @param {*} [options] Override http request option.
|
||||
* @throws {RequiredError}
|
||||
*/
|
||||
removeAssetsFromSharedLink(removeAssetsDto: RemoveAssetsDto, options?: any): AxiosPromise<SharedLinkResponseDto> {
|
||||
return localVarFp.removeAssetsFromSharedLink(removeAssetsDto, options).then((request) => request(axios, basePath));
|
||||
},
|
||||
/**
|
||||
*
|
||||
* @param {SearchAssetDto} searchAssetDto
|
||||
|
|
@ -4942,15 +4996,6 @@ export const AssetApiFactory = function (configuration?: Configuration, basePath
|
|||
updateAsset(assetId: string, updateAssetDto: UpdateAssetDto, options?: any): AxiosPromise<AssetResponseDto> {
|
||||
return localVarFp.updateAsset(assetId, updateAssetDto, options).then((request) => request(axios, basePath));
|
||||
},
|
||||
/**
|
||||
*
|
||||
* @param {UpdateAssetsToSharedLinkDto} updateAssetsToSharedLinkDto
|
||||
* @param {*} [options] Override http request option.
|
||||
* @throws {RequiredError}
|
||||
*/
|
||||
updateAssetsInSharedLink(updateAssetsToSharedLinkDto: UpdateAssetsToSharedLinkDto, options?: any): AxiosPromise<SharedLinkResponseDto> {
|
||||
return localVarFp.updateAssetsInSharedLink(updateAssetsToSharedLinkDto, options).then((request) => request(axios, basePath));
|
||||
},
|
||||
/**
|
||||
*
|
||||
* @param {AssetTypeEnum} assetType
|
||||
|
|
@ -4980,6 +5025,17 @@ export const AssetApiFactory = function (configuration?: Configuration, basePath
|
|||
* @extends {BaseAPI}
|
||||
*/
|
||||
export class AssetApi extends BaseAPI {
|
||||
/**
|
||||
*
|
||||
* @param {AddAssetsDto} addAssetsDto
|
||||
* @param {*} [options] Override http request option.
|
||||
* @throws {RequiredError}
|
||||
* @memberof AssetApi
|
||||
*/
|
||||
public addAssetsToSharedLink(addAssetsDto: AddAssetsDto, options?: AxiosRequestConfig) {
|
||||
return AssetApiFp(this.configuration).addAssetsToSharedLink(addAssetsDto, options).then((request) => request(this.axios, this.basePath));
|
||||
}
|
||||
|
||||
/**
|
||||
* Check duplicated asset before uploading - for Web upload used
|
||||
* @param {CheckDuplicateAssetDto} checkDuplicateAssetDto
|
||||
|
|
@ -5166,6 +5222,17 @@ export class AssetApi extends BaseAPI {
|
|||
return AssetApiFp(this.configuration).getUserAssetsByDeviceId(deviceId, options).then((request) => request(this.axios, this.basePath));
|
||||
}
|
||||
|
||||
/**
|
||||
*
|
||||
* @param {RemoveAssetsDto} removeAssetsDto
|
||||
* @param {*} [options] Override http request option.
|
||||
* @throws {RequiredError}
|
||||
* @memberof AssetApi
|
||||
*/
|
||||
public removeAssetsFromSharedLink(removeAssetsDto: RemoveAssetsDto, options?: AxiosRequestConfig) {
|
||||
return AssetApiFp(this.configuration).removeAssetsFromSharedLink(removeAssetsDto, options).then((request) => request(this.axios, this.basePath));
|
||||
}
|
||||
|
||||
/**
|
||||
*
|
||||
* @param {SearchAssetDto} searchAssetDto
|
||||
|
|
@ -5202,17 +5269,6 @@ export class AssetApi extends BaseAPI {
|
|||
return AssetApiFp(this.configuration).updateAsset(assetId, updateAssetDto, options).then((request) => request(this.axios, this.basePath));
|
||||
}
|
||||
|
||||
/**
|
||||
*
|
||||
* @param {UpdateAssetsToSharedLinkDto} updateAssetsToSharedLinkDto
|
||||
* @param {*} [options] Override http request option.
|
||||
* @throws {RequiredError}
|
||||
* @memberof AssetApi
|
||||
*/
|
||||
public updateAssetsInSharedLink(updateAssetsToSharedLinkDto: UpdateAssetsToSharedLinkDto, options?: AxiosRequestConfig) {
|
||||
return AssetApiFp(this.configuration).updateAssetsInSharedLink(updateAssetsToSharedLinkDto, options).then((request) => request(this.axios, this.basePath));
|
||||
}
|
||||
|
||||
/**
|
||||
*
|
||||
* @param {AssetTypeEnum} assetType
|
||||
|
|
|
|||
2
web/src/api/open-api/base.ts
generated
2
web/src/api/open-api/base.ts
generated
|
|
@ -4,7 +4,7 @@
|
|||
* Immich
|
||||
* Immich API
|
||||
*
|
||||
* The version of the OpenAPI document: 1.46.1
|
||||
* The version of the OpenAPI document: 1.47.2
|
||||
*
|
||||
*
|
||||
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
|
||||
|
|
|
|||
2
web/src/api/open-api/common.ts
generated
2
web/src/api/open-api/common.ts
generated
|
|
@ -4,7 +4,7 @@
|
|||
* Immich
|
||||
* Immich API
|
||||
*
|
||||
* The version of the OpenAPI document: 1.46.1
|
||||
* The version of the OpenAPI document: 1.47.2
|
||||
*
|
||||
*
|
||||
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
|
||||
|
|
|
|||
2
web/src/api/open-api/configuration.ts
generated
2
web/src/api/open-api/configuration.ts
generated
|
|
@ -4,7 +4,7 @@
|
|||
* Immich
|
||||
* Immich API
|
||||
*
|
||||
* The version of the OpenAPI document: 1.46.1
|
||||
* The version of the OpenAPI document: 1.47.2
|
||||
*
|
||||
*
|
||||
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
|
||||
|
|
|
|||
2
web/src/api/open-api/index.ts
generated
2
web/src/api/open-api/index.ts
generated
|
|
@ -4,7 +4,7 @@
|
|||
* Immich
|
||||
* Immich API
|
||||
*
|
||||
* The version of the OpenAPI document: 1.46.1
|
||||
* The version of the OpenAPI document: 1.47.2
|
||||
*
|
||||
*
|
||||
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
|
||||
|
|
|
|||
|
|
@ -16,6 +16,7 @@
|
|||
|
||||
export let albumId: string;
|
||||
export let assetsInAlbum: AssetResponseDto[];
|
||||
const locale = navigator.language;
|
||||
|
||||
onMount(() => {
|
||||
$assetsInAlbumStoreState = assetsInAlbum;
|
||||
|
|
@ -28,8 +29,11 @@
|
|||
|
||||
assetInteractionStore.clearMultiselect();
|
||||
};
|
||||
|
||||
const locale = navigator.language;
|
||||
const handleSelectFromComputerClicked = async () => {
|
||||
await openFileUploadDialog(albumId, '');
|
||||
assetInteractionStore.clearMultiselect();
|
||||
dispatch('go-back');
|
||||
};
|
||||
</script>
|
||||
|
||||
<section
|
||||
|
|
@ -54,11 +58,7 @@
|
|||
|
||||
<svelte:fragment slot="trailing">
|
||||
<button
|
||||
on:click={() =>
|
||||
openFileUploadDialog(albumId, '', () => {
|
||||
assetInteractionStore.clearMultiselect();
|
||||
dispatch('go-back');
|
||||
})}
|
||||
on:click={handleSelectFromComputerClicked}
|
||||
class="text-immich-primary dark:text-immich-dark-primary text-sm hover:bg-immich-primary/10 dark:hover:bg-immich-dark-primary/25 transition-all px-6 py-2 rounded-lg font-medium"
|
||||
>
|
||||
Select from computer
|
||||
|
|
|
|||
|
|
@ -13,11 +13,11 @@
|
|||
import CloudDownloadOutline from 'svelte-material-icons/CloudDownloadOutline.svelte';
|
||||
import GalleryViewer from '../shared-components/gallery-viewer/gallery-viewer.svelte';
|
||||
import DeleteOutline from 'svelte-material-icons/DeleteOutline.svelte';
|
||||
import ImmichLogo from '../shared-components/immich-logo.svelte';
|
||||
import {
|
||||
notificationController,
|
||||
NotificationType
|
||||
} from '../shared-components/notification/notification';
|
||||
import ImmichLogo from '../shared-components/immich-logo.svelte';
|
||||
|
||||
export let sharedLink: SharedLinkResponseDto;
|
||||
export let isOwned: boolean;
|
||||
|
|
@ -43,11 +43,15 @@
|
|||
);
|
||||
};
|
||||
|
||||
const handleUploadAssets = () => {
|
||||
openFileUploadDialog(undefined, sharedLink?.key, async (assetId) => {
|
||||
await api.assetApi.updateAssetsInSharedLink(
|
||||
const handleUploadAssets = async () => {
|
||||
try {
|
||||
const results = await openFileUploadDialog(undefined, sharedLink?.key);
|
||||
|
||||
const assetIds = results.filter((id) => !!id) as string[];
|
||||
|
||||
await api.assetApi.addAssetsToSharedLink(
|
||||
{
|
||||
assetIds: [...assets.map((a) => a.id), assetId]
|
||||
assetIds
|
||||
},
|
||||
{
|
||||
params: {
|
||||
|
|
@ -57,15 +61,17 @@
|
|||
);
|
||||
|
||||
notificationController.show({
|
||||
message: 'Add asset to shared link successfully',
|
||||
message: `Successfully add ${assetIds.length} to the shared link`,
|
||||
type: NotificationType.Info
|
||||
});
|
||||
});
|
||||
} catch (e) {
|
||||
console.error('handleUploadAssets', e);
|
||||
}
|
||||
};
|
||||
|
||||
const handleRemoveAssetsFromSharedLink = async () => {
|
||||
if (window.confirm('Do you want to remove selected assets from the shared link?')) {
|
||||
await api.assetApi.updateAssetsInSharedLink(
|
||||
await api.assetApi.removeAssetsFromSharedLink(
|
||||
{
|
||||
assetIds: assets.filter((a) => !selectedAssets.has(a)).map((a) => a.id)
|
||||
},
|
||||
|
|
|
|||
|
|
@ -6,71 +6,65 @@ import { uploadAssetsStore } from '$lib/stores/upload';
|
|||
import type { UploadAsset } from '../models/upload-asset';
|
||||
import { api, AssetFileUploadResponseDto } from '@api';
|
||||
import { addAssetsToAlbum, getFileMimeType, getFilenameExtension } from '$lib/utils/asset-utils';
|
||||
import { Subject, mergeMap } from 'rxjs';
|
||||
import { mergeMap, filter, firstValueFrom, from, of, combineLatestAll } from 'rxjs';
|
||||
import axios from 'axios';
|
||||
|
||||
export const openFileUploadDialog = (
|
||||
export const openFileUploadDialog = async (
|
||||
albumId: string | undefined = undefined,
|
||||
sharedKey: string | undefined = undefined,
|
||||
onDone?: (id: string) => void
|
||||
sharedKey: string | undefined = undefined
|
||||
) => {
|
||||
try {
|
||||
const fileSelector = document.createElement('input');
|
||||
return new Promise<(string | undefined)[]>((resolve, reject) => {
|
||||
try {
|
||||
const fileSelector = document.createElement('input');
|
||||
|
||||
fileSelector.type = 'file';
|
||||
fileSelector.multiple = true;
|
||||
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/*,.heic,.heif,.dng,.3gp,.nef,.srw,.raf';
|
||||
// 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/*,.heic,.heif,.dng,.3gp,.nef,.srw,.raf';
|
||||
|
||||
fileSelector.onchange = async (e: Event) => {
|
||||
const target = e.target as HTMLInputElement;
|
||||
if (!target.files) {
|
||||
return;
|
||||
}
|
||||
const files = Array.from<File>(target.files);
|
||||
fileSelector.onchange = async (e: Event) => {
|
||||
const target = e.target as HTMLInputElement;
|
||||
if (!target.files) {
|
||||
return;
|
||||
}
|
||||
const files = Array.from<File>(target.files);
|
||||
|
||||
await fileUploadHandler(files, albumId, sharedKey, onDone);
|
||||
};
|
||||
resolve(await fileUploadHandler(files, albumId, sharedKey));
|
||||
};
|
||||
|
||||
fileSelector.click();
|
||||
} catch (e) {
|
||||
console.log('Error selecting file', e);
|
||||
}
|
||||
fileSelector.click();
|
||||
} catch (e) {
|
||||
console.log('Error selecting file', e);
|
||||
reject(e);
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
export const fileUploadHandler = async (
|
||||
files: File[],
|
||||
albumId: string | undefined = undefined,
|
||||
sharedKey: string | undefined = undefined,
|
||||
onDone?: (id: string) => void
|
||||
sharedKey: string | undefined = undefined
|
||||
) => {
|
||||
const files$ = new Subject<File>();
|
||||
files$
|
||||
.pipe(
|
||||
mergeMap(async (file) => {
|
||||
await fileUploader(file, albumId, sharedKey, onDone);
|
||||
}, 2)
|
||||
return firstValueFrom(
|
||||
from(files).pipe(
|
||||
filter((file) => {
|
||||
const assetType = getFileMimeType(file).split('/')[0];
|
||||
return assetType === 'video' || assetType === 'image';
|
||||
}),
|
||||
mergeMap(async (file) => of(await fileUploader(file, albumId, sharedKey)), 2),
|
||||
combineLatestAll()
|
||||
)
|
||||
.subscribe();
|
||||
|
||||
const acceptedFile = files.filter((file) => {
|
||||
const assetType = getFileMimeType(file).split('/')[0];
|
||||
return assetType === 'video' || assetType === 'image';
|
||||
});
|
||||
for (const file of acceptedFile) {
|
||||
files$.next(file);
|
||||
}
|
||||
);
|
||||
};
|
||||
|
||||
//TODO: should probably use the @api SDK
|
||||
async function fileUploader(
|
||||
asset: File,
|
||||
albumId: string | undefined = undefined,
|
||||
sharedKey: string | undefined = undefined,
|
||||
onDone?: (id: string) => void
|
||||
) {
|
||||
console.log('uploading', asset.name);
|
||||
sharedKey: string | undefined = undefined
|
||||
): Promise<string | undefined> {
|
||||
const mimeType = getFileMimeType(asset);
|
||||
const assetType = mimeType.split('/')[0].toUpperCase();
|
||||
const fileExtension = getFilenameExtension(asset.name);
|
||||
|
|
@ -121,67 +115,50 @@ async function fileUploader(
|
|||
}
|
||||
);
|
||||
|
||||
if (status === 200) {
|
||||
if (data.isExist) {
|
||||
const dataId = data.id;
|
||||
if (albumId && dataId) {
|
||||
addAssetsToAlbum(albumId, [dataId], sharedKey);
|
||||
}
|
||||
onDone && dataId && onDone(dataId);
|
||||
return;
|
||||
if (status === 200 && data.isExist && data.id) {
|
||||
if (albumId) {
|
||||
await addAssetsToAlbum(albumId, [data.id], sharedKey);
|
||||
}
|
||||
|
||||
return data.id;
|
||||
}
|
||||
|
||||
const request = new XMLHttpRequest();
|
||||
request.upload.onloadstart = () => {
|
||||
const newUploadAsset: UploadAsset = {
|
||||
id: deviceAssetId,
|
||||
file: asset,
|
||||
progress: 0,
|
||||
fileExtension: fileExtension
|
||||
};
|
||||
|
||||
uploadAssetsStore.addNewUploadAsset(newUploadAsset);
|
||||
const newUploadAsset: UploadAsset = {
|
||||
id: deviceAssetId,
|
||||
file: asset,
|
||||
progress: 0,
|
||||
fileExtension: fileExtension
|
||||
};
|
||||
|
||||
request.upload.onload = () => {
|
||||
uploadAssetsStore.removeUploadAsset(deviceAssetId);
|
||||
const res: AssetFileUploadResponseDto = JSON.parse(request.response || '{}');
|
||||
if (albumId) {
|
||||
try {
|
||||
if (res.id) {
|
||||
addAssetsToAlbum(albumId, [res.id], sharedKey);
|
||||
}
|
||||
} catch (e) {
|
||||
console.error('ERROR parsing data JSON in upload onload');
|
||||
}
|
||||
uploadAssetsStore.addNewUploadAsset(newUploadAsset);
|
||||
|
||||
const response = await axios.post(`/api/asset/upload`, formData, {
|
||||
params: {
|
||||
key: sharedKey
|
||||
},
|
||||
onUploadProgress: (event) => {
|
||||
const percentComplete = Math.floor((event.loaded / event.total) * 100);
|
||||
uploadAssetsStore.updateProgress(deviceAssetId, percentComplete);
|
||||
}
|
||||
onDone && onDone(res.id);
|
||||
};
|
||||
});
|
||||
|
||||
// listen for `error` event
|
||||
request.upload.onerror = () => {
|
||||
uploadAssetsStore.removeUploadAsset(deviceAssetId);
|
||||
handleUploadError(asset, request.response);
|
||||
};
|
||||
if (response.status == 200 || response.status == 201) {
|
||||
const res: AssetFileUploadResponseDto = response.data;
|
||||
|
||||
// listen for `abort` event
|
||||
request.upload.onabort = () => {
|
||||
uploadAssetsStore.removeUploadAsset(deviceAssetId);
|
||||
handleUploadError(asset, request.response);
|
||||
};
|
||||
if (albumId && res.id) {
|
||||
await addAssetsToAlbum(albumId, [res.id], sharedKey);
|
||||
}
|
||||
|
||||
// listen for `progress` event
|
||||
request.upload.onprogress = (event) => {
|
||||
const percentComplete = Math.floor((event.loaded / event.total) * 100);
|
||||
uploadAssetsStore.updateProgress(deviceAssetId, percentComplete);
|
||||
};
|
||||
setTimeout(() => {
|
||||
uploadAssetsStore.removeUploadAsset(deviceAssetId);
|
||||
}, 1000);
|
||||
|
||||
request.open('POST', `/api/asset/upload?key=${sharedKey ?? ''}`);
|
||||
|
||||
request.send(formData);
|
||||
return res.id;
|
||||
}
|
||||
} catch (e) {
|
||||
console.log('error uploading file ', e);
|
||||
handleUploadError(asset, JSON.stringify(e));
|
||||
uploadAssetsStore.removeUploadAsset(deviceAssetId);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue