@blaze-cms/plugin-media-ui 0.146.0-node18-core-styles-tooltips.45 → 0.146.0-node18-core-styles-tooltips.46

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (158) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/lib-es/components/CardMedia/CardMedia.js +233 -0
  3. package/lib-es/components/CardMedia/CardMedia.js.map +1 -0
  4. package/lib-es/components/CardMedia/index.js +3 -0
  5. package/lib-es/components/CardMedia/index.js.map +1 -0
  6. package/lib-es/components/EditMediaFile/EditMediaFile.js +187 -0
  7. package/lib-es/components/EditMediaFile/EditMediaFile.js.map +1 -0
  8. package/lib-es/components/EditMediaFile/EditMediaFilePage.js +109 -0
  9. package/lib-es/components/EditMediaFile/EditMediaFilePage.js.map +1 -0
  10. package/lib-es/components/EditMediaFile/index.js +3 -0
  11. package/lib-es/components/EditMediaFile/index.js.map +1 -0
  12. package/lib-es/components/EditorAdapter/EditorAdapter.js +48 -0
  13. package/lib-es/components/EditorAdapter/EditorAdapter.js.map +1 -0
  14. package/lib-es/components/EditorAdapter/index.js +3 -0
  15. package/lib-es/components/EditorAdapter/index.js.map +1 -0
  16. package/lib-es/components/FileList/FilesListContext/index.js +4 -0
  17. package/lib-es/components/FileList/FilesListContext/index.js.map +1 -0
  18. package/lib-es/components/FileList/FilesListProvider/index.js +36 -0
  19. package/lib-es/components/FileList/FilesListProvider/index.js.map +1 -0
  20. package/lib-es/components/FileList/useFileList/index.js +5 -0
  21. package/lib-es/components/FileList/useFileList/index.js.map +1 -0
  22. package/lib-es/components/FileList/useGetFiles/getFiles.js +179 -0
  23. package/lib-es/components/FileList/useGetFiles/getFiles.js.map +1 -0
  24. package/lib-es/components/FileList/useGetFiles/index.js +3 -0
  25. package/lib-es/components/FileList/useGetFiles/index.js.map +1 -0
  26. package/lib-es/components/FileList/useGetFiles/useGetFiles.js +114 -0
  27. package/lib-es/components/FileList/useGetFiles/useGetFiles.js.map +1 -0
  28. package/lib-es/components/FileList/useGetFilesList/getCounters.js +11 -0
  29. package/lib-es/components/FileList/useGetFilesList/getCounters.js.map +1 -0
  30. package/lib-es/components/FileList/useGetFilesList/index.js +3 -0
  31. package/lib-es/components/FileList/useGetFilesList/index.js.map +1 -0
  32. package/lib-es/components/FileList/useGetFilesList/useGetFilesList.js +172 -0
  33. package/lib-es/components/FileList/useGetFilesList/useGetFilesList.js.map +1 -0
  34. package/lib-es/components/FilePreview/Actions/index.js +38 -0
  35. package/lib-es/components/FilePreview/Actions/index.js.map +1 -0
  36. package/lib-es/components/FilePreview/Image/Image.js +40 -0
  37. package/lib-es/components/FilePreview/Image/Image.js.map +1 -0
  38. package/lib-es/components/FilePreview/Image/RawImage.js +31 -0
  39. package/lib-es/components/FilePreview/Image/RawImage.js.map +1 -0
  40. package/lib-es/components/FilePreview/Image/imageSchema.js +53 -0
  41. package/lib-es/components/FilePreview/Image/imageSchema.js.map +1 -0
  42. package/lib-es/components/FilePreview/Image/index.js +12 -0
  43. package/lib-es/components/FilePreview/Image/index.js.map +1 -0
  44. package/lib-es/components/FilePreview/ModalContext.js +3 -0
  45. package/lib-es/components/FilePreview/ModalContext.js.map +1 -0
  46. package/lib-es/components/FilePreview/PDF/PDF.js +49 -0
  47. package/lib-es/components/FilePreview/PDF/PDF.js.map +1 -0
  48. package/lib-es/components/FilePreview/PDF/RawPDF.js +33 -0
  49. package/lib-es/components/FilePreview/PDF/RawPDF.js.map +1 -0
  50. package/lib-es/components/FilePreview/PDF/index.js +12 -0
  51. package/lib-es/components/FilePreview/PDF/index.js.map +1 -0
  52. package/lib-es/components/FilePreview/PDF/schema.js +21 -0
  53. package/lib-es/components/FilePreview/PDF/schema.js.map +1 -0
  54. package/lib-es/components/FilePreview/get-preview.js +28 -0
  55. package/lib-es/components/FilePreview/get-preview.js.map +1 -0
  56. package/lib-es/components/FilePreview/index.js +104 -0
  57. package/lib-es/components/FilePreview/index.js.map +1 -0
  58. package/lib-es/components/FilePreview/previewDefault/PreviewDefault.js +41 -0
  59. package/lib-es/components/FilePreview/previewDefault/PreviewDefault.js.map +1 -0
  60. package/lib-es/components/FilePreview/previewDefault/RawPreviewDefault.js +39 -0
  61. package/lib-es/components/FilePreview/previewDefault/RawPreviewDefault.js.map +1 -0
  62. package/lib-es/components/FilePreview/previewDefault/icons/DefaultIcon.js +121 -0
  63. package/lib-es/components/FilePreview/previewDefault/icons/DefaultIcon.js.map +1 -0
  64. package/lib-es/components/FilePreview/previewDefault/icons/index.js +3 -0
  65. package/lib-es/components/FilePreview/previewDefault/icons/index.js.map +1 -0
  66. package/lib-es/components/FilePreview/previewDefault/index.js +12 -0
  67. package/lib-es/components/FilePreview/previewDefault/index.js.map +1 -0
  68. package/lib-es/components/FilePreview/previewDefault/previewDefaultSchema.js +25 -0
  69. package/lib-es/components/FilePreview/previewDefault/previewDefaultSchema.js.map +1 -0
  70. package/lib-es/components/FilePreviewReadOnly/FileList.js +18 -0
  71. package/lib-es/components/FilePreviewReadOnly/FileList.js.map +1 -0
  72. package/lib-es/components/FilePreviewReadOnly/FilePreviewList.js +22 -0
  73. package/lib-es/components/FilePreviewReadOnly/FilePreviewList.js.map +1 -0
  74. package/lib-es/components/FilePreviewReadOnly/FilePreviewReadOnly.js +68 -0
  75. package/lib-es/components/FilePreviewReadOnly/FilePreviewReadOnly.js.map +1 -0
  76. package/lib-es/components/FilePreviewReadOnly/index.js +3 -0
  77. package/lib-es/components/FilePreviewReadOnly/index.js.map +1 -0
  78. package/lib-es/components/FilePreviewReadOnly/mappers/format-initial-value.js +11 -0
  79. package/lib-es/components/FilePreviewReadOnly/mappers/format-initial-value.js.map +1 -0
  80. package/lib-es/components/FilePreviewReadOnly/mappers/index.js +3 -0
  81. package/lib-es/components/FilePreviewReadOnly/mappers/index.js.map +1 -0
  82. package/lib-es/components/FileUploadAdapter/FileList.js +52 -0
  83. package/lib-es/components/FileUploadAdapter/FileList.js.map +1 -0
  84. package/lib-es/components/FileUploadAdapter/FilePreviewList.js +22 -0
  85. package/lib-es/components/FileUploadAdapter/FilePreviewList.js.map +1 -0
  86. package/lib-es/components/FileUploadAdapter/FileReorderList.js +32 -0
  87. package/lib-es/components/FileUploadAdapter/FileReorderList.js.map +1 -0
  88. package/lib-es/components/FileUploadAdapter/FileReorderListItem.js +24 -0
  89. package/lib-es/components/FileUploadAdapter/FileReorderListItem.js.map +1 -0
  90. package/lib-es/components/FileUploadAdapter/FileUploadAdapter.js +391 -0
  91. package/lib-es/components/FileUploadAdapter/FileUploadAdapter.js.map +1 -0
  92. package/lib-es/components/FileUploadAdapter/index.js +3 -0
  93. package/lib-es/components/FileUploadAdapter/index.js.map +1 -0
  94. package/lib-es/components/FileUploadAdapter/mappers/format-initial-value.js +11 -0
  95. package/lib-es/components/FileUploadAdapter/mappers/format-initial-value.js.map +1 -0
  96. package/lib-es/components/FileUploadAdapter/mappers/get-button-text.js +11 -0
  97. package/lib-es/components/FileUploadAdapter/mappers/get-button-text.js.map +1 -0
  98. package/lib-es/components/FileUploadAdapter/mappers/get-format.js +12 -0
  99. package/lib-es/components/FileUploadAdapter/mappers/get-format.js.map +1 -0
  100. package/lib-es/components/FileUploadAdapter/mappers/get-number-files-pending-to-fetch.js +7 -0
  101. package/lib-es/components/FileUploadAdapter/mappers/get-number-files-pending-to-fetch.js.map +1 -0
  102. package/lib-es/components/FileUploadAdapter/mappers/index.js +8 -0
  103. package/lib-es/components/FileUploadAdapter/mappers/index.js.map +1 -0
  104. package/lib-es/components/FileUploadAdapter/mappers/is-unselecting.js +2 -0
  105. package/lib-es/components/FileUploadAdapter/mappers/is-unselecting.js.map +1 -0
  106. package/lib-es/components/FileUploadAdapter/mappers/transform-to-array.js +2 -0
  107. package/lib-es/components/FileUploadAdapter/mappers/transform-to-array.js.map +1 -0
  108. package/lib-es/components/FileUploadAdapter/useLimit.js +13 -0
  109. package/lib-es/components/FileUploadAdapter/useLimit.js.map +1 -0
  110. package/lib-es/components/FileUploadModal/FileUploadModal.js +178 -0
  111. package/lib-es/components/FileUploadModal/FileUploadModal.js.map +1 -0
  112. package/lib-es/components/FileUploadModal/index.js +3 -0
  113. package/lib-es/components/FileUploadModal/index.js.map +1 -0
  114. package/lib-es/components/FilterPanel/FilterPanel.js +135 -0
  115. package/lib-es/components/FilterPanel/FilterPanel.js.map +1 -0
  116. package/lib-es/components/FilterPanel/index.js +3 -0
  117. package/lib-es/components/FilterPanel/index.js.map +1 -0
  118. package/lib-es/components/ListingContainer/Listing/Listing.js +70 -0
  119. package/lib-es/components/ListingContainer/Listing/Listing.js.map +1 -0
  120. package/lib-es/components/ListingContainer/Listing/MediaListing/MediaFileList/MediaFileList.js +153 -0
  121. package/lib-es/components/ListingContainer/Listing/MediaListing/MediaFileList/MediaFileList.js.map +1 -0
  122. package/lib-es/components/ListingContainer/Listing/MediaListing/MediaFileList/index.js +3 -0
  123. package/lib-es/components/ListingContainer/Listing/MediaListing/MediaFileList/index.js.map +1 -0
  124. package/lib-es/components/ListingContainer/Listing/MediaListing/MediaListing.js +33 -0
  125. package/lib-es/components/ListingContainer/Listing/MediaListing/MediaListing.js.map +1 -0
  126. package/lib-es/components/ListingContainer/Listing/MediaListing/index.js +3 -0
  127. package/lib-es/components/ListingContainer/Listing/MediaListing/index.js.map +1 -0
  128. package/lib-es/components/ListingContainer/Listing/index.js +3 -0
  129. package/lib-es/components/ListingContainer/Listing/index.js.map +1 -0
  130. package/lib-es/components/ListingContainer/ListingContainer.js +115 -0
  131. package/lib-es/components/ListingContainer/ListingContainer.js.map +1 -0
  132. package/lib-es/components/ListingContainer/index.js +3 -0
  133. package/lib-es/components/ListingContainer/index.js.map +1 -0
  134. package/lib-es/components/ListingContainer/mappers/exist-previous.js +3 -0
  135. package/lib-es/components/ListingContainer/mappers/exist-previous.js.map +1 -0
  136. package/lib-es/components/ListingContainer/mappers/index.js +3 -0
  137. package/lib-es/components/ListingContainer/mappers/index.js.map +1 -0
  138. package/lib-es/components/MediaListing.js +29 -0
  139. package/lib-es/components/MediaListing.js.map +1 -0
  140. package/lib-es/constants.js +36 -0
  141. package/lib-es/constants.js.map +1 -0
  142. package/lib-es/icons/MediaLibraryIcon.js +70 -0
  143. package/lib-es/icons/MediaLibraryIcon.js.map +1 -0
  144. package/lib-es/icons/index.js +3 -0
  145. package/lib-es/icons/index.js.map +1 -0
  146. package/lib-es/index.js +61 -0
  147. package/lib-es/index.js.map +1 -0
  148. package/lib-es/utils/available-filters/available-filters.js +26 -0
  149. package/lib-es/utils/available-filters/available-filters.js.map +1 -0
  150. package/lib-es/utils/bustUrl.js +7 -0
  151. package/lib-es/utils/bustUrl.js.map +1 -0
  152. package/lib-es/utils/media-context/index.js +4 -0
  153. package/lib-es/utils/media-context/index.js.map +1 -0
  154. package/lib-es/utils/media-context/media-context.js +6 -0
  155. package/lib-es/utils/media-context/media-context.js.map +1 -0
  156. package/lib-es/utils/media-context/useMediaContext.js +4 -0
  157. package/lib-es/utils/media-context/useMediaContext.js.map +1 -0
  158. package/package.json +9 -8
