@pushwoosh/smart-components-kit 1.2.2 → 1.2.3

package/MediaStorage/MediaStorage.js

@@ -11,6 +11,11 @@ import { formatBytes, getRatioLabel, getThumbUrl } from './mediaFile.utils';
 import { useLang } from './polyglot';
 import { CropBadge, Dropzone, EmptyState, Grid, HiddenInput, Tile, TileActions, TileImage, UsageLine } from './styled';
 const UPLOAD_PATH = '/api/media/upload';
+const ALLOWED_IMAGE_EXTENSIONS = ['.jpg', '.jpeg', '.png', '.gif', '.webp'];
+const isAllowedImage = file => {
+  const name = file.name.toLowerCase();
+  return ALLOWED_IMAGE_EXTENSIONS.some(ext => name.endsWith(ext));
+};
 /**
  * Controlled media gallery: the parent owns the current page (and page size)
  * and is notified of navigation via `onPageChange`. For a self-contained
@@ -117,7 +122,19 @@ export const MediaStorage = ({
     };
   }, [listAsync.value, rpcGateway, application]);
   const uploadFiles = async selected => {
-    const images = selected.filter(file => file.type.startsWith('image/'));
+    if (selected.length === 0) return;
+    const images = selected.filter(isAllowedImage);
+    if (selected.some(file => !isAllowedImage(file))) {
+      openToast({
+        title: lang({
+          message: 'SMART.MEDIA_STORAGE.UNSUPPORTED_FORMAT'
+        }),
+        type: 'error'
+      });
+    }
+    if (uploadInputRef.current) {
+      uploadInputRef.current.value = '';
+    }
     if (images.length === 0) return;
     setIsUploading(true);
     try {
@@ -158,9 +175,6 @@ export const MediaStorage = ({
         });
       }
     } finally {
-      if (uploadInputRef.current) {
-        uploadInputRef.current.value = '';
-      }
       setIsUploading(false);
     }
   };
@@ -223,7 +237,7 @@ export const MediaStorage = ({
     }), _jsx(HiddenInput, {
       ref: uploadInputRef,
       type: "file",
-      accept: "image/*",
+      accept: ALLOWED_IMAGE_EXTENSIONS.join(','),
       multiple: true,
       onChange: event => void uploadFiles(Array.from(event.target.files ?? []))
     }), loading && _jsx(EmptyState, {

package/MediaStorage/polyglot/messages_en.js

@@ -8,6 +8,7 @@ export const messages = {
   'SMART.MEDIA_STORAGE.NEXT_BUTTON': 'Next',
   'SMART.MEDIA_STORAGE.LOAD_ERROR': 'Failed to load media files',
   'SMART.MEDIA_STORAGE.UPLOAD_ERROR': 'Failed to upload image',
+  'SMART.MEDIA_STORAGE.UNSUPPORTED_FORMAT': 'Unsupported format. Use JPEG, PNG, GIF or WebP',
   'SMART.MEDIA_STORAGE.UPLOAD_SUCCESS': 'Image uploaded',
   'SMART.MEDIA_STORAGE.USAGE': '{{count}} files · {{size}}',
   'SMART.MEDIA_STORAGE.CROPS_BADGE': '{{count}} cr.',

package/MediaStorage/polyglot/messages_ru.js

@@ -8,6 +8,7 @@ export const messages = {
   'SMART.MEDIA_STORAGE.NEXT_BUTTON': 'Вперёд',
   'SMART.MEDIA_STORAGE.LOAD_ERROR': 'Не удалось загрузить медиафайлы',
   'SMART.MEDIA_STORAGE.UPLOAD_ERROR': 'Не удалось загрузить изображение',
+  'SMART.MEDIA_STORAGE.UNSUPPORTED_FORMAT': 'Неподдерживаемый формат. Используйте JPEG, PNG, GIF или WebP',
   'SMART.MEDIA_STORAGE.UPLOAD_SUCCESS': 'Изображение загружено',
   'SMART.MEDIA_STORAGE.USAGE': '{{count}} файлов · {{size}}',
   'SMART.MEDIA_STORAGE.CROPS_BADGE': '{{count}} кр.',

package/MediaStorage/polyglot/types.d.ts

@@ -9,6 +9,7 @@ export type MediaStorageMessages = {
     'SMART.MEDIA_STORAGE.NEXT_BUTTON': NoParams;
     'SMART.MEDIA_STORAGE.LOAD_ERROR': NoParams;
     'SMART.MEDIA_STORAGE.UPLOAD_ERROR': NoParams;
+    'SMART.MEDIA_STORAGE.UNSUPPORTED_FORMAT': NoParams;
     'SMART.MEDIA_STORAGE.UPLOAD_SUCCESS': NoParams;
     'SMART.MEDIA_STORAGE.USAGE': {
         count: number;

package/package.json

@@ -48,5 +48,5 @@
     "react": "^16.14.0 || ^18.0.0",
     "react-dom": "^16.14.0 || ^18.0.0"
   },
-  "version": "1.2.2"
+  "version": "1.2.3"
 }