@panneau/field-upload 3.0.110 → 3.0.112

package/es/index.js

@@ -7,7 +7,7 @@ import classNames from 'classnames';
 import isArray from 'lodash/isArray';
 import isObject from 'lodash/isObject';
 import PropTypes from 'prop-types';
-import React, { useCallback, useMemo, useState, useRef } from 'react';
+import React, { useCallback, useMemo, useState, useRef, useEffect } from 'react';
 import { FormattedMessage } from 'react-intl';
 import { PropTypes as PropTypes$1 } from '@panneau/core';
 import { useResourceQuery } from '@panneau/core/hooks';
@@ -311,9 +311,25 @@ var UploadField = function UploadField(_ref) {
     onListPageChange = _useResourceQuery.onPageChange,
     onListQueryChange = _useResourceQuery.onQueryChange,
     onListQueryReset = _useResourceQuery.onQueryReset;
-  console.log('modalOpened', !showResourceModal && !disabled && withButton && uppy !== null && modalOpened);
-  console.log('uppy', uppy);
+
+  // console.log(
+  //     'modalOpened',
+  //     !showResourceModal && !disabled && withButton && uppy !== null && modalOpened,
+  // );
+  // console.log('uppy', uppy);
+
   var containerRef = useRef(null);
+
+  // Keep this stable, uppy doesnt like
+  var _useState7 = useState(null),
+    _useState8 = _slicedToArray(_useState7, 2),
+    finalUppy = _useState8[0],
+    setFinalUppy = _useState8[1];
+  useEffect(function () {
+    if (uppy !== null && finalUppy === null) {
+      setFinalUppy(uppy);
+    }
+  }, [uppy, finalUppy]);
   return /*#__PURE__*/React.createElement("div", {
     className: classNames([styles.container, _defineProperty({}, className, className !== null)]),
     ref: containerRef
@@ -352,10 +368,10 @@ var UploadField = function UploadField(_ref) {
     onClick: toggleResourceModal,
     disabled: disabled,
     outline: true
-  }, /*#__PURE__*/React.createElement(Label, null, findButtonLabel))) : null) : null, !showResourceModal && !disabled && !hasMedia && !withButton && uppy !== null ? /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/React.createElement(Label, null, findButtonLabel))) : null) : null, !showResourceModal && !disabled && !hasMedia && !withButton && finalUppy !== null ? /*#__PURE__*/React.createElement("div", {
     className: styles.dashboard
   }, /*#__PURE__*/React.createElement(Dashboard, Object.assign({
-    uppy: uppy
+    uppy: finalUppy
     // {...(containerWidth !== null && height !== null
     //     ? { width: containerWidth }
     // : null)}
@@ -369,8 +385,8 @@ var UploadField = function UploadField(_ref) {
     showProgressDetails: true,
     areInsidesReadyToBeVisible: true,
     proudlyDisplayPoweredByUppy: false
-  }))) : null, !showResourceModal && !disabled && withButton && uppy !== null && modalOpened ? /*#__PURE__*/React.createElement(DashboardModal, {
-    uppy: uppy,
+  }))) : null, !showResourceModal && !disabled && withButton && finalUppy !== null && modalOpened ? /*#__PURE__*/React.createElement(DashboardModal, {
+    uppy: finalUppy,
     className: styles.dashboardModal,
     plugins: sources,
     open: true,

package/lib/index.js

@@ -331,9 +331,25 @@ var UploadField = function UploadField(_ref) {
     onListPageChange = _useResourceQuery.onPageChange,
     onListQueryChange = _useResourceQuery.onQueryChange,
     onListQueryReset = _useResourceQuery.onQueryReset;
-  console.log('modalOpened', !showResourceModal && !disabled && withButton && uppy$1 !== null && modalOpened);
-  console.log('uppy', uppy$1);
+
+  // console.log(
+  //     'modalOpened',
+  //     !showResourceModal && !disabled && withButton && uppy !== null && modalOpened,
+  // );
+  // console.log('uppy', uppy);
+
   var containerRef = React.useRef(null);
+
+  // Keep this stable, uppy doesnt like
+  var _useState7 = React.useState(null),
+    _useState8 = _slicedToArray__default["default"](_useState7, 2),
+    finalUppy = _useState8[0],
+    setFinalUppy = _useState8[1];
+  React.useEffect(function () {
+    if (uppy$1 !== null && finalUppy === null) {
+      setFinalUppy(uppy$1);
+    }
+  }, [uppy$1, finalUppy]);
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: classNames__default["default"]([styles.container, _defineProperty__default["default"]({}, className, className !== null)]),
     ref: containerRef
@@ -372,10 +388,10 @@ var UploadField = function UploadField(_ref) {
     onClick: toggleResourceModal,
     disabled: disabled,
     outline: true
-  }, /*#__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", {
+  }, /*#__PURE__*/React__default["default"].createElement(Label__default["default"], null, findButtonLabel))) : null) : null, !showResourceModal && !disabled && !hasMedia && !withButton && finalUppy !== null ? /*#__PURE__*/React__default["default"].createElement("div", {
     className: styles.dashboard
   }, /*#__PURE__*/React__default["default"].createElement(react.Dashboard, Object.assign({
-    uppy: uppy$1
+    uppy: finalUppy
     // {...(containerWidth !== null && height !== null
     //     ? { width: containerWidth }
     // : null)}
@@ -389,8 +405,8 @@ var UploadField = function UploadField(_ref) {
     showProgressDetails: true,
     areInsidesReadyToBeVisible: true,
     proudlyDisplayPoweredByUppy: false
-  }))) : null, !showResourceModal && !disabled && withButton && uppy$1 !== null && modalOpened ? /*#__PURE__*/React__default["default"].createElement(react.DashboardModal, {
-    uppy: uppy$1,
+  }))) : null, !showResourceModal && !disabled && withButton && finalUppy !== null && modalOpened ? /*#__PURE__*/React__default["default"].createElement(react.DashboardModal, {
+    uppy: finalUppy,
     className: styles.dashboardModal,
     plugins: sources,
     open: true,

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@panneau/field-upload",
-    "version": "3.0.110",
+    "version": "3.0.112",
     "description": "An Upload field",
     "keywords": [
         "javascript"
@@ -58,13 +58,13 @@
         "@fortawesome/free-solid-svg-icons": "^5.15.3",
         "@fortawesome/react-fontawesome": "^0.1.14",
         "@panneau/core": "^3.0.101",
-        "@panneau/element-button": "^3.0.101",
+        "@panneau/element-button": "^3.0.112",
         "@panneau/element-label": "^3.0.101",
-        "@panneau/element-media-card": "^3.0.101",
-        "@panneau/list-resource-items": "^3.0.103",
-        "@panneau/modal-dialog": "^3.0.101",
-        "@panneau/modal-upload": "^3.0.108",
-        "@panneau/themes": "^3.0.101",
+        "@panneau/element-media-card": "^3.0.112",
+        "@panneau/list-resource-items": "^3.0.112",
+        "@panneau/modal-dialog": "^3.0.112",
+        "@panneau/modal-upload": "^3.0.112",
+        "@panneau/themes": "^3.0.112",
         "@panneau/uppy": "^3.0.105",
         "@uppy/core": "^3.9.1",
         "@uppy/dashboard": "^3.7.3",
@@ -82,5 +82,5 @@
     "publishConfig": {
         "access": "public"
     },
-    "gitHead": "4fca6a9873eec7598d8ad71c577d31becd37f77b"
+    "gitHead": "30208f166ba7d2c138e58389d835125cd20ef67f"
 }