@blaze-cms/plugin-media-ui 0.147.0-rc-eagle.2 → 0.147.0-rc-eagle.4

package/lib/constants.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.STORE_KEY = exports.REORDER = exports.PREVIEW = exports.PLUGIN_NAME = exports.ONE_FILE_AS_LIMIT = exports.NAME = exports.MORE = exports.MEDIA_OVER_SCAN_COUNT = exports.MEDIA_LIST_ITEM_SIZE = exports.INVALID_STORE_KEY_VALUES = exports.IMAGES = exports.ICON_SIZE = exports.ICON_COLOR = exports.AVAILABLE_FILTER_TYPES = exports.ALL = void 0;
+exports.STORE_KEY = exports.REORDER = exports.PREVIEW = exports.PLUGIN_NAME = exports.ONE_FILE_AS_LIMIT = exports.NAME = exports.MORE = exports.MEDIA_OVER_SCAN_COUNT = exports.MEDIA_LIST_ITEM_SIZE = exports.INVALID_STORE_KEY_VALUES = exports.IMAGES = exports.ICON_SIZE = exports.ICON_COLOR = exports.FILE_DEFAULT_PROPS = exports.AVAILABLE_FILTER_TYPES = exports.ALL = void 0;
 const PLUGIN_NAME = exports.PLUGIN_NAME = 'media-ui';
 const ONE_FILE_AS_LIMIT = exports.ONE_FILE_AS_LIMIT = 1;
 const AVAILABLE_FILTER_TYPES = exports.AVAILABLE_FILTER_TYPES = {
@@ -38,4 +38,5 @@ const PREVIEW = exports.PREVIEW = 'Preview';
 const REORDER = exports.REORDER = 'Reorder';
 const IMAGES = exports.IMAGES = 'Images';
 const MORE = exports.MORE = 'more ...';
+const FILE_DEFAULT_PROPS = exports.FILE_DEFAULT_PROPS = ['id', 'location', 'mimetype', 'url', 'data', 'name', 'storeKey', 'filename', 'type', 'updated'];
 //# sourceMappingURL=constants.js.map

package/lib/constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"constants.js","names":["PLUGIN_NAME","exports","ONE_FILE_AS_LIMIT","AVAILABLE_FILTER_TYPES","all","type","images","videos","documents","MEDIA_LIST_ITEM_SIZE","MEDIA_OVER_SCAN_COUNT","ICON_SIZE","WIDTH","HEIGHT","ICON_COLOR","STROKE","FILL","STORE_KEY","NAME","ALL","INVALID_STORE_KEY_VALUES","PREVIEW","REORDER","IMAGES","MORE"],"sources":["../src/constants.js"],"sourcesContent":["const PLUGIN_NAME = 'media-ui';\nconst ONE_FILE_AS_LIMIT = 1;\nconst AVAILABLE_FILTER_TYPES = {\n  all: {\n    type: 'all'\n  },\n  images: {\n    type: 'image'\n  },\n  videos: {\n    type: 'video'\n  },\n  documents: {\n    type: 'text'\n  }\n};\n\nconst MEDIA_LIST_ITEM_SIZE = 97;\nconst MEDIA_OVER_SCAN_COUNT = 0;\n\nconst ICON_SIZE = {\n  WIDTH: '25px',\n  HEIGHT: '25px'\n};\n\nconst ICON_COLOR = {\n  STROKE: '#63779C',\n  FILL: '#63779C'\n};\n\nconst STORE_KEY = 'storeKey';\nconst NAME = 'name';\n\nconst ALL = 'all';\nconst INVALID_STORE_KEY_VALUES = [null, '', 'Please Choose...', 'Any'];\nconst PREVIEW = 'Preview';\nconst REORDER = 'Reorder';\nconst IMAGES = 'Images';\nconst MORE = 'more ...';\n\nexport {\n  ALL,\n  AVAILABLE_FILTER_TYPES,\n  IMAGES,\n  INVALID_STORE_KEY_VALUES,\n  MEDIA_LIST_ITEM_SIZE,\n  MEDIA_OVER_SCAN_COUNT,\n  MORE,\n  NAME,\n  ONE_FILE_AS_LIMIT,\n  PLUGIN_NAME,\n  PREVIEW,\n  REORDER,\n  STORE_KEY,\n  ICON_SIZE,\n  ICON_COLOR\n};\n"],"mappings":";;;;;;AAAA,MAAMA,WAAW,GAAAC,OAAA,CAAAD,WAAA,GAAG,UAAU;AAC9B,MAAME,iBAAiB,GAAAD,OAAA,CAAAC,iBAAA,GAAG,CAAC;AAC3B,MAAMC,sBAAsB,GAAAF,OAAA,CAAAE,sBAAA,GAAG;EAC7BC,GAAG,EAAE;IACHC,IAAI,EAAE;EACR,CAAC;EACDC,MAAM,EAAE;IACND,IAAI,EAAE;EACR,CAAC;EACDE,MAAM,EAAE;IACNF,IAAI,EAAE;EACR,CAAC;EACDG,SAAS,EAAE;IACTH,IAAI,EAAE;EACR;AACF,CAAC;AAED,MAAMI,oBAAoB,GAAAR,OAAA,CAAAQ,oBAAA,GAAG,EAAE;AAC/B,MAAMC,qBAAqB,GAAAT,OAAA,CAAAS,qBAAA,GAAG,CAAC;AAE/B,MAAMC,SAAS,GAAAV,OAAA,CAAAU,SAAA,GAAG;EAChBC,KAAK,EAAE,MAAM;EACbC,MAAM,EAAE;AACV,CAAC;AAED,MAAMC,UAAU,GAAAb,OAAA,CAAAa,UAAA,GAAG;EACjBC,MAAM,EAAE,SAAS;EACjBC,IAAI,EAAE;AACR,CAAC;AAED,MAAMC,SAAS,GAAAhB,OAAA,CAAAgB,SAAA,GAAG,UAAU;AAC5B,MAAMC,IAAI,GAAAjB,OAAA,CAAAiB,IAAA,GAAG,MAAM;AAEnB,MAAMC,GAAG,GAAAlB,OAAA,CAAAkB,GAAA,GAAG,KAAK;AACjB,MAAMC,wBAAwB,GAAAnB,OAAA,CAAAmB,wBAAA,GAAG,CAAC,IAAI,EAAE,EAAE,EAAE,kBAAkB,EAAE,KAAK,CAAC;AACtE,MAAMC,OAAO,GAAApB,OAAA,CAAAoB,OAAA,GAAG,SAAS;AACzB,MAAMC,OAAO,GAAArB,OAAA,CAAAqB,OAAA,GAAG,SAAS;AACzB,MAAMC,MAAM,GAAAtB,OAAA,CAAAsB,MAAA,GAAG,QAAQ;AACvB,MAAMC,IAAI,GAAAvB,OAAA,CAAAuB,IAAA,GAAG,UAAU","ignoreList":[]}
+{"version":3,"file":"constants.js","names":["PLUGIN_NAME","exports","ONE_FILE_AS_LIMIT","AVAILABLE_FILTER_TYPES","all","type","images","videos","documents","MEDIA_LIST_ITEM_SIZE","MEDIA_OVER_SCAN_COUNT","ICON_SIZE","WIDTH","HEIGHT","ICON_COLOR","STROKE","FILL","STORE_KEY","NAME","ALL","INVALID_STORE_KEY_VALUES","PREVIEW","REORDER","IMAGES","MORE","FILE_DEFAULT_PROPS"],"sources":["../src/constants.js"],"sourcesContent":["const PLUGIN_NAME = 'media-ui';\nconst ONE_FILE_AS_LIMIT = 1;\nconst AVAILABLE_FILTER_TYPES = {\n  all: {\n    type: 'all'\n  },\n  images: {\n    type: 'image'\n  },\n  videos: {\n    type: 'video'\n  },\n  documents: {\n    type: 'text'\n  }\n};\n\nconst MEDIA_LIST_ITEM_SIZE = 97;\nconst MEDIA_OVER_SCAN_COUNT = 0;\n\nconst ICON_SIZE = {\n  WIDTH: '25px',\n  HEIGHT: '25px'\n};\n\nconst ICON_COLOR = {\n  STROKE: '#63779C',\n  FILL: '#63779C'\n};\n\nconst STORE_KEY = 'storeKey';\nconst NAME = 'name';\n\nconst ALL = 'all';\nconst INVALID_STORE_KEY_VALUES = [null, '', 'Please Choose...', 'Any'];\nconst PREVIEW = 'Preview';\nconst REORDER = 'Reorder';\nconst IMAGES = 'Images';\nconst MORE = 'more ...';\n\nconst FILE_DEFAULT_PROPS = [\n  'id',\n  'location',\n  'mimetype',\n  'url',\n  'data',\n  'name',\n  'storeKey',\n  'filename',\n  'type',\n  'updated'\n];\n\nexport {\n  ALL,\n  AVAILABLE_FILTER_TYPES,\n  IMAGES,\n  INVALID_STORE_KEY_VALUES,\n  MEDIA_LIST_ITEM_SIZE,\n  MEDIA_OVER_SCAN_COUNT,\n  MORE,\n  NAME,\n  ONE_FILE_AS_LIMIT,\n  PLUGIN_NAME,\n  PREVIEW,\n  REORDER,\n  STORE_KEY,\n  ICON_SIZE,\n  ICON_COLOR,\n  FILE_DEFAULT_PROPS\n};\n"],"mappings":";;;;;;AAAA,MAAMA,WAAW,GAAAC,OAAA,CAAAD,WAAA,GAAG,UAAU;AAC9B,MAAME,iBAAiB,GAAAD,OAAA,CAAAC,iBAAA,GAAG,CAAC;AAC3B,MAAMC,sBAAsB,GAAAF,OAAA,CAAAE,sBAAA,GAAG;EAC7BC,GAAG,EAAE;IACHC,IAAI,EAAE;EACR,CAAC;EACDC,MAAM,EAAE;IACND,IAAI,EAAE;EACR,CAAC;EACDE,MAAM,EAAE;IACNF,IAAI,EAAE;EACR,CAAC;EACDG,SAAS,EAAE;IACTH,IAAI,EAAE;EACR;AACF,CAAC;AAED,MAAMI,oBAAoB,GAAAR,OAAA,CAAAQ,oBAAA,GAAG,EAAE;AAC/B,MAAMC,qBAAqB,GAAAT,OAAA,CAAAS,qBAAA,GAAG,CAAC;AAE/B,MAAMC,SAAS,GAAAV,OAAA,CAAAU,SAAA,GAAG;EAChBC,KAAK,EAAE,MAAM;EACbC,MAAM,EAAE;AACV,CAAC;AAED,MAAMC,UAAU,GAAAb,OAAA,CAAAa,UAAA,GAAG;EACjBC,MAAM,EAAE,SAAS;EACjBC,IAAI,EAAE;AACR,CAAC;AAED,MAAMC,SAAS,GAAAhB,OAAA,CAAAgB,SAAA,GAAG,UAAU;AAC5B,MAAMC,IAAI,GAAAjB,OAAA,CAAAiB,IAAA,GAAG,MAAM;AAEnB,MAAMC,GAAG,GAAAlB,OAAA,CAAAkB,GAAA,GAAG,KAAK;AACjB,MAAMC,wBAAwB,GAAAnB,OAAA,CAAAmB,wBAAA,GAAG,CAAC,IAAI,EAAE,EAAE,EAAE,kBAAkB,EAAE,KAAK,CAAC;AACtE,MAAMC,OAAO,GAAApB,OAAA,CAAAoB,OAAA,GAAG,SAAS;AACzB,MAAMC,OAAO,GAAArB,OAAA,CAAAqB,OAAA,GAAG,SAAS;AACzB,MAAMC,MAAM,GAAAtB,OAAA,CAAAsB,MAAA,GAAG,QAAQ;AACvB,MAAMC,IAAI,GAAAvB,OAAA,CAAAuB,IAAA,GAAG,UAAU;AAEvB,MAAMC,kBAAkB,GAAAxB,OAAA,CAAAwB,kBAAA,GAAG,CACzB,IAAI,EACJ,UAAU,EACV,UAAU,EACV,KAAK,EACL,MAAM,EACN,MAAM,EACN,UAAU,EACV,UAAU,EACV,MAAM,EACN,SAAS,CACV","ignoreList":[]}

