@panneau/field-upload 3.0.79 → 3.0.80

package/es/index.js

@@ -39,7 +39,7 @@ var propTypes = {
   withButton: PropTypes.bool,
   withFind: PropTypes.bool,
   addButtonLabel: PropTypes$1.label,
-  searchButtonLabel: PropTypes$1.label,
+  findButtonLabel: PropTypes$1.label,
   confirmButtonLabel: PropTypes$1.label,
   allowMultipleUploads: PropTypes.bool,
   maxNumberOfFiles: PropTypes.number,
@@ -69,7 +69,7 @@ var defaultProps = {
       "value": "Add file"
     }]
   }),
-  searchButtonLabel: /*#__PURE__*/React.createElement(FormattedMessage, {
+  findButtonLabel: /*#__PURE__*/React.createElement(FormattedMessage, {
     id: "une5WQ",
     defaultMessage: [{
       "type": 0,
@@ -103,7 +103,7 @@ var UploadField = function UploadField(_ref) {
     withButton = _ref.withButton,
     withFind = _ref.withFind,
     addButtonLabel = _ref.addButtonLabel,
-    searchButtonLabel = _ref.searchButtonLabel,
+    findButtonLabel = _ref.findButtonLabel,
     confirmButtonLabel = _ref.confirmButtonLabel,
     allowMultipleUploads = _ref.allowMultipleUploads,
     maxNumberOfFiles = _ref.maxNumberOfFiles,
@@ -213,13 +213,14 @@ var UploadField = function UploadField(_ref) {
   var toggleResourceModal = useCallback(function () {
     setResourceModalOpen(!resourceModalOpen);
   }, [resourceModalOpen, setResourceModalOpen]);
-  var closeResourceModal = useCallback(function () {
-    setResourceModalOpen(false);
-  }, [resourceModalOpen, setResourceModalOpen]);
   var _useState5 = useState([]),
     _useState6 = _slicedToArray(_useState5, 2),
     modalItems = _useState6[0],
     setModalItems = _useState6[1];
+  var closeResourceModal = useCallback(function () {
+    setResourceModalOpen(false);
+    setModalItems(null);
+  }, [resourceModalOpen, setResourceModalOpen, setModalItems]);
   var onClickSelect = useCallback(function (newValue) {
     if (allowMultipleUploads) {
       if (newValue !== null) {
@@ -227,19 +228,22 @@ var UploadField = function UploadField(_ref) {
           _ref2$id = _ref2.id,
           id = _ref2$id === void 0 ? null : _ref2$id;
         if (id !== null) {
-          var previous = (modalItems || []).find(function (_ref3) {
-            var _ref3$id = _ref3.id,
+          console.log('add', newValue);
+          var previous = (modalItems || []).find(function () {
+            var _ref3 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
+              _ref3$id = _ref3.id,
               itemId = _ref3$id === void 0 ? null : _ref3$id;
             return id === itemId;
           });
           if (previous) {
-            setModalItems((modalItems || []).filter(function (_ref4) {
-              var _ref4$id = _ref4.id,
+            setModalItems((modalItems || []).filter(function () {
+              var _ref4 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
+                _ref4$id = _ref4.id,
                 itemId = _ref4$id === void 0 ? null : _ref4$id;
               return id !== itemId;
             }));
           } else {
-            setModalItems([].concat(_toConsumableArray(modalItems), [newValue]));
+            setModalItems([].concat(_toConsumableArray(modalItems || []), [newValue]));
           }
         }
       }
@@ -249,11 +253,13 @@ var UploadField = function UploadField(_ref) {
     }
   }, [onChange, setResourceModalOpen, allowMultipleUploads, modalItems, setModalItems]);
   var confirmResourceModal = useCallback(function () {
+    console.log('confirm', modalItems, onChange);
     if (onChange !== null) {
       onChange(modalItems);
       setResourceModalOpen(false);
+      setModalItems(null);
     }
-  }, [onChange, setResourceModalOpen, allowMultipleUploads]);
+  }, [onChange, setResourceModalOpen, modalItems, allowMultipleUploads, setModalItems]);
   var initialQuery = useMemo(function () {
     return {
       types: types
@@ -371,7 +377,7 @@ var UploadField = function UploadField(_ref) {
     onClick: toggleResourceModal,
     disabled: disabled,
     outline: true
-  }, /*#__PURE__*/React.createElement(Label, null, searchButtonLabel))) : null) : null, !showResourceModal && !disabled && !hasMedia && !withButton && uppy !== null ? /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/React.createElement(Label, null, findButtonLabel))) : null) : null, !showResourceModal && !disabled && !hasMedia && !withButton && uppy !== null ? /*#__PURE__*/React.createElement("div", {
     className: styles.dashboard
   }, /*#__PURE__*/React.createElement(Dashboard, Object.assign({
     uppy: uppy
@@ -427,7 +433,7 @@ var UploadField = function UploadField(_ref) {
   //     />
   // </Dialog>
   null, showResourceModal ? /*#__PURE__*/React.createElement(Dialog, {
-    title: /*#__PURE__*/React.createElement(Label, null, searchButtonLabel),
+    title: /*#__PURE__*/React.createElement(Label, null, findButtonLabel),
     size: "lg",
     onClose: closeResourceModal
   }, /*#__PURE__*/React.createElement(ResourceItemsList, {
@@ -444,13 +450,29 @@ var UploadField = function UploadField(_ref) {
       },
       withoutActionsColumn: true
     }
-  }), allowMultipleUploads ? /*#__PURE__*/React.createElement(Button, {
+  }), allowMultipleUploads ? /*#__PURE__*/React.createElement("div", {
+    className: "d-flex"
+  }, modalItems !== null && modalItems.length > 0 ? /*#__PURE__*/React.createElement("span", {
+    className: "me-2"
+  }, /*#__PURE__*/React.createElement(FormattedMessage, {
+    id: "ZHvvZx",
+    defaultMessage: [{
+      "type": 1,
+      "value": "count"
+    }, {
+      "type": 0,
+      "value": " items selected"
+    }],
+    value: {
+      count: modalItems.length
+    }
+  })) : null, /*#__PURE__*/React.createElement(Button, {
     type: "button",
     theme: "primary",
     onClick: confirmResourceModal,
     disabled: disabled,
     className: "d-block ms-auto mt-2"
-  }, /*#__PURE__*/React.createElement(Label, null, confirmButtonLabel)) : null) : null);
+  }, /*#__PURE__*/React.createElement(Label, null, confirmButtonLabel))) : null) : null);
 };
 UploadField.propTypes = propTypes;
 UploadField.defaultProps = defaultProps;

package/lib/index.js

@@ -61,7 +61,7 @@ var propTypes = {
   withButton: PropTypes__default["default"].bool,
   withFind: PropTypes__default["default"].bool,
   addButtonLabel: core.PropTypes.label,
-  searchButtonLabel: core.PropTypes.label,
+  findButtonLabel: core.PropTypes.label,
   confirmButtonLabel: core.PropTypes.label,
   allowMultipleUploads: PropTypes__default["default"].bool,
   maxNumberOfFiles: PropTypes__default["default"].number,
@@ -91,7 +91,7 @@ var defaultProps = {
       "value": "Add file"
     }]
   }),
-  searchButtonLabel: /*#__PURE__*/React__default["default"].createElement(reactIntl.FormattedMessage, {
+  findButtonLabel: /*#__PURE__*/React__default["default"].createElement(reactIntl.FormattedMessage, {
     id: "une5WQ",
     defaultMessage: [{
       "type": 0,
@@ -125,7 +125,7 @@ var UploadField = function UploadField(_ref) {
     withButton = _ref.withButton,
     withFind = _ref.withFind,
     addButtonLabel = _ref.addButtonLabel,
-    searchButtonLabel = _ref.searchButtonLabel,
+    findButtonLabel = _ref.findButtonLabel,
     confirmButtonLabel = _ref.confirmButtonLabel,
     allowMultipleUploads = _ref.allowMultipleUploads,
     maxNumberOfFiles = _ref.maxNumberOfFiles,
@@ -235,13 +235,14 @@ var UploadField = function UploadField(_ref) {
   var toggleResourceModal = React.useCallback(function () {
     setResourceModalOpen(!resourceModalOpen);
   }, [resourceModalOpen, setResourceModalOpen]);
-  var closeResourceModal = React.useCallback(function () {
-    setResourceModalOpen(false);
-  }, [resourceModalOpen, setResourceModalOpen]);
   var _useState5 = React.useState([]),
     _useState6 = _slicedToArray__default["default"](_useState5, 2),
     modalItems = _useState6[0],
     setModalItems = _useState6[1];
+  var closeResourceModal = React.useCallback(function () {
+    setResourceModalOpen(false);
+    setModalItems(null);
+  }, [resourceModalOpen, setResourceModalOpen, setModalItems]);
   var onClickSelect = React.useCallback(function (newValue) {
     if (allowMultipleUploads) {
       if (newValue !== null) {
@@ -249,19 +250,22 @@ var UploadField = function UploadField(_ref) {
           _ref2$id = _ref2.id,
           id = _ref2$id === void 0 ? null : _ref2$id;
         if (id !== null) {
-          var previous = (modalItems || []).find(function (_ref3) {
-            var _ref3$id = _ref3.id,
+          console.log('add', newValue);
+          var previous = (modalItems || []).find(function () {
+            var _ref3 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
+              _ref3$id = _ref3.id,
               itemId = _ref3$id === void 0 ? null : _ref3$id;
             return id === itemId;
           });
           if (previous) {
-            setModalItems((modalItems || []).filter(function (_ref4) {
-              var _ref4$id = _ref4.id,
+            setModalItems((modalItems || []).filter(function () {
+              var _ref4 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
+                _ref4$id = _ref4.id,
                 itemId = _ref4$id === void 0 ? null : _ref4$id;
               return id !== itemId;
             }));
           } else {
-            setModalItems([].concat(_toConsumableArray__default["default"](modalItems), [newValue]));
+            setModalItems([].concat(_toConsumableArray__default["default"](modalItems || []), [newValue]));
           }
         }
       }
@@ -271,11 +275,13 @@ var UploadField = function UploadField(_ref) {
     }
   }, [onChange, setResourceModalOpen, allowMultipleUploads, modalItems, setModalItems]);
   var confirmResourceModal = React.useCallback(function () {
+    console.log('confirm', modalItems, onChange);
     if (onChange !== null) {
       onChange(modalItems);
       setResourceModalOpen(false);
+      setModalItems(null);
     }
-  }, [onChange, setResourceModalOpen, allowMultipleUploads]);
+  }, [onChange, setResourceModalOpen, modalItems, allowMultipleUploads, setModalItems]);
   var initialQuery = React.useMemo(function () {
     return {
       types: types
@@ -393,7 +399,7 @@ var UploadField = function UploadField(_ref) {
     onClick: toggleResourceModal,
     disabled: disabled,
     outline: true
-  }, /*#__PURE__*/React__default["default"].createElement(Label__default["default"], null, searchButtonLabel))) : null) : null, !showResourceModal && !disabled && !hasMedia && !withButton && uppy$1 !== null ? /*#__PURE__*/React__default["default"].createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement(Label__default["default"], null, findButtonLabel))) : null) : null, !showResourceModal && !disabled && !hasMedia && !withButton && uppy$1 !== null ? /*#__PURE__*/React__default["default"].createElement("div", {
     className: styles.dashboard
   }, /*#__PURE__*/React__default["default"].createElement(react.Dashboard, Object.assign({
     uppy: uppy$1
@@ -449,7 +455,7 @@ var UploadField = function UploadField(_ref) {
   //     />
   // </Dialog>
   null, showResourceModal ? /*#__PURE__*/React__default["default"].createElement(Dialog__default["default"], {
-    title: /*#__PURE__*/React__default["default"].createElement(Label__default["default"], null, searchButtonLabel),
+    title: /*#__PURE__*/React__default["default"].createElement(Label__default["default"], null, findButtonLabel),
     size: "lg",
     onClose: closeResourceModal
   }, /*#__PURE__*/React__default["default"].createElement(ResourceItemsList__default["default"], {
@@ -466,13 +472,29 @@ var UploadField = function UploadField(_ref) {
       },
       withoutActionsColumn: true
     }
-  }), allowMultipleUploads ? /*#__PURE__*/React__default["default"].createElement(Button__default["default"], {
+  }), allowMultipleUploads ? /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "d-flex"
+  }, modalItems !== null && modalItems.length > 0 ? /*#__PURE__*/React__default["default"].createElement("span", {
+    className: "me-2"
+  }, /*#__PURE__*/React__default["default"].createElement(reactIntl.FormattedMessage, {
+    id: "ZHvvZx",
+    defaultMessage: [{
+      "type": 1,
+      "value": "count"
+    }, {
+      "type": 0,
+      "value": " items selected"
+    }],
+    value: {
+      count: modalItems.length
+    }
+  })) : null, /*#__PURE__*/React__default["default"].createElement(Button__default["default"], {
     type: "button",
     theme: "primary",
     onClick: confirmResourceModal,
     disabled: disabled,
     className: "d-block ms-auto mt-2"
-  }, /*#__PURE__*/React__default["default"].createElement(Label__default["default"], null, confirmButtonLabel)) : null) : null);
+  }, /*#__PURE__*/React__default["default"].createElement(Label__default["default"], null, confirmButtonLabel))) : null) : null);
 };
 UploadField.propTypes = propTypes;
 UploadField.defaultProps = defaultProps;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@panneau/field-upload",
-    "version": "3.0.79",
+    "version": "3.0.80",
     "description": "An Upload field",
     "keywords": [
         "javascript"
@@ -82,5 +82,5 @@
     "publishConfig": {
         "access": "public"
     },
-    "gitHead": "cbcafea046653fef8b48a8f877d9a8521cd4261e"
+    "gitHead": "e7367fd7150035c2ea8064f12de768e1c0a707a1"
 }