diff --git a/packages/console/src/ds-components/Uploader/FileUploader/index.tsx b/packages/console/src/ds-components/Uploader/FileUploader/index.tsx
index edafb2d32..16f55e19a 100644
--- a/packages/console/src/ds-components/Uploader/FileUploader/index.tsx
+++ b/packages/console/src/ds-components/Uploader/FileUploader/index.tsx
@@ -1,5 +1,5 @@
import type { AllowedUploadMimeType, UserAssets } from '@logto/schemas';
-import { maxUploadFileSize } from '@logto/schemas';
+import { maxUploadImageSize } from '@logto/schemas';
import classNames from 'classnames';
import { type KyInstance } from 'ky';
import { useCallback, useEffect, useState } from 'react';
@@ -15,7 +15,6 @@ import { Ring } from '../../Spinner';
import * as styles from './index.module.scss';
export type Props = {
- readonly maxSize: number; // In bytes
readonly allowedMimeTypes: AllowedUploadMimeType[];
readonly actionDescription?: string;
readonly onCompleted: (fileUrl: string) => void;
@@ -33,7 +32,6 @@ export type Props = {
};
function FileUploader({
- maxSize,
allowedMimeTypes,
actionDescription,
onCompleted,
@@ -90,10 +88,10 @@ function FileUploader({
return;
}
- const fileSizeLimit = Math.min(maxSize, maxUploadFileSize);
-
- if (acceptedFile.size > fileSizeLimit) {
- setUploadError(t('components.uploader.error_file_size', { size: fileSizeLimit / 1024 }));
+ if (acceptedFile.size > maxUploadImageSize) {
+ setUploadError(
+ t('components.uploader.error_file_size', { size: maxUploadImageSize / 1024 })
+ );
return;
}
@@ -113,7 +111,7 @@ function FileUploader({
setIsUploading(false);
}
},
- [api, apiInstance, allowedMimeTypes, maxSize, onCompleted, t, uploadUrl]
+ [api, apiInstance, allowedMimeTypes, onCompleted, t, uploadUrl]
);
const { getRootProps, getInputProps, isDragActive } = useDropzone({
diff --git a/packages/console/src/ds-components/Uploader/ImageUploader/index.tsx b/packages/console/src/ds-components/Uploader/ImageUploader/index.tsx
index 49bc45a7f..3e9ee8113 100644
--- a/packages/console/src/ds-components/Uploader/ImageUploader/index.tsx
+++ b/packages/console/src/ds-components/Uploader/ImageUploader/index.tsx
@@ -3,7 +3,7 @@ import classNames from 'classnames';
import Delete from '@/assets/icons/delete.svg';
import ImageWithErrorFallback from '@/ds-components/ImageWithErrorFallback';
-import useImageMimeTypes, { maxImageSizeLimit } from '@/hooks/use-image-mime-types';
+import useImageMimeTypes from '@/hooks/use-image-mime-types';
import IconButton from '../../IconButton';
import FileUploader from '../FileUploader';
@@ -53,12 +53,7 @@ function ImageUploader({
) : (
-
+
);
}
diff --git a/packages/console/src/hooks/use-image-mime-types.ts b/packages/console/src/hooks/use-image-mime-types.ts
index 7300516a4..91136f7fc 100644
--- a/packages/console/src/hooks/use-image-mime-types.ts
+++ b/packages/console/src/hooks/use-image-mime-types.ts
@@ -1,11 +1,9 @@
-import type { AllowedUploadMimeType } from '@logto/schemas';
+import { maxUploadImageSize, type AllowedUploadMimeType } from '@logto/schemas';
import { useMemo } from 'react';
import { useTranslation } from 'react-i18next';
import { convertToFileExtensionArray } from '@/utils/uploader';
-export const maxImageSizeLimit = 500 * 1024; // 500 KB
-
const allowedImageMimeTypes: AllowedUploadMimeType[] = [
'image/svg+xml',
'image/png',
@@ -25,7 +23,7 @@ const useImageMimeTypes = (
const description = useMemo(() => {
return t('components.uploader.image_limit', {
- size: maxImageSizeLimit / 1024,
+ size: maxUploadImageSize / 1024,
extensions: convertToFileExtensionArray(allowedMimeTypes),
});
}, [allowedMimeTypes, t]);
diff --git a/packages/core/src/routes-me/user-assets.ts b/packages/core/src/routes-me/user-assets.ts
index f80333774..2fac031ba 100644
--- a/packages/core/src/routes-me/user-assets.ts
+++ b/packages/core/src/routes-me/user-assets.ts
@@ -4,7 +4,7 @@ import { consoleLog } from '@logto/cli/lib/utils.js';
import {
userAssetsServiceStatusGuard,
allowUploadMimeTypes,
- maxUploadFileSize,
+ maxUploadImageSize,
type UserAssets,
userAssetsGuard,
adminTenantId,
@@ -41,7 +41,7 @@ export default function userAssetsRoutes(...[router]:
? {
status: 'ready',
allowUploadMimeTypes,
- maxUploadFileSize,
+ maxUploadFileSize: maxUploadImageSize,
}
: {
status: 'not_configured',
@@ -66,7 +66,7 @@ export default function userAssetsRoutes(...[router]:
const file = bodyFiles[0];
assertThat(file, 'guard.invalid_input');
- assertThat(file.size <= maxUploadFileSize, 'guard.file_size_exceeded');
+ assertThat(file.size <= maxUploadImageSize, 'guard.file_size_exceeded');
assertThat(
allowUploadMimeTypes.map(String).includes(file.mimetype),
'guard.mime_type_not_allowed'
diff --git a/packages/core/src/routes/user-assets.ts b/packages/core/src/routes/user-assets.ts
index cf1f7e637..c82f97fad 100644
--- a/packages/core/src/routes/user-assets.ts
+++ b/packages/core/src/routes/user-assets.ts
@@ -5,7 +5,7 @@ import {
userAssetsGuard,
userAssetsServiceStatusGuard,
allowUploadMimeTypes,
- maxUploadFileSize,
+ maxUploadImageSize,
} from '@logto/schemas';
import { generateStandardId } from '@logto/shared';
import { format } from 'date-fns';
@@ -36,7 +36,7 @@ export default function userAssetsRoutes(
? {
status: 'ready',
allowUploadMimeTypes,
- maxUploadFileSize,
+ maxUploadFileSize: maxUploadImageSize,
}
: {
status: 'not_configured',
@@ -61,7 +61,7 @@ export default function userAssetsRoutes(
const file = bodyFiles[0];
assertThat(file, 'guard.invalid_input');
- assertThat(file.size <= maxUploadFileSize, 'guard.file_size_exceeded');
+ assertThat(file.size <= maxUploadImageSize, 'guard.file_size_exceeded');
assertThat(
allowUploadMimeTypes.map(String).includes(file.mimetype),
'guard.mime_type_not_allowed'
diff --git a/packages/schemas/src/types/user-assets.ts b/packages/schemas/src/types/user-assets.ts
index d6e2d4312..233c62a5d 100644
--- a/packages/schemas/src/types/user-assets.ts
+++ b/packages/schemas/src/types/user-assets.ts
@@ -1,6 +1,7 @@
import { z } from 'zod';
-export const maxUploadFileSize = 8 * 1024 * 1024; // 8MB
+export const maxUploadFileSize = 10 * 1024 * 1024; // 10MB
+export const maxUploadImageSize = 500 * 1024; // 500KB
// Reference: https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types/Common_types
export const allowUploadMimeTypes = [