package/CHANGELOG.md CHANGED
@@ -3,6 +3,14 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ # [0.146.0-node18-core-styles-tooltips.46](https://github.com/thebyte9/blaze/compare/v0.146.0-node18-core-styles-tooltips.45...v0.146.0-node18-core-styles-tooltips.46) (2026-01-16)
7
+
8
+ **Note:** Version bump only for package @blaze-cms/plugin-media-ui
9
+
10
+
11
+
12
+
13
+
6
14
  # [0.146.0-node18-core-styles-tooltips.45](https://github.com/thebyte9/blaze/compare/v0.146.0-node18-core-styles-tooltips.44...v0.146.0-node18-core-styles-tooltips.45) (2026-01-15)
7
15
 
8
16
  **Note:** Version bump only for package @blaze-cms/plugin-media-ui
@@ -0,0 +1,233 @@
1
+ import React, { useState } from 'react';
2
+ import More from '@blaze-react/more';
3
+ import Button from '@blaze-react/button';
4
+ import { DeleteAction } from '@blaze-cms/admin';
5
+ import PropTypes from 'prop-types';
6
+ import { getQuery, getMutation } from '@blaze-cms/admin-ui-utils';
7
+ import { useMutation, useApolloClient } from '@apollo/client';
8
+ import classnames from 'classnames';
9
+ import { useToasts } from '@blaze-react/toaster';
10
+ import Modal from '@blaze-react/modal';
11
+ import { createPortal } from 'react-dom';
12
+ import { Link } from 'react-router-dom';
13
+ import EditMediaFile from '../EditMediaFile';
14
+ import bustUrl from '../../utils/bustUrl';
15
+ const CardMedia = ({
16
+ onSelected,
17
+ name,
18
+ url,
19
+ mimetype,
20
+ id,
21
+ selected,
22
+ displayLayout,
23
+ data,
24
+ updated,
25
+ modalTargetRef,
26
+ updateFile,
27
+ removeFile,
28
+ index,
29
+ openEditInModal
30
+ }) => {
31
+ const [displayDeleteModal, setDisplayDeleteModal] = useState(false);
32
+ const [displayEditModal, setDisplayEditModal] = useState(false);
33
+ const [enableSaveButton, setEnableSaveButton] = useState(false);
34
+ const [fileData, setFileData] = useState(null);
35
+ const {
36
+ addToast
37
+ } = useToasts();
38
+ const [deleteFile] = useMutation(getMutation('DELETE_FILE_BY_ID'));
39
+ const [type, extension] = mimetype.split('/');
40
+ const client = useApolloClient();
41
+ const deleteFileById = async () => {
42
+ setDisplayDeleteModal(false);
43
+ try {
44
+ await deleteFile({
45
+ variables: {
46
+ input: {
47
+ id
48
+ }
49
+ }
50
+ });
51
+ removeFile({
52
+ index
53
+ });
54
+ addToast(`File: ${name} has been deleted`, {
55
+ appearance: 'success',
56
+ autoDismiss: true
57
+ });
58
+ } catch (error) {
59
+ addToast(error.message, {
60
+ appearance: 'error',
61
+ autoDismiss: true
62
+ });
63
+ }
64
+ };
65
+ const handleClick = () => {
66
+ onSelected({
67
+ id,
68
+ url,
69
+ name,
70
+ data
71
+ });
72
+ };
73
+ const cardMediaClassNames = classnames('card card--media-list', {
74
+ 'card--media-list--selected': selected,
75
+ [`card--media-${displayLayout}`]: displayLayout
76
+ });
77
+ const handleCloseModal = () => {
78
+ setDisplayEditModal(false);
79
+ };
80
+ const handleSaveButtonStatus = state => {
81
+ setEnableSaveButton(state);
82
+ };
83
+ const modalActions = [{
84
+ textButton: 'Cancel',
85
+ callback: handleCloseModal,
86
+ modifiers: ['cancel']
87
+ }, {
88
+ textButton: 'Apply',
89
+ callback: () => handleFormSave(),
90
+ modifiers: enableSaveButton ? [] : ['disabled']
91
+ }];
92
+ const handleFileChange = file => {
93
+ setFileData(file);
94
+ };
95
+ const handleFormSave = async () => {
96
+ try {
97
+ const {
98
+ data: {
99
+ updateFile: updatedFile
100
+ }
101
+ } = await client.mutate({
102
+ mutation: getMutation('UPDATE_FILE'),
103
+ variables: {
104
+ input: fileData
105
+ },
106
+ update(cache, {
107
+ data: {
108
+ updateFile: fileUpdated
109
+ }
110
+ }) {
111
+ cache.writeQuery({
112
+ query: getQuery('GET_FILE_BY_ID'),
113
+ variables: {
114
+ id
115
+ },
116
+ data: {
117
+ file: fileUpdated.result
118
+ }
119
+ });
120
+ }
121
+ });
122
+ updateFile({
123
+ file: updatedFile.result,
124
+ index
125
+ });
126
+ addToast(`File: ${fileData.name} has been updated`, {
127
+ appearance: 'success',
128
+ autoDismiss: true
129
+ });
130
+ } catch (e) {
131
+ addToast(`File: ${fileData.name} has not been updated`, {
132
+ appearance: 'error',
133
+ autoDismiss: true
134
+ });
135
+ console.error(e); //eslint-disable-line
136
+ }
137
+ handleCloseModal();
138
+ setEnableSaveButton(false);
139
+ };
140
+ return /*#__PURE__*/React.createElement(React.Fragment, null, displayEditModal && createPortal(/*#__PURE__*/React.createElement(Modal, {
141
+ title: "Edit",
142
+ actions: modalActions,
143
+ onClose: handleCloseModal
144
+ }, /*#__PURE__*/React.createElement(EditMediaFile, {
145
+ onChange: handleFileChange,
146
+ fileId: id,
147
+ handleSaveButtonStatus: handleSaveButtonStatus,
148
+ handleFormSave: handleFormSave,
149
+ enableSaveButton: enableSaveButton
150
+ })), modalTargetRef.current), /*#__PURE__*/React.createElement("div", {
151
+ className: cardMediaClassNames,
152
+ role: "button",
153
+ onClick: handleClick
154
+ }, displayDeleteModal && createPortal(/*#__PURE__*/React.createElement(DeleteAction, {
155
+ onClose: () => setDisplayDeleteModal(false),
156
+ deleteAction: () => deleteFileById(),
157
+ itemName: name
158
+ }), modalTargetRef.current), type === 'image' ? /*#__PURE__*/React.createElement("div", {
159
+ className: `card__image card__image--media-${displayLayout}`
160
+ }, /*#__PURE__*/React.createElement("img", {
161
+ src: bustUrl(url, updated),
162
+ alt: name
163
+ })) : /*#__PURE__*/React.createElement("div", {
164
+ className: "card__image card__image--media-list-document"
165
+ }, /*#__PURE__*/React.createElement("svg", {
166
+ xmlns: "http://www.w3.org/2000/svg",
167
+ width: "100",
168
+ height: "100",
169
+ viewBox: "0 0 8 8"
170
+ }, /*#__PURE__*/React.createElement("path", {
171
+ d: "M0 0v8h7v-4h-4v-4h-3zm4 0v3h3l-3-3zm-3 2h1v1h-1v-1zm0 2h1v1h-1v-1zm0 2h4v1h-4v-1z"
172
+ }))), /*#__PURE__*/React.createElement("footer", {
173
+ className: `card__footer card__footer--media-${displayLayout}`
174
+ }, /*#__PURE__*/React.createElement("div", {
175
+ className: `card__details card__details--media-${displayLayout}`
176
+ }, /*#__PURE__*/React.createElement("div", {
177
+ className: `card__title card__title--media-${displayLayout}`
178
+ }, /*#__PURE__*/React.createElement("h2", null, name)), /*#__PURE__*/React.createElement("p", null, /*#__PURE__*/React.createElement("span", null, "format: ", extension))), /*#__PURE__*/React.createElement("div", {
179
+ className: `card__menu card__menu--${displayLayout}`
180
+ }, /*#__PURE__*/React.createElement("div", {
181
+ className: "more-menu__wrapper more-menu__wrapper--card"
182
+ }, /*#__PURE__*/React.createElement(More, {
183
+ displayBg: true
184
+ }, /*#__PURE__*/React.createElement(More.Avatar, {
185
+ isMoreMenu: true
186
+ }, /*#__PURE__*/React.createElement("span", {
187
+ className: "material-icons"
188
+ }, "more_vert")), /*#__PURE__*/React.createElement(More.Content, {
189
+ isMoreMenu: true
190
+ }, openEditInModal ? /*#__PURE__*/React.createElement(Button, {
191
+ onClick: event => {
192
+ event.preventDefault();
193
+ event.stopPropagation();
194
+ setDisplayEditModal(true);
195
+ },
196
+ className: "more-menu__link"
197
+ }, "Edit") : /*#__PURE__*/React.createElement(Link, {
198
+ to: `/media/edit/${id}`,
199
+ className: "more-menu__link"
200
+ }, "Edit"), /*#__PURE__*/React.createElement(Button, {
201
+ onClick: event => {
202
+ event.preventDefault();
203
+ event.stopPropagation();
204
+ setDisplayDeleteModal(true);
205
+ },
206
+ className: "more-menu__link"
207
+ }, "Delete"))))))));
208
+ };
209
+ CardMedia.propTypes = {
210
+ name: PropTypes.string.isRequired,
211
+ url: PropTypes.string.isRequired,
212
+ id: PropTypes.string.isRequired,
213
+ mimetype: PropTypes.string.isRequired,
214
+ displayLayout: PropTypes.string.isRequired,
215
+ data: PropTypes.object,
216
+ updated: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
217
+ onSelected: PropTypes.func,
218
+ updateFile: PropTypes.func.isRequired,
219
+ removeFile: PropTypes.func.isRequired,
220
+ selected: PropTypes.bool,
221
+ modalTargetRef: PropTypes.object.isRequired,
222
+ index: PropTypes.number.isRequired,
223
+ openEditInModal: PropTypes.bool
224
+ };
225
+ CardMedia.defaultProps = {
226
+ onSelected: () => {},
227
+ selected: false,
228
+ data: {},
229
+ updated: null,
230
+ openEditInModal: false
231
+ };
232
+ export default CardMedia;
233
+ //# sourceMappingURL=CardMedia.js.map
@@ -0,0 +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":[]}
@@ -0,0 +1,3 @@
1
+ import CardMedia from './CardMedia';
2
+ export default CardMedia;
3
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","names":["CardMedia"],"sources":["../../../src/components/CardMedia/index.js"],"sourcesContent":["import CardMedia from './CardMedia';\n\nexport default CardMedia;\n"],"mappings":"AAAA,OAAOA,SAAS,MAAM,aAAa;AAEnC,eAAeA,SAAS","ignoreList":[]}
@@ -0,0 +1,187 @@
1
+ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
2
+ import _defineProperty from "@babel/runtime/helpers/defineProperty";
3
+ const _excluded = ["__typename"];
4
+ 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; }
5
+ 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; }
6
+ import React, { useState, useEffect } from 'react';
7
+ import PropTypes from 'prop-types';
8
+ import { getQuery } from '@blaze-cms/admin-ui-utils';
9
+ import { useQuery } from '@apollo/client';
10
+ import { useToasts } from '@blaze-react/toaster';
11
+ import FilePreview from '../FilePreview';
12
+ import FileUploadModal from '../FileUploadModal';
13
+ import { STORE_KEY, NAME } from '../../constants';
14
+ const EditMediaFile = ({
15
+ onChange,
16
+ handleSaveButtonStatus,
17
+ fileId,
18
+ showChangeButton,
19
+ fileUpdated
20
+ }) => {
21
+ const [formValues, setFormValues] = useState(null);
22
+ const [displayFileUploadModal, setDisplayFileUploadModal] = useState(false);
23
+ const {
24
+ addToast
25
+ } = useToasts();
26
+ const fileQuery = getQuery('GET_FILE_BY_ID');
27
+ const {
28
+ loading,
29
+ data: {
30
+ file
31
+ } = {},
32
+ refetch: refetchFile
33
+ } = useQuery(fileQuery, {
34
+ variables: {
35
+ id: fileId
36
+ },
37
+ fetchPolicy: 'cache-and-network'
38
+ });
39
+ const fileStoresType = getQuery('GET_FILE_STORES');
40
+ const {
41
+ data: {
42
+ getFileStores: storeType = []
43
+ } = {}
44
+ } = useQuery(fileStoresType, {
45
+ variables: {
46
+ visibleInAdmin: true
47
+ }
48
+ });
49
+ useEffect(() => {
50
+ if (file) {
51
+ setFormValues(prevFormValues => {
52
+ if (!prevFormValues || prevFormValues.updated !== file.updated) {
53
+ return file;
54
+ }
55
+ return prevFormValues;
56
+ });
57
+ }
58
+ }, [file]);
59
+ useEffect(() => {
60
+ if (fileUpdated && fileUpdated.updated) {
61
+ setFormValues(fileUpdated);
62
+ }
63
+ }, [fileUpdated]);
64
+ const handleFormChange = ({
65
+ isValid,
66
+ isNewValueSet,
67
+ valuesChecked
68
+ }) => {
69
+ const baseFile = formValues || file;
70
+ const valuesCheckedWithoutName = valuesChecked.filter(({
71
+ id
72
+ }) => id !== NAME && id !== STORE_KEY);
73
+ const dataValues = valuesCheckedWithoutName.reduce((acc, {
74
+ id,
75
+ value
76
+ }) => {
77
+ acc[id] = value;
78
+ return acc;
79
+ }, {});
80
+ const {
81
+ value: newFileName
82
+ } = valuesChecked.find(({
83
+ id
84
+ }) => id === NAME) || {};
85
+ const {
86
+ value: storeKey
87
+ } = valuesChecked.find(({
88
+ id
89
+ }) => id === STORE_KEY) || {};
90
+ const shouldEnableSaveButton = isNewValueSet && isValid;
91
+ handleSaveButtonStatus(shouldEnableSaveButton);
92
+ const updatedFile = _objectSpread(_objectSpread({}, baseFile), {}, {
93
+ name: newFileName || baseFile.name,
94
+ storeKey: storeKey || baseFile.storeKey,
95
+ data: _objectSpread(_objectSpread({}, baseFile.data || {}), dataValues)
96
+ });
97
+ setFormValues(updatedFile);
98
+ // Strip GraphQL metadata field __typename before passing data to onChange.
99
+ const _ref = updatedFile.data || {},
100
+ {
101
+ __typename
102
+ } = _ref,
103
+ cleanData = _objectWithoutProperties(_ref, _excluded);
104
+ onChange({
105
+ id: updatedFile.id,
106
+ name: updatedFile.name,
107
+ data: cleanData
108
+ });
109
+ };
110
+ const getFileWithStoreType = sourceFile => {
111
+ const base = sourceFile || file;
112
+ if (storeType && base) {
113
+ const storeOptions = storeType.map(type => [type.key, type.name]);
114
+ const defaultStore = storeType.find(type => type.isDefault) || null;
115
+ return _objectSpread(_objectSpread({}, base), {}, {
116
+ store: {
117
+ defaultStore,
118
+ storeOptions
119
+ }
120
+ });
121
+ }
122
+ return base;
123
+ };
124
+ const closeModalAndSetValue = async (isSaving, values, toastMessage) => {
125
+ if (toastMessage) {
126
+ addToast(toastMessage, {
127
+ appearance: 'success',
128
+ autoDismiss: true
129
+ });
130
+ }
131
+ if (values) {
132
+ const updated = values.id === fileId ? values : _objectSpread(_objectSpread(_objectSpread({}, formValues || file), values), {}, {
133
+ url: values.url || (formValues || file).url
134
+ });
135
+ setFormValues(updated);
136
+ onChange(updated);
137
+ handleSaveButtonStatus(true);
138
+ } else {
139
+ const {
140
+ data: {
141
+ file: refreshedFile
142
+ } = {}
143
+ } = await refetchFile({
144
+ id: fileId,
145
+ timestamp: Date.now()
146
+ });
147
+ if (refreshedFile) {
148
+ setFormValues(refreshedFile);
149
+ onChange(refreshedFile);
150
+ handleSaveButtonStatus(true);
151
+ }
152
+ }
153
+ setDisplayFileUploadModal(false);
154
+ };
155
+ if (loading) return /*#__PURE__*/React.createElement("div", null, "loading...");
156
+ const fileToRender = formValues || file;
157
+ const fileWithStoreType = getFileWithStoreType(fileToRender);
158
+ return /*#__PURE__*/React.createElement(React.Fragment, null, !!file && /*#__PURE__*/React.createElement(FilePreview, {
159
+ file: fileWithStoreType,
160
+ handleFormChange: handleFormChange,
161
+ handleChangeFile: () => setDisplayFileUploadModal(true),
162
+ displayForm: true,
163
+ showChangeButton: showChangeButton
164
+ }), displayFileUploadModal && /*#__PURE__*/React.createElement("div", {
165
+ className: "file-upload-modal-wrapper"
166
+ }, /*#__PURE__*/React.createElement(FileUploadModal, {
167
+ onClose: () => setDisplayFileUploadModal(false),
168
+ closeModalAndSetValue: closeModalAndSetValue,
169
+ simpleLayout: true,
170
+ fileId: fileId,
171
+ storeKey: file && file.storeKey,
172
+ getSelectedFiles: () => {}
173
+ })));
174
+ };
175
+ EditMediaFile.propTypes = {
176
+ fileId: PropTypes.string.isRequired,
177
+ onChange: PropTypes.func.isRequired,
178
+ handleSaveButtonStatus: PropTypes.func.isRequired,
179
+ showChangeButton: PropTypes.bool,
180
+ fileUpdated: PropTypes.object
181
+ };
182
+ EditMediaFile.defaultProps = {
183
+ showChangeButton: false,
184
+ fileUpdated: null
185
+ };
186
+ export default EditMediaFile;
187
+ //# sourceMappingURL=EditMediaFile.js.map
@@ -0,0 +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 (\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":[]}
@@ -0,0 +1,109 @@
1
+ import React, { useState } from 'react';
2
+ import { withRouter } from 'react-router-dom';
3
+ import PropTypes from 'prop-types';
4
+ import Button from '@blaze-react/button';
5
+ import { useApolloClient } from '@apollo/client';
6
+ import { getQuery, getMutation } from '@blaze-cms/admin-ui-utils';
7
+ import { useToasts } from '@blaze-react/toaster';
8
+ import EditMediaFile from './EditMediaFile';
9
+ const EditMediaFilePage = ({
10
+ match,
11
+ history
12
+ }) => {
13
+ const [shouldEnableSaveButton, setShouldEnableSaveButton] = useState(false);
14
+ const [file, setFile] = useState(null);
15
+ const client = useApolloClient();
16
+ const {
17
+ addToast
18
+ } = useToasts();
19
+ const handleFileChange = values => setFile(values);
20
+ const handleSaveButtonStatus = value => {
21
+ setShouldEnableSaveButton(value);
22
+ };
23
+ const handleFormSave = async () => {
24
+ if (!file) {
25
+ addToast('No file data to update', {
26
+ appearance: 'error',
27
+ autoDismiss: true
28
+ });
29
+ return;
30
+ }
31
+ try {
32
+ const inputData = {
33
+ id: file.id,
34
+ name: file.name,
35
+ data: file.data,
36
+ storeKey: file.storeKey
37
+ };
38
+ const {
39
+ data: {
40
+ updateFile: updatedFile
41
+ }
42
+ } = await client.mutate({
43
+ mutation: getMutation('UPDATE_FILE'),
44
+ variables: {
45
+ input: inputData
46
+ },
47
+ update(cache, {
48
+ data: {
49
+ updateFile: fileUpdated
50
+ }
51
+ }) {
52
+ try {
53
+ cache.writeQuery({
54
+ query: getQuery('GET_FILE_BY_ID'),
55
+ variables: {
56
+ id: match.params.fileId
57
+ },
58
+ data: {
59
+ file: fileUpdated.result
60
+ }
61
+ });
62
+ } catch (e) {
63
+ console.error(e); //eslint-disable-line
64
+ }
65
+ }
66
+ });
67
+ setFile(updatedFile.result);
68
+ addToast(`File: ${file.name} has been updated`, {
69
+ appearance: 'success',
70
+ autoDismiss: true
71
+ });
72
+ } catch (e) {
73
+ addToast(`File: ${file.name} has not been updated`, {
74
+ appearance: 'error',
75
+ autoDismiss: true
76
+ });
77
+ }
78
+ setShouldEnableSaveButton(false);
79
+ };
80
+ const pushBack = () => history.push('/media');
81
+ const buttonModifiers = shouldEnableSaveButton ? [] : ['disabled'];
82
+ return /*#__PURE__*/React.createElement("div", {
83
+ className: "page"
84
+ }, /*#__PURE__*/React.createElement("div", {
85
+ className: "page__content"
86
+ }, /*#__PURE__*/React.createElement("div", {
87
+ className: "page__content__mediaWrapper"
88
+ }, /*#__PURE__*/React.createElement(EditMediaFile, {
89
+ onChange: handleFileChange,
90
+ fileId: match.params.fileId,
91
+ handleSaveButtonStatus: handleSaveButtonStatus,
92
+ handleFormSave: handleFormSave,
93
+ showChangeButton: true,
94
+ fileUpdated: file
95
+ }), /*#__PURE__*/React.createElement("div", {
96
+ className: "page__content__mediaWrapperActions"
97
+ }, /*#__PURE__*/React.createElement(Button, {
98
+ onClick: pushBack
99
+ }, "Cancel"), /*#__PURE__*/React.createElement(Button, {
100
+ onClick: handleFormSave,
101
+ modifiers: buttonModifiers
102
+ }, "Apply")))));
103
+ };
104
+ EditMediaFilePage.propTypes = {
105
+ match: PropTypes.object.isRequired,
106
+ history: PropTypes.object.isRequired
107
+ };
108
+ export default withRouter(EditMediaFilePage);
109
+ //# sourceMappingURL=EditMediaFilePage.js.map
@@ -0,0 +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":[]}
@@ -0,0 +1,3 @@
1
+ import EditMediaFile from './EditMediaFile';
2
+ export default EditMediaFile;
3
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","names":["EditMediaFile"],"sources":["../../../src/components/EditMediaFile/index.js"],"sourcesContent":["import EditMediaFile from './EditMediaFile';\n\nexport default EditMediaFile;\n"],"mappings":"AAAA,OAAOA,aAAa,MAAM,iBAAiB;AAE3C,eAAeA,aAAa","ignoreList":[]}