- {t('upload.fileRequirements', { limit: maxFilesPerUpload })} + {t('upload.fileRequirements', { formats: formatsLabel, limit: maxFilesPerUpload, sizeLimit: maxFileSizeMb })}
= ({
[publicSettings?.allowed_file_types]
);
- const allowedExtensions = useMemo(
- () => getSupportedExtensions(publicSettings?.allowed_file_types),
+ // #821 — the requirements hint used to hardcode "JPEG, PNG or WebP"; render
+ // the actually-configured formats so it never contradicts what's accepted.
+ const formatsLabel = useMemo(
+ () => extensionsToLabel(publicSettings?.allowed_file_types),
[publicSettings?.allowed_file_types]
);
@@ -238,11 +240,10 @@ export const UserPhotoUpload: React.FC
- {t('upload.fileRequirements', { - types: allowedExtensions.map(extension => extension.toUpperCase()).join(', '), - limit: maxFilesPerUpload, - sizeLimit: maxFileSizeMb, - })} + {/* #613 — pass { limit } so `{{limit}}` interpolates + with the real number from settings instead of + rendering literally. */} + {t('upload.fileRequirements', { formats: formatsLabel, limit: maxFilesPerUpload, sizeLimit: maxFileSizeMb })}
{ - it('keeps configured supported extensions for the upload hint', () => { - expect(getSupportedExtensions('jpg, dng, heic, heif, mov, mp4, .webp')).toEqual([ - 'jpg', - 'dng', - 'heic', - 'heif', - 'mov', - 'mp4', - 'webp', - ]); +describe('fileTypes', () => { + describe('extensionsToMimeTypes', () => { + it('maps known extensions to MIME types', () => { + expect(extensionsToMimeTypes('jpg,png,mov')).toEqual(['image/jpeg', 'image/png', 'video/quicktime']); + }); + it('supports HEIC/HEIF (#821)', () => { + expect(extensionsToMimeTypes('heic,heif')).toEqual(['image/heic', 'image/heif']); + }); + it('supports DNG (#821)', () => { + expect(extensionsToMimeTypes('dng')).toEqual(['image/x-adobe-dng']); + }); + it('drops unknown extensions and falls back to default when nothing maps', () => { + expect(extensionsToMimeTypes('abc,xyz')).toEqual(['image/jpeg', 'image/png', 'image/webp']); + }); }); - it('uses the same configured types for validation and file selection', () => { - expect(extensionsToMimeTypes('jpg,jpeg,dng,heic,heif,mov,mp4')).toEqual([ - 'image/jpeg', - 'image/x-adobe-dng', - 'image/heic', - 'image/heif', - 'video/quicktime', - 'video/mp4', - ]); - expect(extensionsToAcceptString('dng,heic,heif')).toBe( - 'image/x-adobe-dng,image/heic,image/heif' - ); + describe('extensionsToLabel', () => { + it('renders a de-duplicated, upper-cased list of the configured formats', () => { + expect(extensionsToLabel('jpg,jpeg,png,webp,mov')).toBe('JPG, JPEG, PNG, WEBP, MOV'); + }); + it('only lists supported extensions (drops unknowns like xyz)', () => { + expect(extensionsToLabel('jpg,png,xyz')).toBe('JPG, PNG'); + }); + it('falls back to the default set when empty', () => { + expect(extensionsToLabel('')).toBe('JPG, JPEG, PNG, WEBP'); + expect(extensionsToLabel(null)).toBe('JPG, JPEG, PNG, WEBP'); + }); }); - it('falls back to the default formats when no configured types are supported', () => { - expect(getSupportedExtensions('unknown')).toEqual([ - 'jpg', - 'jpeg', - 'png', - 'webp', - ]); + describe('extensionsToAcceptString', () => { + it('joins MIME types for the input accept attribute', () => { + expect(extensionsToAcceptString('jpg,heic')).toBe('image/jpeg,image/heic'); + }); }); }); diff --git a/frontend/src/utils/fileTypes.ts b/frontend/src/utils/fileTypes.ts index cd2ff22f..34e42680 100644 --- a/frontend/src/utils/fileTypes.ts +++ b/frontend/src/utils/fileTypes.ts @@ -7,42 +7,41 @@ const EXTENSION_TO_MIME: Record