diff --git a/apps/builder/app/builder/shared/assets/asset-upload.tsx b/apps/builder/app/builder/shared/assets/asset-upload.tsx index 8a8fc53846c0..1c8712bb6789 100644 --- a/apps/builder/app/builder/shared/assets/asset-upload.tsx +++ b/apps/builder/app/builder/shared/assets/asset-upload.tsx @@ -14,17 +14,13 @@ import { imageMimeTypes } from "./asset-utils"; const maxSize = toBytes(MAX_UPLOAD_SIZE); -const getFilesFromInput = (_type: AssetType, input: HTMLInputElement) => { - const files = Array.from(input?.files ?? []); - +export const validateFiles = (files: File[]) => { const exceedSizeFiles = files.filter((file) => file.size > maxSize); - for (const file of exceedSizeFiles) { toast.error( `Asset "${file.name}" cannot be bigger than ${MAX_UPLOAD_SIZE}MB` ); } - return files.filter((file) => file.size <= maxSize); }; @@ -37,7 +33,7 @@ const useUpload = (type: AssetType) => { if (input === null) { return; } - const files = getFilesFromInput(type, input); + const files = validateFiles(Array.from(input?.files ?? [])); uploadAssets(type, files); form.reset(); }; diff --git a/apps/builder/app/builder/shared/assets/assets-shell.tsx b/apps/builder/app/builder/shared/assets/assets-shell.tsx index d54cb25f0899..5bc05951136f 100644 --- a/apps/builder/app/builder/shared/assets/assets-shell.tsx +++ b/apps/builder/app/builder/shared/assets/assets-shell.tsx @@ -13,7 +13,7 @@ import { Text, theme, } from "@webstudio-is/design-system"; -import { AssetUpload, acceptUploadType } from "./asset-upload"; +import { AssetUpload, acceptUploadType, validateFiles } from "./asset-upload"; import { NotFound } from "./not-found"; import { Separator } from "./separator"; import { combine } from "@atlaskit/pragmatic-drag-and-drop/combine"; @@ -129,7 +129,7 @@ export const AssetsShell = ({ ) ); - const droppedFiles = await getFiles({ source }); + const droppedFiles = validateFiles(getFiles({ source })); const files = droppedFiles .filter((file) => file != null) diff --git a/apps/builder/package.json b/apps/builder/package.json index c6db3c681fb2..dc5d8ad09b01 100644 --- a/apps/builder/package.json +++ b/apps/builder/package.json @@ -18,8 +18,8 @@ "test": "vitest run" }, "dependencies": { - "@atlaskit/pragmatic-drag-and-drop": "^1.5.2", - "@bomb.sh/args": "^0.3.0", + "@atlaskit/pragmatic-drag-and-drop": "^1.7.4", + "@bomb.sh/args": "^0.3.1", "@codemirror/autocomplete": "^6.18.6", "@codemirror/commands": "^6.8.0", "@codemirror/lang-css": "^6.3.1", diff --git a/packages/design-system/package.json b/packages/design-system/package.json index 6f2f1412b3f5..fce70513308f 100644 --- a/packages/design-system/package.json +++ b/packages/design-system/package.json @@ -25,7 +25,7 @@ "react-dom": "18.3.0-canary-14898b6a9-20240318" }, "dependencies": { - "@atlaskit/pragmatic-drag-and-drop": "^1.5.2", + "@atlaskit/pragmatic-drag-and-drop": "^1.7.4", "@atlaskit/pragmatic-drag-and-drop-auto-scroll": "^2.1.0", "@atlaskit/pragmatic-drag-and-drop-hitbox": "^1.0.3", "@floating-ui/dom": "^1.6.13", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index bb49ce7ac0a0..19da03f5b252 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -116,11 +116,11 @@ importers: apps/builder: dependencies: '@atlaskit/pragmatic-drag-and-drop': - specifier: ^1.5.2 - version: 1.5.2 + specifier: ^1.7.4 + version: 1.7.4 '@bomb.sh/args': - specifier: ^0.3.0 - version: 0.3.0 + specifier: ^0.3.1 + version: 0.3.1 '@codemirror/autocomplete': specifier: ^6.18.6 version: 6.18.6 @@ -1325,8 +1325,8 @@ importers: packages/design-system: dependencies: '@atlaskit/pragmatic-drag-and-drop': - specifier: ^1.5.2 - version: 1.5.2 + specifier: ^1.7.4 + version: 1.7.4 '@atlaskit/pragmatic-drag-and-drop-auto-scroll': specifier: ^2.1.0 version: 2.1.0 @@ -2231,8 +2231,8 @@ packages: '@atlaskit/pragmatic-drag-and-drop-hitbox@1.0.3': resolution: {integrity: sha512-/Sbu/HqN2VGLYBhnsG7SbRNg98XKkbF6L7XDdBi+izRybfaK1FeMfodPpm/xnBHPJzwYMdkE0qtLyv6afhgMUA==} - '@atlaskit/pragmatic-drag-and-drop@1.5.2': - resolution: {integrity: sha512-fDuTwlDD11r3ev5tLJ6JnzQUiG9v77c8zGcNdO7RRNtZZbOHam8CFhmyFGY4E/mLjvgYng0UkcyCrSBc4FXYZw==} + '@atlaskit/pragmatic-drag-and-drop@1.7.4': + resolution: {integrity: sha512-lZHnO9BJdHPKnwB0uvVUCyDnIhL+WAHzXQ2EXX0qacogOsnvIUiCgY0BLKhBqTCWln3/f/Ox5jU54MKO6ayh9A==} '@aws-crypto/sha256-js@5.2.0': resolution: {integrity: sha512-FFQQyu7edu4ufvIZ+OadFpHHOt+eSTBaYaki44c+akjg7qZg9oOQeLlk77F6tSYqjDAFClrHJk9tMf0HdVyOvA==} @@ -2466,8 +2466,8 @@ packages: resolution: {integrity: sha512-H45s8fVLYjbhFH62dIJ3WtmJ6RSPt/3DRO0ZcT2SUiYiQyz3BLVb9ADEnLl91m74aQPS3AzzeajZHYOalWe3bg==} engines: {node: '>=6.9.0'} - '@bomb.sh/args@0.3.0': - resolution: {integrity: sha512-ufLrPUVSfU3dSn2uA+gJlls+eQYOKoFSGxHm6Si9Cx7lLu1oANLop+jKCm+2eBe1tHoGLi50B1QvcPpK8yuD8w==} + '@bomb.sh/args@0.3.1': + resolution: {integrity: sha512-CwxKrfgcorUPP6KfYD59aRdBYWBTsfsxT+GmoLVnKo5Tmyoqbpo0UNcjngRMyU+6tiPbd18RuIYxhgAn44wU/Q==} '@brillout/import@0.2.6': resolution: {integrity: sha512-1GUTmADc8trUC1YSW2lp9r6PmwluMoEyHajnE1kxVdbKGD0wJOlq/DvTWMUqLtBDCnQR+n//qgMtz6HwA/lotA==} @@ -9505,15 +9505,15 @@ snapshots: '@atlaskit/pragmatic-drag-and-drop-auto-scroll@2.1.0': dependencies: - '@atlaskit/pragmatic-drag-and-drop': 1.5.2 + '@atlaskit/pragmatic-drag-and-drop': 1.7.4 '@babel/runtime': 7.25.0 '@atlaskit/pragmatic-drag-and-drop-hitbox@1.0.3': dependencies: - '@atlaskit/pragmatic-drag-and-drop': 1.5.2 + '@atlaskit/pragmatic-drag-and-drop': 1.7.4 '@babel/runtime': 7.25.0 - '@atlaskit/pragmatic-drag-and-drop@1.5.2': + '@atlaskit/pragmatic-drag-and-drop@1.7.4': dependencies: '@babel/runtime': 7.25.0 bind-event-listener: 3.0.0 @@ -9844,7 +9844,7 @@ snapshots: '@babel/helper-string-parser': 7.25.9 '@babel/helper-validator-identifier': 7.25.9 - '@bomb.sh/args@0.3.0': {} + '@bomb.sh/args@0.3.1': {} '@brillout/import@0.2.6': {}