@panneau/medias 3.0.187 → 3.0.189

package/es/index.js

@@ -815,7 +815,7 @@ var propTypes$5 = {
   layouts: PropTypes.arrayOf(PropTypes.shape({})),
   theme: PropTypes.string,
   onUpload: PropTypes.func,
-  // onItemsChange: PropTypes.func,
+  onItemsChange: PropTypes.func,
   onLayoutChange: PropTypes.func,
   onMediaFormOpen: PropTypes.func,
   onMediaFormClose: PropTypes.func,
@@ -853,11 +853,11 @@ var defaultProps$5 = {
   }],
   theme: null,
   onUpload: null,
-  // onItemsChange: null,
+  onItemsChange: null,
   onLayoutChange: null,
   onMediaFormOpen: null,
   onMediaFormClose: null,
-  selectable: null,
+  selectable: false,
   selectedItems: null,
   onSelectionChange: null,
   multipleSelection: false,
@@ -881,6 +881,7 @@ function MediasBrowser(_ref) {
     layouts = _ref.layouts,
     theme = _ref.theme,
     onUpload = _ref.onUpload,
+    onItemsChange = _ref.onItemsChange,
     onLayoutChange = _ref.onLayoutChange,
     onMediaFormOpen = _ref.onMediaFormOpen,
     onMediaFormClose = _ref.onMediaFormClose,
@@ -964,14 +965,11 @@ function MediasBrowser(_ref) {
     _useMedias$pages = _useMedias.pages,
     pages = _useMedias$pages === void 0 ? null : _useMedias$pages,
     reload = _useMedias.reload;
-
-  // For picker
-  // useEffect(() => {
-  //     if (onItemsChange !== null) {
-  //         onItemsChange(items);
-  //     }
-  // }, [items, onItemsChange]);
-
+  useEffect(function () {
+    if (onItemsChange !== null) {
+      onItemsChange(items);
+    }
+  }, [items, onItemsChange]);
   var _useState5 = useState(initialLayout || 'table'),
     _useState6 = _slicedToArray(_useState5, 2),
     layout = _useState6[0],
@@ -1006,25 +1004,37 @@ function MediasBrowser(_ref) {
     setCurrentMedia(null);
     updateItem(item);
   }, [setCurrentMedia, updateItem]);
+  var _useState7 = useState(null),
+    _useState8 = _slicedToArray(_useState7, 2),
+    uploadedMedias = _useState8[0],
+    setUploadedMedias = _useState8[1];
   var onMediaUploaded = useCallback(function () {
     var medias = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
     if (medias === null) return;
-    var rawMedias = isArray(medias) ? medias : [medias];
+    var rawMedias = (isArray(medias) ? medias : [medias]).filter(function (it) {
+      return it !== null;
+    });
     if (onUpload !== null) {
       onUpload(rawMedias).then(function (newMedias) {
+        var uploadedNewMedias = (isArray(newMedias) ? [].concat(_toConsumableArray(uploadedMedias || []), _toConsumableArray(newMedias)) : [].concat(_toConsumableArray(uploadedMedias || []), [newMedias])).filter(function (it) {
+          return it !== null;
+        });
+        setUploadedMedias(uploadedNewMedias);
         if (onSelectionChange !== null) {
           onSelectionChange(newMedias);
-          onQueryReset();
+          onQueryReset(); // think about this
           reload();
         }
       });
+    } else {
+      setUploadedMedias(rawMedias);
+      if (onSelectionChange !== null) {
+        onSelectionChange(rawMedias);
+        onQueryReset();
+        reload();
+      }
     }
-    if (onSelectionChange !== null) {
-      onSelectionChange(rawMedias);
-      onQueryReset();
-      reload();
-    }
-  }, [onUpload, reload, onQueryReset, onSelectionChange]);
+  }, [onUpload, reload, onQueryReset, onSelectionChange, uploadedMedias, setUploadedMedias]);
   var pagination = /*#__PURE__*/React.createElement(Pagination, {
     page: page,
     lastPage: lastPage,
@@ -1085,7 +1095,7 @@ function MediasBrowser(_ref) {
   }, [columns, withTrash, showTrashed]);
   var finalItems = useMemo(function () {
     if (withStickySelection && extraItems !== null) {
-      return uniqBy([].concat(_toConsumableArray((extraItems || []).map(function (item) {
+      return uniqBy([].concat(_toConsumableArray(page === 1 ? uploadedMedias || [] : []), _toConsumableArray((extraItems || []).map(function (item) {
         var _item$id = item.id,
           itemId = _item$id === void 0 ? null : _item$id;
         return (allItems || []).find(function () {

package/lib/index.js

@@ -817,7 +817,7 @@ var propTypes$5 = {
   layouts: PropTypes.arrayOf(PropTypes.shape({})),
   theme: PropTypes.string,
   onUpload: PropTypes.func,
-  // onItemsChange: PropTypes.func,
+  onItemsChange: PropTypes.func,
   onLayoutChange: PropTypes.func,
   onMediaFormOpen: PropTypes.func,
   onMediaFormClose: PropTypes.func,
@@ -855,11 +855,11 @@ var defaultProps$5 = {
   }],
   theme: null,
   onUpload: null,
-  // onItemsChange: null,
+  onItemsChange: null,
   onLayoutChange: null,
   onMediaFormOpen: null,
   onMediaFormClose: null,
-  selectable: null,
+  selectable: false,
   selectedItems: null,
   onSelectionChange: null,
   multipleSelection: false,
@@ -883,6 +883,7 @@ function MediasBrowser(_ref) {
     layouts = _ref.layouts,
     theme = _ref.theme,
     onUpload = _ref.onUpload,
+    onItemsChange = _ref.onItemsChange,
     onLayoutChange = _ref.onLayoutChange,
     onMediaFormOpen = _ref.onMediaFormOpen,
     onMediaFormClose = _ref.onMediaFormClose,
@@ -966,14 +967,11 @@ function MediasBrowser(_ref) {
     _useMedias$pages = _useMedias.pages,
     pages = _useMedias$pages === void 0 ? null : _useMedias$pages,
     reload = _useMedias.reload;
-
-  // For picker
-  // useEffect(() => {
-  //     if (onItemsChange !== null) {
-  //         onItemsChange(items);
-  //     }
-  // }, [items, onItemsChange]);
-
+  React.useEffect(function () {
+    if (onItemsChange !== null) {
+      onItemsChange(items);
+    }
+  }, [items, onItemsChange]);
   var _useState5 = React.useState(initialLayout || 'table'),
     _useState6 = _slicedToArray(_useState5, 2),
     layout = _useState6[0],
@@ -1008,25 +1006,37 @@ function MediasBrowser(_ref) {
     setCurrentMedia(null);
     updateItem(item);
   }, [setCurrentMedia, updateItem]);
+  var _useState7 = React.useState(null),
+    _useState8 = _slicedToArray(_useState7, 2),
+    uploadedMedias = _useState8[0],
+    setUploadedMedias = _useState8[1];
   var onMediaUploaded = React.useCallback(function () {
     var medias = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
     if (medias === null) return;
-    var rawMedias = isArray(medias) ? medias : [medias];
+    var rawMedias = (isArray(medias) ? medias : [medias]).filter(function (it) {
+      return it !== null;
+    });
     if (onUpload !== null) {
       onUpload(rawMedias).then(function (newMedias) {
+        var uploadedNewMedias = (isArray(newMedias) ? [].concat(_toConsumableArray(uploadedMedias || []), _toConsumableArray(newMedias)) : [].concat(_toConsumableArray(uploadedMedias || []), [newMedias])).filter(function (it) {
+          return it !== null;
+        });
+        setUploadedMedias(uploadedNewMedias);
         if (onSelectionChange !== null) {
           onSelectionChange(newMedias);
-          onQueryReset();
+          onQueryReset(); // think about this
           reload();
         }
       });
+    } else {
+      setUploadedMedias(rawMedias);
+      if (onSelectionChange !== null) {
+        onSelectionChange(rawMedias);
+        onQueryReset();
+        reload();
+      }
     }
-    if (onSelectionChange !== null) {
-      onSelectionChange(rawMedias);
-      onQueryReset();
-      reload();
-    }
-  }, [onUpload, reload, onQueryReset, onSelectionChange]);
+  }, [onUpload, reload, onQueryReset, onSelectionChange, uploadedMedias, setUploadedMedias]);
   var pagination = /*#__PURE__*/React.createElement(Pagination, {
     page: page,
     lastPage: lastPage,
@@ -1087,7 +1097,7 @@ function MediasBrowser(_ref) {
   }, [columns, withTrash, showTrashed]);
   var finalItems = React.useMemo(function () {
     if (withStickySelection && extraItems !== null) {
-      return uniqBy([].concat(_toConsumableArray((extraItems || []).map(function (item) {
+      return uniqBy([].concat(_toConsumableArray(page === 1 ? uploadedMedias || [] : []), _toConsumableArray((extraItems || []).map(function (item) {
         var _item$id = item.id,
           itemId = _item$id === void 0 ? null : _item$id;
         return (allItems || []).find(function () {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@panneau/medias",
-    "version": "3.0.187",
+    "version": "3.0.189",
     "description": "",
     "keywords": [
         "javascript"
@@ -58,8 +58,8 @@
         "@panneau/element-media-card": "^3.0.187",
         "@panneau/element-media-player": "^3.0.187",
         "@panneau/element-pagination": "^3.0.187",
-        "@panneau/element-table": "^3.0.187",
-        "@panneau/field-upload": "^3.0.187",
+        "@panneau/element-table": "^3.0.189",
+        "@panneau/field-upload": "^3.0.189",
         "@panneau/filter-filters": "^3.0.187",
         "classnames": "^2.5.1",
         "lodash": "^4.17.21",
@@ -69,5 +69,5 @@
     "publishConfig": {
         "access": "public"
     },
-    "gitHead": "659bc65b0123e1d2d5b9aefa6628d49726100747"
+    "gitHead": "8858e57d8a8e8f70d35ac3bcb037fd884102c819"
 }