package/lib-es/components/CardMedia/CardMedia.js

@@ -1,15 +1,14 @@
-import React, { useState } from 'react';
-import More from '@blaze-react/more';
-import Button from '@blaze-react/button';
+import React, { useState, useCallback } from 'react';
 import { DeleteAction } from '@blaze-cms/admin';
 import PropTypes from 'prop-types';
 import { getQuery, getMutation } from '@blaze-cms/admin-ui-utils';
-import { useMutation, useApolloClient } from '@apollo/client';
+import { useMutation, useApolloClient, useQuery } from '@apollo/client';
 import classnames from 'classnames';
 import { useToasts } from '@blaze-react/toaster';
 import Modal from '@blaze-react/modal';
 import { createPortal } from 'react-dom';
 import { Link } from 'react-router-dom';
+import { DeleteIcon, EditIcon } from '@blaze-cms/plugin-page-builder-ui';
 import EditMediaFile from '../EditMediaFile';
 import bustUrl from '../../utils/bustUrl';
 const CardMedia = ({
@@ -38,6 +37,16 @@ const CardMedia = ({
   const [deleteFile] = useMutation(getMutation('DELETE_FILE_BY_ID'));
   const [type, extension] = mimetype.split('/');
   const client = useApolloClient();
+  const {
+    data: {
+      getEntitySchemas: [schemaData] = []
+    } = {},
+    loading: schemaLoading
+  } = useQuery(getQuery('GET_ENTITY_SCHEMA'), {
+    variables: {
+      identifier: 'file'
+    }
+  });
   const deleteFileById = async () => {
     setDisplayDeleteModal(false);
     try {
@@ -62,24 +71,33 @@ const CardMedia = ({
       });
     }
   };
-  const handleClick = () => {
+  const handleRowClick = () => onSelected({
+    id,
+    url,
+    name,
+    data
+  });
+  const handleCheckboxToggle = useCallback(e => {
+    e.preventDefault();
+    e.stopPropagation();
     onSelected({
       id,
       url,
       name,
       data
     });
+  }, [id, url, name, data, onSelected]);
+  const handleKeyDown = e => {
+    if (e.key === ' ' || e.key === 'Enter') {
+      e.preventDefault();
+      handleRowClick();
+    }
   };
-  const cardMediaClassNames = classnames('card card--media-list', {
-    'card--media-list--selected': selected,
-    [`card--media-${displayLayout}`]: displayLayout
+  const cardMediaClassNames = classnames('card card--media-list card--media-list-row', `card--media-${displayLayout}`, {
+    'card--media-list--selected': selected
   });
-  const handleCloseModal = () => {
-    setDisplayEditModal(false);
-  };
-  const handleSaveButtonStatus = state => {
-    setEnableSaveButton(state);
-  };
+  const handleCloseModal = () => setDisplayEditModal(false);
+  const handleSaveButtonStatus = state => setEnableSaveButton(state);
   const modalActions = [{
     textButton: 'Cancel',
     callback: handleCloseModal,
@@ -89,9 +107,8 @@ const CardMedia = ({
     callback: () => handleFormSave(),
     modifiers: enableSaveButton ? [] : ['disabled']
   }];
-  const handleFileChange = file => {
-    setFileData(file);
-  };
+  const handleFileChange = file => setFileData(file);
+  const handleStopPropagation = e => e.stopPropagation();
   const handleFormSave = async () => {
     try {
       const {
@@ -101,7 +118,7 @@ const CardMedia = ({
       } = await client.mutate({
         mutation: getMutation('UPDATE_FILE'),
         variables: {
-          input: fileData
+          input: fileData.formData
         },
         update(cache, {
           data: {
@@ -137,6 +154,7 @@ const CardMedia = ({
     handleCloseModal();
     setEnableSaveButton(false);
   };
+  if (schemaLoading) return null;
   return /*#__PURE__*/React.createElement(React.Fragment, null, displayEditModal && createPortal(/*#__PURE__*/React.createElement(Modal, {
     title: "Edit",
     actions: modalActions,
@@ -146,16 +164,28 @@ const CardMedia = ({
     fileId: id,
     handleSaveButtonStatus: handleSaveButtonStatus,
     handleFormSave: handleFormSave,
-    enableSaveButton: enableSaveButton
-  })), modalTargetRef.current), /*#__PURE__*/React.createElement("div", {
-    className: cardMediaClassNames,
-    role: "button",
-    onClick: handleClick
-  }, displayDeleteModal && createPortal(/*#__PURE__*/React.createElement(DeleteAction, {
+    enableSaveButton: enableSaveButton,
+    schemaData: schemaData
+  })), modalTargetRef.current), displayDeleteModal && createPortal(/*#__PURE__*/React.createElement(DeleteAction, {
     onClose: () => setDisplayDeleteModal(false),
     deleteAction: () => deleteFileById(),
     itemName: name
-  }), modalTargetRef.current), type === 'image' ? /*#__PURE__*/React.createElement("div", {
+  }), modalTargetRef.current), /*#__PURE__*/React.createElement("div", {
+    className: cardMediaClassNames,
+    role: "option",
+    "aria-selected": selected,
+    tabIndex: 0,
+    onClick: handleRowClick,
+    onKeyDown: handleKeyDown
+  }, openEditInModal && /*#__PURE__*/React.createElement("div", {
+    className: "card__select"
+  }, /*#__PURE__*/React.createElement("input", {
+    type: "checkbox",
+    "aria-label": `Select ${name}`,
+    checked: !!selected,
+    onChange: handleCheckboxToggle,
+    onClick: handleStopPropagation
+  })), type === 'image' ? /*#__PURE__*/React.createElement("div", {
     className: `card__image card__image--media-${displayLayout}`
   }, /*#__PURE__*/React.createElement("img", {
     src: bustUrl(url, updated),
@@ -166,7 +196,8 @@ const CardMedia = ({
     xmlns: "http://www.w3.org/2000/svg",
     width: "100",
     height: "100",
-    viewBox: "0 0 8 8"
+    viewBox: "0 0 8 8",
+    "aria-hidden": "true"
   }, /*#__PURE__*/React.createElement("path", {
     d: "M0 0v8h7v-4h-4v-4h-3zm4 0v3h3l-3-3zm-3 2h1v1h-1v-1zm0 2h1v1h-1v-1zm0 2h4v1h-4v-1z"
   }))), /*#__PURE__*/React.createElement("footer", {
@@ -175,36 +206,48 @@ const CardMedia = ({
     className: `card__details card__details--media-${displayLayout}`
   }, /*#__PURE__*/React.createElement("div", {
     className: `card__title card__title--media-${displayLayout}`
-  }, /*#__PURE__*/React.createElement("h2", null, name)), /*#__PURE__*/React.createElement("p", null, /*#__PURE__*/React.createElement("span", null, "format: ", extension))), /*#__PURE__*/React.createElement("div", {
-    className: `card__menu card__menu--${displayLayout}`
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "more-menu__wrapper more-menu__wrapper--card"
-  }, /*#__PURE__*/React.createElement(More, {
-    displayBg: true
-  }, /*#__PURE__*/React.createElement(More.Avatar, {
-    isMoreMenu: true
-  }, /*#__PURE__*/React.createElement("span", {
-    className: "material-icons"
-  }, "more_vert")), /*#__PURE__*/React.createElement(More.Content, {
-    isMoreMenu: true
-  }, openEditInModal ? /*#__PURE__*/React.createElement(Button, {
-    onClick: event => {
-      event.preventDefault();
-      event.stopPropagation();
+  }, /*#__PURE__*/React.createElement("h2", {
+    className: "card__file-name"
+  }, name)), /*#__PURE__*/React.createElement("p", {
+    className: "card__meta"
+  }, /*#__PURE__*/React.createElement("span", null, "Format: ", extension))), /*#__PURE__*/React.createElement("div", {
+    className: `card__menu card__menu--icons card__menu--${displayLayout}`
+  }, openEditInModal ? /*#__PURE__*/React.createElement("button", {
+    type: "button",
+    className: "card__icon-btn",
+    title: "Edit",
+    "aria-label": "Edit",
+    onClick: e => {
+      e.preventDefault();
+      e.stopPropagation();
       setDisplayEditModal(true);
-    },
-    className: "more-menu__link"
-  }, "Edit") : /*#__PURE__*/React.createElement(Link, {
+    }
+  }, /*#__PURE__*/React.createElement(EditIcon, {
+    width: "20px",
+    height: "20px"
+  })) : /*#__PURE__*/React.createElement(Link, {
     to: `/media/edit/${id}`,
-    className: "more-menu__link"
-  }, "Edit"), /*#__PURE__*/React.createElement(Button, {
-    onClick: event => {
-      event.preventDefault();
-      event.stopPropagation();
+    className: "card__icon-btn",
+    title: "Edit",
+    "aria-label": "Edit",
+    onClick: e => e.stopPropagation()
+  }, /*#__PURE__*/React.createElement(EditIcon, {
+    width: "20px",
+    height: "20px"
+  })), /*#__PURE__*/React.createElement("button", {
+    type: "button",
+    className: "card__icon-btn",
+    title: "Delete",
+    "aria-label": "Delete",
+    onClick: e => {
+      e.preventDefault();
+      e.stopPropagation();
       setDisplayDeleteModal(true);
-    },
-    className: "more-menu__link"
-  }, "Delete"))))))));
+    }
+  }, /*#__PURE__*/React.createElement(DeleteIcon, {
+    width: "18px",
+    height: "18px"
+  }))))));
 };
 CardMedia.propTypes = {
   name: PropTypes.string.isRequired,

package/lib-es/components/CardMedia/CardMedia.js.map

@@ -1 +1 @@
-{"version":3,"file":"CardMedia.js","names":["React","useState","More","Button","DeleteAction","PropTypes","getQuery","getMutation","useMutation","useApolloClient","classnames","useToasts","Modal","createPortal","Link","EditMediaFile","bustUrl","CardMedia","onSelected","name","url","mimetype","id","selected","displayLayout","data","updated","modalTargetRef","updateFile","removeFile","index","openEditInModal","displayDeleteModal","setDisplayDeleteModal","displayEditModal","setDisplayEditModal","enableSaveButton","setEnableSaveButton","fileData","setFileData","addToast","deleteFile","type","extension","split","client","deleteFileById","variables","input","appearance","autoDismiss","error","message","handleClick","cardMediaClassNames","handleCloseModal","handleSaveButtonStatus","state","modalActions","textButton","callback","modifiers","handleFormSave","handleFileChange","file","updatedFile","mutate","mutation","update","cache","fileUpdated","writeQuery","query","result","e","console","createElement","Fragment","title","actions","onClose","onChange","fileId","current","className","role","onClick","deleteAction","itemName","src","alt","xmlns","width","height","viewBox","d","displayBg","Avatar","isMoreMenu","Content","event","preventDefault","stopPropagation","to","propTypes","string","isRequired","object","oneOfType","number","func","bool","defaultProps"],"sources":["../../../src/components/CardMedia/CardMedia.js"],"sourcesContent":["import React, { useState } from 'react';\nimport More from '@blaze-react/more';\nimport Button from '@blaze-react/button';\nimport { DeleteAction } from '@blaze-cms/admin';\nimport PropTypes from 'prop-types';\nimport { getQuery, getMutation } from '@blaze-cms/admin-ui-utils';\nimport { useMutation, useApolloClient } from '@apollo/client';\nimport classnames from 'classnames';\nimport { useToasts } from '@blaze-react/toaster';\nimport Modal from '@blaze-react/modal';\nimport { createPortal } from 'react-dom';\nimport { Link } from 'react-router-dom';\nimport EditMediaFile from '../EditMediaFile';\nimport bustUrl from '../../utils/bustUrl';\n\nconst CardMedia = ({\n  onSelected,\n  name,\n  url,\n  mimetype,\n  id,\n  selected,\n  displayLayout,\n  data,\n  updated,\n  modalTargetRef,\n  updateFile,\n  removeFile,\n  index,\n  openEditInModal\n}) => {\n  const [displayDeleteModal, setDisplayDeleteModal] = useState(false);\n  const [displayEditModal, setDisplayEditModal] = useState(false);\n  const [enableSaveButton, setEnableSaveButton] = useState(false);\n  const [fileData, setFileData] = useState(null);\n  const { addToast } = useToasts();\n  const [deleteFile] = useMutation(getMutation('DELETE_FILE_BY_ID'));\n  const [type, extension] = mimetype.split('/');\n  const client = useApolloClient();\n\n  const deleteFileById = async () => {\n    setDisplayDeleteModal(false);\n    try {\n      await deleteFile({\n        variables: { input: { id } }\n      });\n\n      removeFile({\n        index\n      });\n\n      addToast(`File: ${name} has been deleted`, {\n        appearance: 'success',\n        autoDismiss: true\n      });\n    } catch (error) {\n      addToast(error.message, {\n        appearance: 'error',\n        autoDismiss: true\n      });\n    }\n  };\n\n  const handleClick = () => {\n    onSelected({ id, url, name, data });\n  };\n\n  const cardMediaClassNames = classnames('card card--media-list', {\n    'card--media-list--selected': selected,\n    [`card--media-${displayLayout}`]: displayLayout\n  });\n\n  const handleCloseModal = () => {\n    setDisplayEditModal(false);\n  };\n\n  const handleSaveButtonStatus = state => {\n    setEnableSaveButton(state);\n  };\n\n  const modalActions = [\n    {\n      textButton: 'Cancel',\n      callback: handleCloseModal,\n      modifiers: ['cancel']\n    },\n    {\n      textButton: 'Apply',\n      callback: () => handleFormSave(),\n      modifiers: enableSaveButton ? [] : ['disabled']\n    }\n  ];\n\n  const handleFileChange = file => {\n    setFileData(file);\n  };\n\n  const handleFormSave = async () => {\n    try {\n      const {\n        data: { updateFile: updatedFile }\n      } = await client.mutate({\n        mutation: getMutation('UPDATE_FILE'),\n        variables: { input: fileData },\n        update(cache, { data: { updateFile: fileUpdated } }) {\n          cache.writeQuery({\n            query: getQuery('GET_FILE_BY_ID'),\n            variables: { id },\n            data: { file: fileUpdated.result }\n          });\n        }\n      });\n\n      updateFile({ file: updatedFile.result, index });\n      addToast(`File: ${fileData.name} has been updated`, {\n        appearance: 'success',\n        autoDismiss: true\n      });\n    } catch (e) {\n      addToast(`File: ${fileData.name} has not been updated`, {\n        appearance: 'error',\n        autoDismiss: true\n      });\n      console.error(e); //eslint-disable-line\n    }\n    handleCloseModal();\n    setEnableSaveButton(false);\n  };\n\n  return (\n    <>\n      {displayEditModal &&\n        createPortal(\n          <Modal title=\"Edit\" actions={modalActions} onClose={handleCloseModal}>\n            <EditMediaFile\n              onChange={handleFileChange}\n              fileId={id}\n              handleSaveButtonStatus={handleSaveButtonStatus}\n              handleFormSave={handleFormSave}\n              enableSaveButton={enableSaveButton}\n            />\n          </Modal>,\n          modalTargetRef.current\n        )}\n      <div className={cardMediaClassNames} role=\"button\" onClick={handleClick}>\n        {displayDeleteModal &&\n          createPortal(\n            <DeleteAction\n              onClose={() => setDisplayDeleteModal(false)}\n              deleteAction={() => deleteFileById()}\n              itemName={name}\n            />,\n            modalTargetRef.current\n          )}\n\n        {type === 'image' ? (\n          <div className={`card__image card__image--media-${displayLayout}`}>\n            <img src={bustUrl(url, updated)} alt={name} />\n          </div>\n        ) : (\n          <div className=\"card__image card__image--media-list-document\">\n            <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"100\" height=\"100\" viewBox=\"0 0 8 8\">\n              <path d=\"M0 0v8h7v-4h-4v-4h-3zm4 0v3h3l-3-3zm-3 2h1v1h-1v-1zm0 2h1v1h-1v-1zm0 2h4v1h-4v-1z\" />\n            </svg>\n          </div>\n        )}\n\n        <footer className={`card__footer card__footer--media-${displayLayout}`}>\n          <div className={`card__details card__details--media-${displayLayout}`}>\n            <div className={`card__title card__title--media-${displayLayout}`}>\n              <h2>{name}</h2>\n            </div>\n            <p>\n              <span>format: {extension}</span>\n            </p>\n          </div>\n          <div className={`card__menu card__menu--${displayLayout}`}>\n            <div className=\"more-menu__wrapper more-menu__wrapper--card\">\n              <More displayBg>\n                <More.Avatar isMoreMenu>\n                  <span className=\"material-icons\">more_vert</span>\n                </More.Avatar>\n                <More.Content isMoreMenu>\n                  {openEditInModal ? (\n                    <Button\n                      onClick={event => {\n                        event.preventDefault();\n                        event.stopPropagation();\n                        setDisplayEditModal(true);\n                      }}\n                      className=\"more-menu__link\">\n                      Edit\n                    </Button>\n                  ) : (\n                    <Link to={`/media/edit/${id}`} className=\"more-menu__link\">\n                      Edit\n                    </Link>\n                  )}\n                  <Button\n                    onClick={event => {\n                      event.preventDefault();\n                      event.stopPropagation();\n                      setDisplayDeleteModal(true);\n                    }}\n                    className=\"more-menu__link\">\n                    Delete\n                  </Button>\n                </More.Content>\n              </More>\n            </div>\n          </div>\n        </footer>\n      </div>\n    </>\n  );\n};\n\nCardMedia.propTypes = {\n  name: PropTypes.string.isRequired,\n  url: PropTypes.string.isRequired,\n  id: PropTypes.string.isRequired,\n  mimetype: PropTypes.string.isRequired,\n  displayLayout: PropTypes.string.isRequired,\n  data: PropTypes.object,\n  updated: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n  onSelected: PropTypes.func,\n  updateFile: PropTypes.func.isRequired,\n  removeFile: PropTypes.func.isRequired,\n  selected: PropTypes.bool,\n  modalTargetRef: PropTypes.object.isRequired,\n  index: PropTypes.number.isRequired,\n  openEditInModal: PropTypes.bool\n};\n\nCardMedia.defaultProps = {\n  onSelected: () => {},\n  selected: false,\n  data: {},\n  updated: null,\n  openEditInModal: false\n};\n\nexport default CardMedia;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"CardMedia.js","names":["React","useState","useCallback","DeleteAction","PropTypes","getQuery","getMutation","useMutation","useApolloClient","useQuery","classnames","useToasts","Modal","createPortal","Link","DeleteIcon","EditIcon","EditMediaFile","bustUrl","CardMedia","onSelected","name","url","mimetype","id","selected","displayLayout","data","updated","modalTargetRef","updateFile","removeFile","index","openEditInModal","displayDeleteModal","setDisplayDeleteModal","displayEditModal","setDisplayEditModal","enableSaveButton","setEnableSaveButton","fileData","setFileData","addToast","deleteFile","type","extension","split","client","getEntitySchemas","schemaData","loading","schemaLoading","variables","identifier","deleteFileById","input","appearance","autoDismiss","error","message","handleRowClick","handleCheckboxToggle","e","preventDefault","stopPropagation","handleKeyDown","key","cardMediaClassNames","handleCloseModal","handleSaveButtonStatus","state","modalActions","textButton","callback","modifiers","handleFormSave","handleFileChange","file","handleStopPropagation","updatedFile","mutate","mutation","formData","update","cache","fileUpdated","writeQuery","query","result","console","createElement","Fragment","title","actions","onClose","onChange","fileId","current","deleteAction","itemName","className","role","tabIndex","onClick","onKeyDown","checked","src","alt","xmlns","width","height","viewBox","d","to","propTypes","string","isRequired","object","oneOfType","number","func","bool","defaultProps"],"sources":["../../../src/components/CardMedia/CardMedia.js"],"sourcesContent":["import React, { useState, useCallback } from 'react';\nimport { DeleteAction } from '@blaze-cms/admin';\nimport PropTypes from 'prop-types';\nimport { getQuery, getMutation } from '@blaze-cms/admin-ui-utils';\nimport { useMutation, useApolloClient, useQuery } from '@apollo/client';\nimport classnames from 'classnames';\nimport { useToasts } from '@blaze-react/toaster';\nimport Modal from '@blaze-react/modal';\nimport { createPortal } from 'react-dom';\nimport { Link } from 'react-router-dom';\nimport { DeleteIcon, EditIcon } from '@blaze-cms/plugin-page-builder-ui';\nimport EditMediaFile from '../EditMediaFile';\nimport bustUrl from '../../utils/bustUrl';\n\nconst CardMedia = ({\n  onSelected,\n  name,\n  url,\n  mimetype,\n  id,\n  selected,\n  displayLayout,\n  data,\n  updated,\n  modalTargetRef,\n  updateFile,\n  removeFile,\n  index,\n  openEditInModal\n}) => {\n  const [displayDeleteModal, setDisplayDeleteModal] = useState(false);\n  const [displayEditModal, setDisplayEditModal] = useState(false);\n  const [enableSaveButton, setEnableSaveButton] = useState(false);\n  const [fileData, setFileData] = useState(null);\n  const { addToast } = useToasts();\n  const [deleteFile] = useMutation(getMutation('DELETE_FILE_BY_ID'));\n  const [type, extension] = mimetype.split('/');\n  const client = useApolloClient();\n\n  const { data: { getEntitySchemas: [schemaData] = [] } = {}, loading: schemaLoading } = useQuery(\n    getQuery('GET_ENTITY_SCHEMA'),\n    {\n      variables: { identifier: 'file' }\n    }\n  );\n\n  const deleteFileById = async () => {\n    setDisplayDeleteModal(false);\n    try {\n      await deleteFile({ variables: { input: { id } } });\n      removeFile({ index });\n      addToast(`File: ${name} has been deleted`, { appearance: 'success', autoDismiss: true });\n    } catch (error) {\n      addToast(error.message, { appearance: 'error', autoDismiss: true });\n    }\n  };\n\n  const handleRowClick = () => onSelected({ id, url, name, data });\n\n  const handleCheckboxToggle = useCallback(\n    e => {\n      e.preventDefault();\n      e.stopPropagation();\n      onSelected({ id, url, name, data });\n    },\n    [id, url, name, data, onSelected]\n  );\n\n  const handleKeyDown = e => {\n    if (e.key === ' ' || e.key === 'Enter') {\n      e.preventDefault();\n      handleRowClick();\n    }\n  };\n\n  const cardMediaClassNames = classnames(\n    'card card--media-list card--media-list-row',\n    `card--media-${displayLayout}`,\n    { 'card--media-list--selected': selected }\n  );\n\n  const handleCloseModal = () => setDisplayEditModal(false);\n  const handleSaveButtonStatus = state => setEnableSaveButton(state);\n\n  const modalActions = [\n    { textButton: 'Cancel', callback: handleCloseModal, modifiers: ['cancel'] },\n    {\n      textButton: 'Apply',\n      callback: () => handleFormSave(),\n      modifiers: enableSaveButton ? [] : ['disabled']\n    }\n  ];\n\n  const handleFileChange = file => setFileData(file);\n\n  const handleStopPropagation = e => e.stopPropagation();\n\n  const handleFormSave = async () => {\n    try {\n      const {\n        data: { updateFile: updatedFile }\n      } = await client.mutate({\n        mutation: getMutation('UPDATE_FILE'),\n        variables: { input: fileData.formData },\n        update(cache, { data: { updateFile: fileUpdated } }) {\n          cache.writeQuery({\n            query: getQuery('GET_FILE_BY_ID'),\n            variables: { id },\n            data: { file: fileUpdated.result }\n          });\n        }\n      });\n\n      updateFile({ file: updatedFile.result, index });\n      addToast(`File: ${fileData.name} has been updated`, {\n        appearance: 'success',\n        autoDismiss: true\n      });\n    } catch (e) {\n      addToast(`File: ${fileData.name} has not been updated`, {\n        appearance: 'error',\n        autoDismiss: true\n      });\n      console.error(e); //eslint-disable-line\n    }\n    handleCloseModal();\n    setEnableSaveButton(false);\n  };\n\n  if (schemaLoading) return null;\n\n  return (\n    <>\n      {displayEditModal &&\n        createPortal(\n          <Modal title=\"Edit\" actions={modalActions} onClose={handleCloseModal}>\n            <EditMediaFile\n              onChange={handleFileChange}\n              fileId={id}\n              handleSaveButtonStatus={handleSaveButtonStatus}\n              handleFormSave={handleFormSave}\n              enableSaveButton={enableSaveButton}\n              schemaData={schemaData}\n            />\n          </Modal>,\n          modalTargetRef.current\n        )}\n\n      {displayDeleteModal &&\n        createPortal(\n          <DeleteAction\n            onClose={() => setDisplayDeleteModal(false)}\n            deleteAction={() => deleteFileById()}\n            itemName={name}\n          />,\n          modalTargetRef.current\n        )}\n\n      <div\n        className={cardMediaClassNames}\n        role=\"option\"\n        aria-selected={selected}\n        tabIndex={0}\n        onClick={handleRowClick}\n        onKeyDown={handleKeyDown}>\n        {openEditInModal && (\n          <div className=\"card__select\">\n            <input\n              type=\"checkbox\"\n              aria-label={`Select ${name}`}\n              checked={!!selected}\n              onChange={handleCheckboxToggle}\n              onClick={handleStopPropagation}\n            />\n          </div>\n        )}\n        {type === 'image' ? (\n          <div className={`card__image card__image--media-${displayLayout}`}>\n            <img src={bustUrl(url, updated)} alt={name} />\n          </div>\n        ) : (\n          <div className=\"card__image card__image--media-list-document\">\n            <svg\n              xmlns=\"http://www.w3.org/2000/svg\"\n              width=\"100\"\n              height=\"100\"\n              viewBox=\"0 0 8 8\"\n              aria-hidden=\"true\">\n              <path d=\"M0 0v8h7v-4h-4v-4h-3zm4 0v3h3l-3-3zm-3 2h1v1h-1v-1zm0 2h1v1h-1v-1zm0 2h4v1h-4v-1z\" />\n            </svg>\n          </div>\n        )}\n\n        <footer className={`card__footer card__footer--media-${displayLayout}`}>\n          <div className={`card__details card__details--media-${displayLayout}`}>\n            <div className={`card__title card__title--media-${displayLayout}`}>\n              <h2 className=\"card__file-name\">{name}</h2>\n            </div>\n            <p className=\"card__meta\">\n              <span>Format: {extension}</span>\n            </p>\n          </div>\n\n          <div className={`card__menu card__menu--icons card__menu--${displayLayout}`}>\n            {openEditInModal ? (\n              <button\n                type=\"button\"\n                className=\"card__icon-btn\"\n                title=\"Edit\"\n                aria-label=\"Edit\"\n                onClick={e => {\n                  e.preventDefault();\n                  e.stopPropagation();\n                  setDisplayEditModal(true);\n                }}>\n                <EditIcon width=\"20px\" height=\"20px\" />\n              </button>\n            ) : (\n              <Link\n                to={`/media/edit/${id}`}\n                className=\"card__icon-btn\"\n                title=\"Edit\"\n                aria-label=\"Edit\"\n                onClick={e => e.stopPropagation()}>\n                <EditIcon width=\"20px\" height=\"20px\" />\n              </Link>\n            )}\n\n            <button\n              type=\"button\"\n              className=\"card__icon-btn\"\n              title=\"Delete\"\n              aria-label=\"Delete\"\n              onClick={e => {\n                e.preventDefault();\n                e.stopPropagation();\n                setDisplayDeleteModal(true);\n              }}>\n              <DeleteIcon width=\"18px\" height=\"18px\" />\n            </button>\n          </div>\n        </footer>\n      </div>\n    </>\n  );\n};\n\nCardMedia.propTypes = {\n  name: PropTypes.string.isRequired,\n  url: PropTypes.string.isRequired,\n  id: PropTypes.string.isRequired,\n  mimetype: PropTypes.string.isRequired,\n  displayLayout: PropTypes.string.isRequired,\n  data: PropTypes.object,\n  updated: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n  onSelected: PropTypes.func,\n  updateFile: PropTypes.func.isRequired,\n  removeFile: PropTypes.func.isRequired,\n  selected: PropTypes.bool,\n  modalTargetRef: PropTypes.object.isRequired,\n  index: PropTypes.number.isRequired,\n  openEditInModal: PropTypes.bool\n};\n\nCardMedia.defaultProps = {\n  onSelected: () => { },\n  selected: false,\n  data: {},\n  updated: null,\n  openEditInModal: false\n};\n\nexport default CardMedia;\n"],"mappings":"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","ignoreList":[]}

package/lib-es/components/EditMediaFile/EditMediaFile.js

@@ -1,33 +1,32 @@
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-const _excluded = ["__typename"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 import React, { useState, useEffect } from 'react';
 import PropTypes from 'prop-types';
-import { getQuery } from '@blaze-cms/admin-ui-utils';
+import { getQuery, getDynamicQuery } from '@blaze-cms/admin-ui-utils';
 import { useQuery } from '@apollo/client';
 import { useToasts } from '@blaze-react/toaster';
 import FilePreview from '../FilePreview';
 import FileUploadModal from '../FileUploadModal';
-import { STORE_KEY, NAME } from '../../constants';
+import { FILE_DEFAULT_PROPS } from '../../constants';
 const EditMediaFile = ({
   onChange,
   handleSaveButtonStatus,
   fileId,
   showChangeButton,
-  fileUpdated
+  fileUpdated,
+  schemaData
 }) => {
   const [formValues, setFormValues] = useState(null);
   const [displayFileUploadModal, setDisplayFileUploadModal] = useState(false);
   const {
     addToast
   } = useToasts();
-  const fileQuery = getQuery('GET_FILE_BY_ID');
+  const fileQuery = getDynamicQuery('DATA_QUERY')(schemaData, fileId, null, FILE_DEFAULT_PROPS);
   const {
     loading,
     data: {
-      file
+      entityData: file
     } = {},
     refetch: refetchFile
   } = useQuery(fileQuery, {
@@ -67,45 +66,30 @@ const EditMediaFile = ({
     valuesChecked
   }) => {
     const baseFile = formValues || file;
-    const valuesCheckedWithoutName = valuesChecked.filter(({
-      id
-    }) => id !== NAME && id !== STORE_KEY);
-    const dataValues = valuesCheckedWithoutName.reduce((acc, {
+    const dataValues = valuesChecked.reduce((acc, {
       id,
-      value
+      value,
+      isDataPropery
     }) => {
-      acc[id] = value;
+      if (isDataPropery) {
+        acc.data[id] = value;
+      } else {
+        acc[id] = value;
+      }
       return acc;
-    }, {});
-    const {
-      value: newFileName
-    } = valuesChecked.find(({
-      id
-    }) => id === NAME) || {};
-    const {
-      value: storeKey
-    } = valuesChecked.find(({
-      id
-    }) => id === STORE_KEY) || {};
+    }, {
+      id: baseFile.id,
+      data: _objectSpread({}, baseFile.data)
+    });
+    delete dataValues.data.__typename; // Remove __typename if it exists in data to avoid issues with Apollo cache.
+
     const shouldEnableSaveButton = isNewValueSet && isValid;
     handleSaveButtonStatus(shouldEnableSaveButton);
-    const updatedFile = _objectSpread(_objectSpread({}, baseFile), {}, {
-      name: newFileName || baseFile.name,
-      storeKey: storeKey || baseFile.storeKey,
-      data: _objectSpread(_objectSpread({}, baseFile.data || {}), dataValues)
-    });
+    const updatedFile = _objectSpread(_objectSpread({}, baseFile), dataValues);
     setFormValues(updatedFile);
-    // Strip GraphQL metadata field __typename before passing data to onChange.
-    const _ref = updatedFile.data || {},
-      {
-        __typename
-      } = _ref,
-      cleanData = _objectWithoutProperties(_ref, _excluded);
-    onChange({
-      id: updatedFile.id,
-      name: updatedFile.name,
-      data: cleanData
-    });
+    onChange(_objectSpread(_objectSpread({}, updatedFile), {}, {
+      formData: dataValues
+    }));
   };
   const getFileWithStoreType = sourceFile => {
     const base = sourceFile || file;
@@ -155,7 +139,7 @@ const EditMediaFile = ({
   if (loading) return /*#__PURE__*/React.createElement("div", null, "loading...");
   const fileToRender = formValues || file;
   const fileWithStoreType = getFileWithStoreType(fileToRender);
-  return !loading ? /*#__PURE__*/React.createElement(React.Fragment, null, !!file && /*#__PURE__*/React.createElement(FilePreview, {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, !!file && /*#__PURE__*/React.createElement(FilePreview, {
     file: fileWithStoreType,
     handleFormChange: handleFormChange,
     handleChangeFile: () => setDisplayFileUploadModal(true),
@@ -170,7 +154,7 @@ const EditMediaFile = ({
     fileId: fileId,
     storeKey: file && file.storeKey,
     getSelectedFiles: () => {}
-  }))) : /*#__PURE__*/React.createElement("div", null, "loading...");
+  })));
 };
 EditMediaFile.propTypes = {
   fileId: PropTypes.string.isRequired,

package/lib-es/components/EditMediaFile/EditMediaFile.js.map

@@ -1 +1 @@
-{"version":3,"file":"EditMediaFile.js","names":["React","useState","useEffect","PropTypes","getQuery","useQuery","useToasts","FilePreview","FileUploadModal","STORE_KEY","NAME","EditMediaFile","onChange","handleSaveButtonStatus","fileId","showChangeButton","fileUpdated","formValues","setFormValues","displayFileUploadModal","setDisplayFileUploadModal","addToast","fileQuery","loading","data","file","refetch","refetchFile","variables","id","fetchPolicy","fileStoresType","getFileStores","storeType","visibleInAdmin","prevFormValues","updated","handleFormChange","isValid","isNewValueSet","valuesChecked","baseFile","valuesCheckedWithoutName","filter","dataValues","reduce","acc","value","newFileName","find","storeKey","shouldEnableSaveButton","updatedFile","_objectSpread","name","_ref","__typename","cleanData","_objectWithoutProperties","_excluded","getFileWithStoreType","sourceFile","base","storeOptions","map","type","key","defaultStore","isDefault","store","closeModalAndSetValue","isSaving","values","toastMessage","appearance","autoDismiss","url","refreshedFile","timestamp","Date","now","createElement","fileToRender","fileWithStoreType","Fragment","handleChangeFile","displayForm","className","onClose","simpleLayout","getSelectedFiles","propTypes","string","isRequired","func","bool","object","defaultProps"],"sources":["../../../src/components/EditMediaFile/EditMediaFile.js"],"sourcesContent":["import React, { useState, useEffect } from 'react';\nimport PropTypes from 'prop-types';\nimport { getQuery } from '@blaze-cms/admin-ui-utils';\nimport { useQuery } from '@apollo/client';\nimport { useToasts } from '@blaze-react/toaster';\nimport FilePreview from '../FilePreview';\nimport FileUploadModal from '../FileUploadModal';\nimport { STORE_KEY, NAME } from '../../constants';\n\nconst EditMediaFile = ({\n  onChange,\n  handleSaveButtonStatus,\n  fileId,\n  showChangeButton,\n  fileUpdated\n}) => {\n  const [formValues, setFormValues] = useState(null);\n  const [displayFileUploadModal, setDisplayFileUploadModal] = useState(false);\n  const { addToast } = useToasts();\n\n  const fileQuery = getQuery('GET_FILE_BY_ID');\n  const {\n    loading,\n    data: { file } = {},\n    refetch: refetchFile\n  } = useQuery(fileQuery, {\n    variables: { id: fileId },\n    fetchPolicy: 'cache-and-network'\n  });\n\n  const fileStoresType = getQuery('GET_FILE_STORES');\n  const { data: { getFileStores: storeType = [] } = {} } = useQuery(fileStoresType, {\n    variables: { visibleInAdmin: true }\n  });\n\n  useEffect(() => {\n    if (file) {\n      setFormValues(prevFormValues => {\n        if (!prevFormValues || prevFormValues.updated !== file.updated) {\n          return file;\n        }\n        return prevFormValues;\n      });\n    }\n  }, [file]);\n\n  useEffect(() => {\n    if (fileUpdated && fileUpdated.updated) {\n      setFormValues(fileUpdated);\n    }\n  }, [fileUpdated]);\n\n  const handleFormChange = ({ isValid, isNewValueSet, valuesChecked }) => {\n    const baseFile = formValues || file;\n    const valuesCheckedWithoutName = valuesChecked.filter(\n      ({ id }) => id !== NAME && id !== STORE_KEY\n    );\n\n    const dataValues = valuesCheckedWithoutName.reduce((acc, { id, value }) => {\n      acc[id] = value;\n      return acc;\n    }, {});\n\n    const { value: newFileName } = valuesChecked.find(({ id }) => id === NAME) || {};\n    const { value: storeKey } = valuesChecked.find(({ id }) => id === STORE_KEY) || {};\n\n    const shouldEnableSaveButton = isNewValueSet && isValid;\n    handleSaveButtonStatus(shouldEnableSaveButton);\n\n    const updatedFile = {\n      ...baseFile,\n      name: newFileName || baseFile.name,\n      storeKey: storeKey || baseFile.storeKey,\n      data: { ...(baseFile.data || {}), ...dataValues }\n    };\n\n    setFormValues(updatedFile);\n    // Strip GraphQL metadata field __typename before passing data to onChange.\n    const { __typename, ...cleanData } = updatedFile.data || {};\n    onChange({ id: updatedFile.id, name: updatedFile.name, data: cleanData });\n  };\n\n  const getFileWithStoreType = sourceFile => {\n    const base = sourceFile || file;\n    if (storeType && base) {\n      const storeOptions = storeType.map(type => [type.key, type.name]);\n      const defaultStore = storeType.find(type => type.isDefault) || null;\n      return { ...base, store: { defaultStore, storeOptions } };\n    }\n    return base;\n  };\n\n  const closeModalAndSetValue = async (isSaving, values, toastMessage) => {\n    if (toastMessage) {\n      addToast(toastMessage, { appearance: 'success', autoDismiss: true });\n    }\n\n    if (values) {\n      const updated =\n        values.id === fileId\n          ? values\n          : {\n              ...(formValues || file),\n              ...values,\n              url: values.url || (formValues || file).url\n            };\n      setFormValues(updated);\n      onChange(updated);\n      handleSaveButtonStatus(true);\n    } else {\n      const { data: { file: refreshedFile } = {} } = await refetchFile({\n        id: fileId,\n        timestamp: Date.now()\n      });\n      if (refreshedFile) {\n        setFormValues(refreshedFile);\n        onChange(refreshedFile);\n        handleSaveButtonStatus(true);\n      }\n    }\n\n    setDisplayFileUploadModal(false);\n  };\n\n  if (loading) return <div>loading...</div>;\n\n  const fileToRender = formValues || file;\n  const fileWithStoreType = getFileWithStoreType(fileToRender);\n\n  return !loading ? (\n    <>\n      {!!file && (\n        <FilePreview\n          file={fileWithStoreType}\n          handleFormChange={handleFormChange}\n          handleChangeFile={() => setDisplayFileUploadModal(true)}\n          displayForm\n          showChangeButton={showChangeButton}\n        />\n      )}\n      {displayFileUploadModal && (\n        <div className=\"file-upload-modal-wrapper\">\n          <FileUploadModal\n            onClose={() => setDisplayFileUploadModal(false)}\n            closeModalAndSetValue={closeModalAndSetValue}\n            simpleLayout\n            fileId={fileId}\n            storeKey={file && file.storeKey}\n            getSelectedFiles={() => {}}\n          />\n        </div>\n      )}\n    </>\n  ) : (\n    <div>loading...</div>\n  );\n};\n\nEditMediaFile.propTypes = {\n  fileId: PropTypes.string.isRequired,\n  onChange: PropTypes.func.isRequired,\n  handleSaveButtonStatus: PropTypes.func.isRequired,\n  showChangeButton: PropTypes.bool,\n  fileUpdated: PropTypes.object\n};\n\nEditMediaFile.defaultProps = {\n  showChangeButton: false,\n  fileUpdated: null\n};\n\nexport default EditMediaFile;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"EditMediaFile.js","names":["React","useState","useEffect","PropTypes","getQuery","getDynamicQuery","useQuery","useToasts","FilePreview","FileUploadModal","FILE_DEFAULT_PROPS","EditMediaFile","onChange","handleSaveButtonStatus","fileId","showChangeButton","fileUpdated","schemaData","formValues","setFormValues","displayFileUploadModal","setDisplayFileUploadModal","addToast","fileQuery","loading","data","entityData","file","refetch","refetchFile","variables","id","fetchPolicy","fileStoresType","getFileStores","storeType","visibleInAdmin","prevFormValues","updated","handleFormChange","isValid","isNewValueSet","valuesChecked","baseFile","dataValues","reduce","acc","value","isDataPropery","_objectSpread","__typename","shouldEnableSaveButton","updatedFile","formData","getFileWithStoreType","sourceFile","base","storeOptions","map","type","key","name","defaultStore","find","isDefault","store","closeModalAndSetValue","isSaving","values","toastMessage","appearance","autoDismiss","url","refreshedFile","timestamp","Date","now","createElement","fileToRender","fileWithStoreType","Fragment","handleChangeFile","displayForm","className","onClose","simpleLayout","storeKey","getSelectedFiles","propTypes","string","isRequired","func","bool","object","defaultProps"],"sources":["../../../src/components/EditMediaFile/EditMediaFile.js"],"sourcesContent":["import React, { useState, useEffect } from 'react';\nimport PropTypes from 'prop-types';\nimport { getQuery, getDynamicQuery } from '@blaze-cms/admin-ui-utils';\nimport { useQuery } from '@apollo/client';\nimport { useToasts } from '@blaze-react/toaster';\nimport FilePreview from '../FilePreview';\nimport FileUploadModal from '../FileUploadModal';\nimport { FILE_DEFAULT_PROPS } from '../../constants';\n\nconst EditMediaFile = ({\n  onChange,\n  handleSaveButtonStatus,\n  fileId,\n  showChangeButton,\n  fileUpdated,\n  schemaData\n}) => {\n  const [formValues, setFormValues] = useState(null);\n  const [displayFileUploadModal, setDisplayFileUploadModal] = useState(false);\n  const { addToast } = useToasts();\n\n  const fileQuery = getDynamicQuery('DATA_QUERY')(schemaData, fileId, null, FILE_DEFAULT_PROPS);\n  const {\n    loading,\n    data: { entityData: file } = {},\n    refetch: refetchFile\n  } = useQuery(fileQuery, {\n    variables: { id: fileId },\n    fetchPolicy: 'cache-and-network'\n  });\n\n  const fileStoresType = getQuery('GET_FILE_STORES');\n  const { data: { getFileStores: storeType = [] } = {} } = useQuery(fileStoresType, {\n    variables: { visibleInAdmin: true }\n  });\n\n  useEffect(() => {\n    if (file) {\n      setFormValues(prevFormValues => {\n        if (!prevFormValues || prevFormValues.updated !== file.updated) {\n          return file;\n        }\n        return prevFormValues;\n      });\n    }\n  }, [file]);\n\n  useEffect(() => {\n    if (fileUpdated && fileUpdated.updated) {\n      setFormValues(fileUpdated);\n    }\n  }, [fileUpdated]);\n\n  const handleFormChange = ({ isValid, isNewValueSet, valuesChecked }) => {\n    const baseFile = formValues || file;\n\n    const dataValues = valuesChecked.reduce(\n      (acc, { id, value, isDataPropery }) => {\n        if (isDataPropery) {\n          acc.data[id] = value;\n        } else {\n          acc[id] = value;\n        }\n        return acc;\n      },\n      { id: baseFile.id, data: { ...baseFile.data } }\n    );\n    delete dataValues.data.__typename; // Remove __typename if it exists in data to avoid issues with Apollo cache.\n\n    const shouldEnableSaveButton = isNewValueSet && isValid;\n    handleSaveButtonStatus(shouldEnableSaveButton);\n\n    const updatedFile = {\n      ...baseFile,\n      ...dataValues\n    };\n\n    setFormValues(updatedFile);\n    onChange({ ...updatedFile, formData: dataValues });\n  };\n\n  const getFileWithStoreType = sourceFile => {\n    const base = sourceFile || file;\n    if (storeType && base) {\n      const storeOptions = storeType.map(type => [type.key, type.name]);\n      const defaultStore = storeType.find(type => type.isDefault) || null;\n      return { ...base, store: { defaultStore, storeOptions } };\n    }\n    return base;\n  };\n\n  const closeModalAndSetValue = async (isSaving, values, toastMessage) => {\n    if (toastMessage) {\n      addToast(toastMessage, { appearance: 'success', autoDismiss: true });\n    }\n\n    if (values) {\n      const updated =\n        values.id === fileId\n          ? values\n          : {\n            ...(formValues || file),\n            ...values,\n            url: values.url || (formValues || file).url\n          };\n      setFormValues(updated);\n      onChange(updated);\n      handleSaveButtonStatus(true);\n    } else {\n      const { data: { file: refreshedFile } = {} } = await refetchFile({\n        id: fileId,\n        timestamp: Date.now()\n      });\n      if (refreshedFile) {\n        setFormValues(refreshedFile);\n        onChange(refreshedFile);\n        handleSaveButtonStatus(true);\n      }\n    }\n\n    setDisplayFileUploadModal(false);\n  };\n\n  if (loading) return <div>loading...</div>;\n\n  const fileToRender = formValues || file;\n  const fileWithStoreType = getFileWithStoreType(fileToRender);\n\n  return (\n    <>\n      {!!file && (\n        <FilePreview\n          file={fileWithStoreType}\n          handleFormChange={handleFormChange}\n          handleChangeFile={() => setDisplayFileUploadModal(true)}\n          displayForm\n          showChangeButton={showChangeButton}\n        />\n      )}\n      {displayFileUploadModal && (\n        <div className=\"file-upload-modal-wrapper\">\n          <FileUploadModal\n            onClose={() => setDisplayFileUploadModal(false)}\n            closeModalAndSetValue={closeModalAndSetValue}\n            simpleLayout\n            fileId={fileId}\n            storeKey={file && file.storeKey}\n            getSelectedFiles={() => { }}\n          />\n        </div>\n      )}\n    </>\n  );\n};\n\nEditMediaFile.propTypes = {\n  fileId: PropTypes.string.isRequired,\n  onChange: PropTypes.func.isRequired,\n  handleSaveButtonStatus: PropTypes.func.isRequired,\n  showChangeButton: PropTypes.bool,\n  fileUpdated: PropTypes.object\n};\n\nEditMediaFile.defaultProps = {\n  showChangeButton: false,\n  fileUpdated: null\n};\n\nexport default EditMediaFile;\n"],"mappings":"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","ignoreList":[]}

package/lib-es/components/EditMediaFile/EditMediaFilePage.js

@@ -2,7 +2,7 @@ import React, { useState } from 'react';
 import { withRouter } from 'react-router-dom';
 import PropTypes from 'prop-types';
 import Button from '@blaze-react/button';
-import { useApolloClient } from '@apollo/client';
+import { useApolloClient, useQuery } from '@apollo/client';
 import { getQuery, getMutation } from '@blaze-cms/admin-ui-utils';
 import { useToasts } from '@blaze-react/toaster';
 import EditMediaFile from './EditMediaFile';
@@ -16,6 +16,16 @@ const EditMediaFilePage = ({
   const {
     addToast
   } = useToasts();
+  const {
+    data: {
+      getEntitySchemas: [schemaData] = []
+    } = {},
+    loading: schemaLoading
+  } = useQuery(getQuery('GET_ENTITY_SCHEMA'), {
+    variables: {
+      identifier: 'file'
+    }
+  });
   const handleFileChange = values => setFile(values);
   const handleSaveButtonStatus = value => {
     setShouldEnableSaveButton(value);
@@ -29,12 +39,7 @@ const EditMediaFilePage = ({
       return;
     }
     try {
-      const inputData = {
-        id: file.id,
-        name: file.name,
-        data: file.data,
-        storeKey: file.storeKey
-      };
+      const inputData = file.formData;
       const {
         data: {
           updateFile: updatedFile
@@ -79,6 +84,7 @@ const EditMediaFilePage = ({
   };
   const pushBack = () => history.push('/media');
   const buttonModifiers = shouldEnableSaveButton ? [] : ['disabled'];
+  if (schemaLoading) return null;
   return /*#__PURE__*/React.createElement("div", {
     className: "page"
   }, /*#__PURE__*/React.createElement("div", {
@@ -91,7 +97,8 @@ const EditMediaFilePage = ({
     handleSaveButtonStatus: handleSaveButtonStatus,
     handleFormSave: handleFormSave,
     showChangeButton: true,
-    fileUpdated: file
+    fileUpdated: file,
+    schemaData: schemaData
   }), /*#__PURE__*/React.createElement("div", {
     className: "page__content__mediaWrapperActions"
   }, /*#__PURE__*/React.createElement(Button, {

package/lib-es/components/EditMediaFile/EditMediaFilePage.js.map

@@ -1 +1 @@
-{"version":3,"file":"EditMediaFilePage.js","names":["React","useState","withRouter","PropTypes","Button","useApolloClient","getQuery","getMutation","useToasts","EditMediaFile","EditMediaFilePage","match","history","shouldEnableSaveButton","setShouldEnableSaveButton","file","setFile","client","addToast","handleFileChange","values","handleSaveButtonStatus","value","handleFormSave","appearance","autoDismiss","inputData","id","name","data","storeKey","updateFile","updatedFile","mutate","mutation","variables","input","update","cache","fileUpdated","writeQuery","query","params","fileId","result","e","console","error","pushBack","push","buttonModifiers","createElement","className","onChange","showChangeButton","onClick","modifiers","propTypes","object","isRequired"],"sources":["../../../src/components/EditMediaFile/EditMediaFilePage.js"],"sourcesContent":["import React, { useState } from 'react';\nimport { withRouter } from 'react-router-dom';\nimport PropTypes from 'prop-types';\nimport Button from '@blaze-react/button';\nimport { useApolloClient } from '@apollo/client';\nimport { getQuery, getMutation } from '@blaze-cms/admin-ui-utils';\nimport { useToasts } from '@blaze-react/toaster';\nimport EditMediaFile from './EditMediaFile';\n\nconst EditMediaFilePage = ({ match, history }) => {\n  const [shouldEnableSaveButton, setShouldEnableSaveButton] = useState(false);\n  const [file, setFile] = useState(null);\n  const client = useApolloClient();\n  const { addToast } = useToasts();\n\n  const handleFileChange = values => setFile(values);\n\n  const handleSaveButtonStatus = value => {\n    setShouldEnableSaveButton(value);\n  };\n\n  const handleFormSave = async () => {\n    if (!file) {\n      addToast('No file data to update', {\n        appearance: 'error',\n        autoDismiss: true\n      });\n      return;\n    }\n\n    try {\n      const inputData = {\n        id: file.id,\n        name: file.name,\n        data: file.data,\n        storeKey: file.storeKey\n      };\n\n      const {\n        data: { updateFile: updatedFile }\n      } = await client.mutate({\n        mutation: getMutation('UPDATE_FILE'),\n        variables: {\n          input: inputData\n        },\n        update(cache, { data: { updateFile: fileUpdated } }) {\n          try {\n            cache.writeQuery({\n              query: getQuery('GET_FILE_BY_ID'),\n              variables: { id: match.params.fileId },\n              data: { file: fileUpdated.result }\n            });\n          } catch (e) {\n            console.error(e); //eslint-disable-line\n          }\n        }\n      });\n\n      setFile(updatedFile.result);\n\n      addToast(`File: ${file.name} has been updated`, {\n        appearance: 'success',\n        autoDismiss: true\n      });\n    } catch (e) {\n      addToast(`File: ${file.name} has not been updated`, {\n        appearance: 'error',\n        autoDismiss: true\n      });\n    }\n    setShouldEnableSaveButton(false);\n  };\n\n  const pushBack = () => history.push('/media');\n\n  const buttonModifiers = shouldEnableSaveButton ? [] : ['disabled'];\n\n  return (\n    <div className=\"page\">\n      <div className=\"page__content\">\n        <div className=\"page__content__mediaWrapper\">\n          <EditMediaFile\n            onChange={handleFileChange}\n            fileId={match.params.fileId}\n            handleSaveButtonStatus={handleSaveButtonStatus}\n            handleFormSave={handleFormSave}\n            showChangeButton\n            fileUpdated={file}\n          />\n          <div className=\"page__content__mediaWrapperActions\">\n            <Button onClick={pushBack}>Cancel</Button>\n            <Button onClick={handleFormSave} modifiers={buttonModifiers}>\n              Apply\n            </Button>\n          </div>\n        </div>\n      </div>\n    </div>\n  );\n};\n\nEditMediaFilePage.propTypes = {\n  match: PropTypes.object.isRequired,\n  history: PropTypes.object.isRequired\n};\n\nexport default withRouter(EditMediaFilePage);\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"EditMediaFilePage.js","names":["React","useState","withRouter","PropTypes","Button","useApolloClient","useQuery","getQuery","getMutation","useToasts","EditMediaFile","EditMediaFilePage","match","history","shouldEnableSaveButton","setShouldEnableSaveButton","file","setFile","client","addToast","data","getEntitySchemas","schemaData","loading","schemaLoading","variables","identifier","handleFileChange","values","handleSaveButtonStatus","value","handleFormSave","appearance","autoDismiss","inputData","formData","updateFile","updatedFile","mutate","mutation","input","update","cache","fileUpdated","writeQuery","query","id","params","fileId","result","e","console","error","name","pushBack","push","buttonModifiers","createElement","className","onChange","showChangeButton","onClick","modifiers","propTypes","object","isRequired"],"sources":["../../../src/components/EditMediaFile/EditMediaFilePage.js"],"sourcesContent":["import React, { useState } from 'react';\nimport { withRouter } from 'react-router-dom';\nimport PropTypes from 'prop-types';\nimport Button from '@blaze-react/button';\nimport { useApolloClient, useQuery } from '@apollo/client';\nimport { getQuery, getMutation } from '@blaze-cms/admin-ui-utils';\nimport { useToasts } from '@blaze-react/toaster';\nimport EditMediaFile from './EditMediaFile';\n\nconst EditMediaFilePage = ({ match, history }) => {\n  const [shouldEnableSaveButton, setShouldEnableSaveButton] = useState(false);\n  const [file, setFile] = useState(null);\n  const client = useApolloClient();\n  const { addToast } = useToasts();\n\n  const { data: { getEntitySchemas: [schemaData] = [] } = {}, loading: schemaLoading } = useQuery(\n    getQuery('GET_ENTITY_SCHEMA'),\n    {\n      variables: { identifier: 'file' }\n    }\n  );\n\n  const handleFileChange = values => setFile(values);\n\n  const handleSaveButtonStatus = value => {\n    setShouldEnableSaveButton(value);\n  };\n\n  const handleFormSave = async () => {\n    if (!file) {\n      addToast('No file data to update', {\n        appearance: 'error',\n        autoDismiss: true\n      });\n      return;\n    }\n\n    try {\n      const inputData = file.formData;\n\n      const {\n        data: { updateFile: updatedFile }\n      } = await client.mutate({\n        mutation: getMutation('UPDATE_FILE'),\n        variables: {\n          input: inputData\n        },\n        update(cache, { data: { updateFile: fileUpdated } }) {\n          try {\n            cache.writeQuery({\n              query: getQuery('GET_FILE_BY_ID'),\n              variables: { id: match.params.fileId },\n              data: { file: fileUpdated.result }\n            });\n          } catch (e) {\n            console.error(e); //eslint-disable-line\n          }\n        }\n      });\n\n      setFile(updatedFile.result);\n\n      addToast(`File: ${file.name} has been updated`, {\n        appearance: 'success',\n        autoDismiss: true\n      });\n    } catch (e) {\n      addToast(`File: ${file.name} has not been updated`, {\n        appearance: 'error',\n        autoDismiss: true\n      });\n    }\n    setShouldEnableSaveButton(false);\n  };\n\n  const pushBack = () => history.push('/media');\n\n  const buttonModifiers = shouldEnableSaveButton ? [] : ['disabled'];\n\n  if (schemaLoading) return null;\n\n  return (\n    <div className=\"page\">\n      <div className=\"page__content\">\n        <div className=\"page__content__mediaWrapper\">\n          <EditMediaFile\n            onChange={handleFileChange}\n            fileId={match.params.fileId}\n            handleSaveButtonStatus={handleSaveButtonStatus}\n            handleFormSave={handleFormSave}\n            showChangeButton\n            fileUpdated={file}\n            schemaData={schemaData}\n          />\n          <div className=\"page__content__mediaWrapperActions\">\n            <Button onClick={pushBack}>Cancel</Button>\n            <Button onClick={handleFormSave} modifiers={buttonModifiers}>\n              Apply\n            </Button>\n          </div>\n        </div>\n      </div>\n    </div>\n  );\n};\n\nEditMediaFilePage.propTypes = {\n  match: PropTypes.object.isRequired,\n  history: PropTypes.object.isRequired\n};\n\nexport default withRouter(EditMediaFilePage);\n"],"mappings":"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","ignoreList":[]}