diff --git a/.changeset/few-flowers-shake.md b/.changeset/few-flowers-shake.md new file mode 100644 index 0000000000..b2760bfd91 --- /dev/null +++ b/.changeset/few-flowers-shake.md @@ -0,0 +1,5 @@ +--- +"@medusajs/dashboard": patch +--- + +Improve error messaging for file uploads diff --git a/packages/admin/dashboard/src/i18n/translations/en.json b/packages/admin/dashboard/src/i18n/translations/en.json index 905fc257a4..945ba1ec01 100644 --- a/packages/admin/dashboard/src/i18n/translations/en.json +++ b/packages/admin/dashboard/src/i18n/translations/en.json @@ -513,7 +513,7 @@ "uploadImagesLabel": "Upload images", "uploadImagesHint": "Drag and drop images here or click to upload.", "invalidFileType": "'{{name}}' is not a supported file type. Supported file types are: {{types}}.", - "fileTooLarge": "'{{name}}' exceeds the maximum file size of {{size}}. Please upload a smaller file.", + "fileTooLarge": "One or more files exceed the maximum file size of {{size}}: {{name}}", "failedToUpload": "Failed to upload the added media. Please try again.", "deleteWarning_one": "You are about to delete {{count}} image. This action cannot be undone.", "deleteWarning_other": "You are about to delete {{count}} images. This action cannot be undone.", diff --git a/packages/admin/dashboard/src/routes/products/common/components/upload-media-form-item/upload-media-form-item.tsx b/packages/admin/dashboard/src/routes/products/common/components/upload-media-form-item/upload-media-form-item.tsx index 81c6ec407d..9a052fa400 100644 --- a/packages/admin/dashboard/src/routes/products/common/components/upload-media-form-item/upload-media-form-item.tsx +++ b/packages/admin/dashboard/src/routes/products/common/components/upload-media-form-item/upload-media-form-item.tsx @@ -70,7 +70,7 @@ export const UploadMediaFormItem = ({ const fileSizeRejections = rejectedFiles.filter((f) => f?.reason === "size") if (fileSizeRejections.length) { - const fileNames = fileSizeRejections.map((f) => f.file.name).join(", ") + const fileNames = "\n" + fileSizeRejections.slice(0, 5).map((f) => f.file.name).join("\n") form.setError("media", { type: "file_too_large", message: t("products.media.fileTooLarge", { @@ -124,7 +124,7 @@ export const UploadMediaFormItem = ({ onUploaded={onUploaded} /> -