@panneau/medias 3.0.173 → 3.0.175
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.
- package/es/index.js +194 -97
- package/lib/index.js +195 -97
- package/package.json +16 -16
package/es/index.js
CHANGED
|
@@ -67,16 +67,26 @@ var useMedias = function useMedias() {
|
|
|
67
67
|
var count = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;
|
|
68
68
|
var opts = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};
|
|
69
69
|
var api = useMediasApi();
|
|
70
|
+
var trashed = useMemo(function () {
|
|
71
|
+
var _ref = opts || {},
|
|
72
|
+
trashedOpt = _ref.trashed;
|
|
73
|
+
return trashedOpt;
|
|
74
|
+
}, [opts]);
|
|
75
|
+
var finalQuery = useMemo(function () {
|
|
76
|
+
return _objectSpread(_objectSpread({}, query), {}, {
|
|
77
|
+
trashed: trashed
|
|
78
|
+
});
|
|
79
|
+
}, [query, trashed]);
|
|
70
80
|
var getItems = useCallback(function () {
|
|
71
81
|
var requestedPage = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
|
|
72
|
-
return api.get(query, requestedPage, count);
|
|
73
|
-
}, [api, query, count]);
|
|
82
|
+
return trashed ? api.getTrashed(query, requestedPage, count) : api.get(query, requestedPage, count);
|
|
83
|
+
}, [api, query, count, trashed]);
|
|
74
84
|
var _useItemsStore = useItemsStore('medias', _objectSpread({
|
|
75
85
|
getPage: page !== null ? getItems : null,
|
|
76
86
|
getItems: page === null ? getItems : null,
|
|
77
87
|
page: page,
|
|
78
88
|
count: count,
|
|
79
|
-
query:
|
|
89
|
+
query: finalQuery
|
|
80
90
|
}, opts)),
|
|
81
91
|
items = _useItemsStore.items,
|
|
82
92
|
props = _objectWithoutProperties(_useItemsStore, _excluded$7);
|
|
@@ -86,34 +96,6 @@ var useMedias = function useMedias() {
|
|
|
86
96
|
};
|
|
87
97
|
var useMedias$1 = useMedias;
|
|
88
98
|
|
|
89
|
-
var useMediasRecent = function useMediasRecent(opts) {
|
|
90
|
-
var key = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'media-gallery-recent-searches';
|
|
91
|
-
var addSearchValue = useCallback(function (value) {
|
|
92
|
-
if (typeof window !== 'undefined' && typeof window.localStorage !== 'undefined' && value) {
|
|
93
|
-
var recent = window.localStorage.getItem(key) || null;
|
|
94
|
-
var current = recent !== null ? JSON.parse(recent || '[]') : [];
|
|
95
|
-
var encoded = JSON.stringify([value].concat(_toConsumableArray(current)));
|
|
96
|
-
window.localStorage.setItem(key, encoded);
|
|
97
|
-
return true;
|
|
98
|
-
}
|
|
99
|
-
return false;
|
|
100
|
-
}, [key]);
|
|
101
|
-
var getSearchValues = useCallback(function () {
|
|
102
|
-
var count = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 5;
|
|
103
|
-
if (typeof window !== 'undefined' && typeof window.localStorage !== 'undefined') {
|
|
104
|
-
var recent = window.localStorage.getItem(key) || null;
|
|
105
|
-
var current = recent !== null ? JSON.parse(recent || '[]') : [];
|
|
106
|
-
return current.slice(0, count);
|
|
107
|
-
}
|
|
108
|
-
return [];
|
|
109
|
-
}, [key]);
|
|
110
|
-
return {
|
|
111
|
-
addSearchValue: addSearchValue,
|
|
112
|
-
getSearchValues: getSearchValues
|
|
113
|
-
};
|
|
114
|
-
};
|
|
115
|
-
var useMediasRecent$1 = useMediasRecent;
|
|
116
|
-
|
|
117
99
|
var _excluded$6 = ["data"];
|
|
118
100
|
var useMedia = function useMedia(id, opts) {
|
|
119
101
|
var api = useMediasApi();
|
|
@@ -132,19 +114,19 @@ var useMedia$1 = useMedia;
|
|
|
132
114
|
var useMediaCreate = function useMediaCreate() {
|
|
133
115
|
var _useState = useState(false),
|
|
134
116
|
_useState2 = _slicedToArray(_useState, 2),
|
|
135
|
-
|
|
136
|
-
|
|
117
|
+
creating = _useState2[0],
|
|
118
|
+
setCreating = _useState2[1];
|
|
137
119
|
var api = useMediasApi();
|
|
138
120
|
var create = useCallback(function (data) {
|
|
139
|
-
|
|
121
|
+
setCreating(true);
|
|
140
122
|
return api.create(data).then(function (response) {
|
|
141
|
-
|
|
123
|
+
setCreating(false);
|
|
142
124
|
return response;
|
|
143
125
|
});
|
|
144
|
-
}, [api,
|
|
126
|
+
}, [api, setCreating]);
|
|
145
127
|
return {
|
|
146
128
|
create: create,
|
|
147
|
-
|
|
129
|
+
creating: creating
|
|
148
130
|
};
|
|
149
131
|
};
|
|
150
132
|
var useMediaCreate$1 = useMediaCreate;
|
|
@@ -152,41 +134,62 @@ var useMediaCreate$1 = useMediaCreate;
|
|
|
152
134
|
var useMediaUpdate = function useMediaUpdate() {
|
|
153
135
|
var _useState = useState(false),
|
|
154
136
|
_useState2 = _slicedToArray(_useState, 2),
|
|
155
|
-
|
|
156
|
-
|
|
137
|
+
updating = _useState2[0],
|
|
138
|
+
setUpdating = _useState2[1];
|
|
157
139
|
var api = useMediasApi();
|
|
158
140
|
var update = useCallback(function (id, data) {
|
|
159
|
-
|
|
141
|
+
setUpdating(true);
|
|
160
142
|
return api.update(id, data).then(function (response) {
|
|
161
|
-
|
|
143
|
+
setUpdating(false);
|
|
162
144
|
return response;
|
|
163
145
|
});
|
|
164
|
-
}, [api,
|
|
146
|
+
}, [api, setUpdating]);
|
|
165
147
|
return {
|
|
166
148
|
update: update,
|
|
167
|
-
|
|
149
|
+
updating: updating
|
|
168
150
|
};
|
|
169
151
|
};
|
|
170
152
|
var useMediaUpdate$1 = useMediaUpdate;
|
|
171
153
|
|
|
172
|
-
var
|
|
154
|
+
var useMediaDelete = function useMediaDelete() {
|
|
173
155
|
var _useState = useState(false),
|
|
174
156
|
_useState2 = _slicedToArray(_useState, 2),
|
|
175
|
-
|
|
176
|
-
|
|
157
|
+
deleting = _useState2[0],
|
|
158
|
+
setDeleting = _useState2[1];
|
|
177
159
|
var api = useMediasApi();
|
|
178
|
-
var
|
|
179
|
-
|
|
160
|
+
var mediaDelete = useCallback(function (id, data) {
|
|
161
|
+
setDeleting(true);
|
|
180
162
|
return api["delete"](id, data).then(function (response) {
|
|
181
|
-
|
|
163
|
+
setDeleting(false);
|
|
182
164
|
return response;
|
|
183
165
|
});
|
|
184
|
-
}, [api,
|
|
166
|
+
}, [api, setDeleting]);
|
|
185
167
|
return {
|
|
186
|
-
|
|
187
|
-
|
|
168
|
+
mediaDelete: mediaDelete,
|
|
169
|
+
deleting: deleting
|
|
170
|
+
};
|
|
171
|
+
};
|
|
172
|
+
var useMediaDelete$1 = useMediaDelete;
|
|
173
|
+
|
|
174
|
+
var useMediaTrash = function useMediaTrash() {
|
|
175
|
+
var _useState = useState(false),
|
|
176
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
177
|
+
trashing = _useState2[0],
|
|
178
|
+
setTrashing = _useState2[1];
|
|
179
|
+
var api = useMediasApi();
|
|
180
|
+
var mediaTrash = useCallback(function (id, data) {
|
|
181
|
+
setTrashing(true);
|
|
182
|
+
return api.trash(id, data).then(function (response) {
|
|
183
|
+
setTrashing(false);
|
|
184
|
+
return response;
|
|
185
|
+
});
|
|
186
|
+
}, [api, setTrashing]);
|
|
187
|
+
return {
|
|
188
|
+
mediaTrash: mediaTrash,
|
|
189
|
+
trashing: trashing
|
|
188
190
|
};
|
|
189
191
|
};
|
|
192
|
+
var useMediaTrash$1 = useMediaTrash;
|
|
190
193
|
|
|
191
194
|
var styles = {"mediaFrame":"panneau-medias-mediaFrame","playButton":"panneau-medias-playButton"};
|
|
192
195
|
|
|
@@ -381,6 +384,7 @@ var propTypes$7 = {
|
|
|
381
384
|
onSave: PropTypes.func,
|
|
382
385
|
onDelete: PropTypes.func,
|
|
383
386
|
onClose: PropTypes.func,
|
|
387
|
+
withTrash: PropTypes.bool,
|
|
384
388
|
className: PropTypes.string,
|
|
385
389
|
children: PropTypes.node
|
|
386
390
|
};
|
|
@@ -391,6 +395,7 @@ var defaultProps$7 = {
|
|
|
391
395
|
onSave: null,
|
|
392
396
|
onDelete: null,
|
|
393
397
|
onClose: null,
|
|
398
|
+
withTrash: false,
|
|
394
399
|
className: null,
|
|
395
400
|
children: null
|
|
396
401
|
};
|
|
@@ -401,25 +406,31 @@ function MediaForm(_ref) {
|
|
|
401
406
|
onSave = _ref.onSave,
|
|
402
407
|
onDelete = _ref.onDelete,
|
|
403
408
|
onClose = _ref.onClose,
|
|
409
|
+
withTrash = _ref.withTrash,
|
|
404
410
|
className = _ref.className,
|
|
405
411
|
children = _ref.children;
|
|
406
412
|
var FieldsComponent = useFieldComponent('fields');
|
|
407
413
|
var _useMediaUpdate = useMediaUpdate$1(),
|
|
408
414
|
update = _useMediaUpdate.update,
|
|
409
|
-
updating = _useMediaUpdate.
|
|
410
|
-
var
|
|
411
|
-
|
|
412
|
-
|
|
415
|
+
updating = _useMediaUpdate.updating;
|
|
416
|
+
var _useMediaTrash = useMediaTrash$1(),
|
|
417
|
+
mediaTrash = _useMediaTrash.mediaTrash,
|
|
418
|
+
trashing = _useMediaTrash.trashing;
|
|
419
|
+
var _useMediaDelete = useMediaDelete$1(),
|
|
420
|
+
mediaDelete = _useMediaDelete.mediaDelete,
|
|
421
|
+
deleting = _useMediaDelete.deleting;
|
|
413
422
|
var _useState = useState(false),
|
|
414
423
|
_useState2 = _slicedToArray(_useState, 2),
|
|
415
424
|
changed = _useState2[0],
|
|
416
425
|
setChanged = _useState2[1];
|
|
417
|
-
var disabled = updating ||
|
|
426
|
+
var disabled = updating || deleting || trashing || initialValue === null;
|
|
418
427
|
var _ref2 = initialValue || {},
|
|
419
428
|
_ref2$name = _ref2.name,
|
|
420
429
|
name = _ref2$name === void 0 ? null : _ref2$name,
|
|
421
430
|
_ref2$type = _ref2.type,
|
|
422
|
-
type = _ref2$type === void 0 ? null : _ref2$type
|
|
431
|
+
type = _ref2$type === void 0 ? null : _ref2$type,
|
|
432
|
+
_ref2$deletedAt = _ref2.deletedAt,
|
|
433
|
+
deletedAt = _ref2$deletedAt === void 0 ? null : _ref2$deletedAt;
|
|
423
434
|
var onChangeMedia = useCallback(function (newValue) {
|
|
424
435
|
if (onChange !== null) {
|
|
425
436
|
onChange(newValue);
|
|
@@ -433,20 +444,32 @@ function MediaForm(_ref) {
|
|
|
433
444
|
setChanged(false);
|
|
434
445
|
}, [onChange, setChanged]);
|
|
435
446
|
var onDeleteMedia = useCallback(function () {
|
|
436
|
-
// Destroy
|
|
437
447
|
var _ref3 = initialValue || {},
|
|
438
448
|
_ref3$id = _ref3.id,
|
|
439
449
|
id = _ref3$id === void 0 ? null : _ref3$id;
|
|
440
|
-
|
|
441
|
-
|
|
442
|
-
onDelete
|
|
443
|
-
|
|
444
|
-
|
|
445
|
-
|
|
446
|
-
onClose
|
|
447
|
-
|
|
448
|
-
|
|
449
|
-
|
|
450
|
+
if (withTrash && deletedAt !== null) {
|
|
451
|
+
mediaTrash(id, initialValue).then(function () {
|
|
452
|
+
if (onDelete !== null) {
|
|
453
|
+
onDelete();
|
|
454
|
+
}
|
|
455
|
+
setChanged(false);
|
|
456
|
+
if (onClose !== null) {
|
|
457
|
+
onClose();
|
|
458
|
+
}
|
|
459
|
+
});
|
|
460
|
+
} else {
|
|
461
|
+
// Destroy
|
|
462
|
+
mediaDelete(id, initialValue).then(function () {
|
|
463
|
+
if (onDelete !== null) {
|
|
464
|
+
onDelete();
|
|
465
|
+
}
|
|
466
|
+
setChanged(false);
|
|
467
|
+
if (onClose !== null) {
|
|
468
|
+
onClose();
|
|
469
|
+
}
|
|
470
|
+
});
|
|
471
|
+
}
|
|
472
|
+
}, [initialValue, mediaDelete, mediaTrash, deletedAt, setChanged, withTrash]);
|
|
450
473
|
var postForm = useCallback(function (action, data) {
|
|
451
474
|
return initialValue !== null ? update(initialValue.id, data) : new Promise();
|
|
452
475
|
}, [initialValue, update]);
|
|
@@ -477,9 +500,17 @@ function MediaForm(_ref) {
|
|
|
477
500
|
}, type)), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Button, {
|
|
478
501
|
className: "me-2 mb-1 mt-1",
|
|
479
502
|
theme: "danger",
|
|
503
|
+
icon: withTrash && deletedAt !== null ? 'trash-fill' : 'trash',
|
|
504
|
+
iconPosition: "right",
|
|
480
505
|
onClick: onDeleteMedia,
|
|
481
|
-
disabled:
|
|
482
|
-
}, /*#__PURE__*/React.createElement(FormattedMessage, {
|
|
506
|
+
disabled: deleting || trashing
|
|
507
|
+
}, withTrash && deletedAt === null ? /*#__PURE__*/React.createElement(FormattedMessage, {
|
|
508
|
+
id: "PSlT7H",
|
|
509
|
+
defaultMessage: [{
|
|
510
|
+
"type": 0,
|
|
511
|
+
"value": "Trash"
|
|
512
|
+
}]
|
|
513
|
+
}) : /*#__PURE__*/React.createElement(FormattedMessage, {
|
|
483
514
|
id: "Bhu3B2",
|
|
484
515
|
defaultMessage: [{
|
|
485
516
|
"type": 0,
|
|
@@ -488,8 +519,10 @@ function MediaForm(_ref) {
|
|
|
488
519
|
})), onSave !== null ? /*#__PURE__*/React.createElement(Button, {
|
|
489
520
|
className: "mb-1 mt-1",
|
|
490
521
|
theme: "primary",
|
|
522
|
+
icon: changed ? 'check-all' : 'check',
|
|
523
|
+
iconPosition: "right",
|
|
491
524
|
onClick: onSubmit,
|
|
492
|
-
disabled: !changed || updating ||
|
|
525
|
+
disabled: !changed || updating || deleting
|
|
493
526
|
}, /*#__PURE__*/React.createElement(FormattedMessage, {
|
|
494
527
|
id: "R1HYj0",
|
|
495
528
|
defaultMessage: [{
|
|
@@ -680,7 +713,7 @@ var defaultColumns = [{
|
|
|
680
713
|
"value": "Actions"
|
|
681
714
|
}]
|
|
682
715
|
}),
|
|
683
|
-
actions: ['edit']
|
|
716
|
+
actions: ['edit', 'delete']
|
|
684
717
|
// component: ItemActions,
|
|
685
718
|
// label: 'Edit',
|
|
686
719
|
// url: '/edit/1',
|
|
@@ -769,7 +802,7 @@ var defaultFilters = [{
|
|
|
769
802
|
];
|
|
770
803
|
|
|
771
804
|
var _excluded$5 = ["page", "count"],
|
|
772
|
-
_excluded2 = ["types"];
|
|
805
|
+
_excluded2 = ["types", "trashed"];
|
|
773
806
|
var propTypes$5 = {
|
|
774
807
|
items: PropTypes$1.medias,
|
|
775
808
|
extraItems: PropTypes$1.medias,
|
|
@@ -788,9 +821,11 @@ var propTypes$5 = {
|
|
|
788
821
|
onLayoutChange: PropTypes.func,
|
|
789
822
|
selectedCount: PropTypes.number,
|
|
790
823
|
onClearSelected: PropTypes.func,
|
|
824
|
+
withTrash: PropTypes.bool,
|
|
791
825
|
withStickySelection: PropTypes.bool,
|
|
792
826
|
className: PropTypes.string,
|
|
793
|
-
buttonsClassName: PropTypes.string
|
|
827
|
+
buttonsClassName: PropTypes.string,
|
|
828
|
+
formChildren: PropTypes.node
|
|
794
829
|
};
|
|
795
830
|
var defaultProps$5 = {
|
|
796
831
|
items: null,
|
|
@@ -820,9 +855,11 @@ var defaultProps$5 = {
|
|
|
820
855
|
onLayoutChange: null,
|
|
821
856
|
selectedCount: null,
|
|
822
857
|
onClearSelected: null,
|
|
858
|
+
withTrash: false,
|
|
823
859
|
withStickySelection: false,
|
|
824
860
|
className: null,
|
|
825
|
-
buttonsClassName: null
|
|
861
|
+
buttonsClassName: null,
|
|
862
|
+
formChildren: null
|
|
826
863
|
};
|
|
827
864
|
function MediasBrowser(_ref) {
|
|
828
865
|
var initialItems = _ref.items,
|
|
@@ -842,9 +879,11 @@ function MediasBrowser(_ref) {
|
|
|
842
879
|
onLayoutChange = _ref.onLayoutChange,
|
|
843
880
|
selectedCount = _ref.selectedCount,
|
|
844
881
|
onClearSelected = _ref.onClearSelected,
|
|
882
|
+
withTrash = _ref.withTrash,
|
|
845
883
|
withStickySelection = _ref.withStickySelection,
|
|
846
884
|
className = _ref.className,
|
|
847
|
-
buttonsClassName = _ref.buttonsClassName
|
|
885
|
+
buttonsClassName = _ref.buttonsClassName,
|
|
886
|
+
formChildren = _ref.formChildren;
|
|
848
887
|
var _useState = useState(initialItems || null),
|
|
849
888
|
_useState2 = _slicedToArray(_useState, 1),
|
|
850
889
|
baseItems = _useState2[0];
|
|
@@ -883,9 +922,24 @@ function MediasBrowser(_ref) {
|
|
|
883
922
|
// eslint-disable-next-line no-unused-vars
|
|
884
923
|
var _ref3 = query || {};
|
|
885
924
|
_ref3.types;
|
|
925
|
+
_ref3.trashed;
|
|
886
926
|
var queryWithoutTypes = _objectWithoutProperties(_ref3, _excluded2);
|
|
927
|
+
var _useMediaTrash = useMediaTrash$1(),
|
|
928
|
+
mediaTrash = _useMediaTrash.mediaTrash,
|
|
929
|
+
trashing = _useMediaTrash.trashing;
|
|
930
|
+
var _useMediaDelete = useMediaDelete$1(),
|
|
931
|
+
mediaDelete = _useMediaDelete.mediaDelete,
|
|
932
|
+
deleting = _useMediaDelete.deleting;
|
|
933
|
+
var _useState3 = useState(false),
|
|
934
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
935
|
+
showTrashed = _useState4[0],
|
|
936
|
+
setShowTrashed = _useState4[1];
|
|
937
|
+
var onClickTrash = useCallback(function () {
|
|
938
|
+
setShowTrashed(!showTrashed);
|
|
939
|
+
}, [showTrashed, setShowTrashed]);
|
|
887
940
|
var _useMedias = useMedias$1(query, page, count, {
|
|
888
|
-
items: baseItems
|
|
941
|
+
items: baseItems,
|
|
942
|
+
trashed: showTrashed
|
|
889
943
|
}),
|
|
890
944
|
items = _useMedias.items,
|
|
891
945
|
allItems = _useMedias.allItems,
|
|
@@ -904,10 +958,10 @@ function MediasBrowser(_ref) {
|
|
|
904
958
|
onItemsChange(items);
|
|
905
959
|
}
|
|
906
960
|
}, [items, onItemsChange]);
|
|
907
|
-
var
|
|
908
|
-
|
|
909
|
-
layout =
|
|
910
|
-
setLayout =
|
|
961
|
+
var _useState5 = useState(initialLayout || 'table'),
|
|
962
|
+
_useState6 = _slicedToArray(_useState5, 2),
|
|
963
|
+
layout = _useState6[0],
|
|
964
|
+
setLayout = _useState6[1];
|
|
911
965
|
var hasLayouts = useMemo(function () {
|
|
912
966
|
return layouts !== null && layouts.length > 1;
|
|
913
967
|
}, [layouts]);
|
|
@@ -947,8 +1001,17 @@ function MediasBrowser(_ref) {
|
|
|
947
1001
|
alwaysShowButtons: true
|
|
948
1002
|
});
|
|
949
1003
|
var finalFilters = useMemo(function () {
|
|
950
|
-
|
|
951
|
-
|
|
1004
|
+
var partialFilters = withTrash ? (filters || []).concat([{
|
|
1005
|
+
name: 'trashed',
|
|
1006
|
+
component: 'button',
|
|
1007
|
+
theme: showTrashed ? 'danger' : 'secondary',
|
|
1008
|
+
outline: !showTrashed,
|
|
1009
|
+
activeTheme: 'danger',
|
|
1010
|
+
icon: showTrashed ? 'trash-fill' : 'trash',
|
|
1011
|
+
onClick: onClickTrash
|
|
1012
|
+
}]) : filters;
|
|
1013
|
+
if (types !== null && partialFilters !== null) {
|
|
1014
|
+
return (partialFilters || []).map(function (filter) {
|
|
952
1015
|
var _ref4 = filter || {},
|
|
953
1016
|
_ref4$id = _ref4.id,
|
|
954
1017
|
id = _ref4$id === void 0 ? null : _ref4$id;
|
|
@@ -957,17 +1020,37 @@ function MediasBrowser(_ref) {
|
|
|
957
1020
|
}) : filter;
|
|
958
1021
|
});
|
|
959
1022
|
}
|
|
960
|
-
return
|
|
961
|
-
}, [filters, types]);
|
|
1023
|
+
return partialFilters;
|
|
1024
|
+
}, [filters, types, withTrash, showTrashed, onClickTrash]);
|
|
1025
|
+
var finalColumns = useMemo(function () {
|
|
1026
|
+
return withTrash && showTrashed ? (columns || []).map(function (column) {
|
|
1027
|
+
var _ref5 = column || {},
|
|
1028
|
+
_ref5$id = _ref5.id,
|
|
1029
|
+
columnId = _ref5$id === void 0 ? null : _ref5$id;
|
|
1030
|
+
if (columnId === 'created_at') {
|
|
1031
|
+
return _objectSpread(_objectSpread({}, column), {}, {
|
|
1032
|
+
path: 'deleted_at',
|
|
1033
|
+
label: /*#__PURE__*/React.createElement(FormattedMessage, {
|
|
1034
|
+
id: "uds4wJ",
|
|
1035
|
+
defaultMessage: [{
|
|
1036
|
+
"type": 0,
|
|
1037
|
+
"value": "Deleted at"
|
|
1038
|
+
}]
|
|
1039
|
+
})
|
|
1040
|
+
});
|
|
1041
|
+
}
|
|
1042
|
+
return column;
|
|
1043
|
+
}) : columns;
|
|
1044
|
+
}, [columns, withTrash, showTrashed]);
|
|
962
1045
|
var finalItems = useMemo(function () {
|
|
963
1046
|
if (withStickySelection && extraItems !== null) {
|
|
964
1047
|
return uniqBy([].concat(_toConsumableArray((extraItems || []).map(function (item) {
|
|
965
1048
|
var _item$id = item.id,
|
|
966
1049
|
itemId = _item$id === void 0 ? null : _item$id;
|
|
967
1050
|
return (allItems || []).find(function () {
|
|
968
|
-
var
|
|
969
|
-
|
|
970
|
-
otherId =
|
|
1051
|
+
var _ref6 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
|
|
1052
|
+
_ref6$id = _ref6.id,
|
|
1053
|
+
otherId = _ref6$id === void 0 ? null : _ref6$id;
|
|
971
1054
|
return otherId === itemId;
|
|
972
1055
|
}) || item || null;
|
|
973
1056
|
}).filter(function (it) {
|
|
@@ -997,8 +1080,9 @@ function MediasBrowser(_ref) {
|
|
|
997
1080
|
fields: fields,
|
|
998
1081
|
onChange: setCurrentMedia,
|
|
999
1082
|
onSave: onSaveMedia,
|
|
1000
|
-
onClose: onCloseMedia
|
|
1001
|
-
|
|
1083
|
+
onClose: onCloseMedia,
|
|
1084
|
+
withTrash: withTrash
|
|
1085
|
+
}, formChildren)) : /*#__PURE__*/React.createElement(React.Fragment, null, filters !== null ? /*#__PURE__*/React.createElement(Filters, {
|
|
1002
1086
|
value: query,
|
|
1003
1087
|
clearValue: types !== null ? queryWithoutTypes : null,
|
|
1004
1088
|
filters: finalFilters,
|
|
@@ -1010,10 +1094,10 @@ function MediasBrowser(_ref) {
|
|
|
1010
1094
|
className: buttonsClassName
|
|
1011
1095
|
}) : null) : null, filters === null && buttons !== null ? /*#__PURE__*/React.createElement("div", {
|
|
1012
1096
|
className: "mt-2 mb-2"
|
|
1013
|
-
},
|
|
1097
|
+
}, /*#__PURE__*/React.createElement(Buttons, {
|
|
1014
1098
|
items: buttons,
|
|
1015
1099
|
className: buttonsClassName
|
|
1016
|
-
})
|
|
1100
|
+
})) : null, /*#__PURE__*/React.createElement("div", {
|
|
1017
1101
|
className: classNames(['d-flex', 'mt-1', 'mb-3', {
|
|
1018
1102
|
'justify-content-between': hasLayouts,
|
|
1019
1103
|
'justify-content-end': !hasLayouts
|
|
@@ -1051,7 +1135,7 @@ function MediasBrowser(_ref) {
|
|
|
1051
1135
|
loading: loading
|
|
1052
1136
|
})) : null, layout === 'table' ? /*#__PURE__*/React.createElement(Table, Object.assign({
|
|
1053
1137
|
theme: theme,
|
|
1054
|
-
columns:
|
|
1138
|
+
columns: finalColumns,
|
|
1055
1139
|
displayPlaceholder: /*#__PURE__*/React.createElement("span", {
|
|
1056
1140
|
className: "text-secondary text-opacity-75"
|
|
1057
1141
|
}, "\u2014"),
|
|
@@ -1062,6 +1146,19 @@ function MediasBrowser(_ref) {
|
|
|
1062
1146
|
items: finalItems,
|
|
1063
1147
|
loading: loading,
|
|
1064
1148
|
actionsProps: {
|
|
1149
|
+
getDeletePropsFromItem: function getDeletePropsFromItem() {
|
|
1150
|
+
var _ref7 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
|
|
1151
|
+
_ref7$id = _ref7.id,
|
|
1152
|
+
id = _ref7$id === void 0 ? null : _ref7$id;
|
|
1153
|
+
return {
|
|
1154
|
+
href: null,
|
|
1155
|
+
onClick: function onClick() {
|
|
1156
|
+
return showTrashed ? mediaDelete(id) : mediaTrash(id);
|
|
1157
|
+
},
|
|
1158
|
+
disabled: trashing || deleting,
|
|
1159
|
+
icon: showTrashed ? 'trash-fill' : 'trash'
|
|
1160
|
+
};
|
|
1161
|
+
},
|
|
1065
1162
|
getEditPropsFromItem: function getEditPropsFromItem(it) {
|
|
1066
1163
|
return {
|
|
1067
1164
|
href: null,
|
|
@@ -1155,8 +1252,8 @@ function MediasPicker(_ref) {
|
|
|
1155
1252
|
onSelectPage: onSelectPage,
|
|
1156
1253
|
selectedItems: selectedItems,
|
|
1157
1254
|
pageSelected: pageSelected
|
|
1158
|
-
}, tableProps)
|
|
1159
|
-
items
|
|
1255
|
+
}, tableProps)
|
|
1256
|
+
// items={initialItems} // TODO: fix useItems if actually using this
|
|
1160
1257
|
,
|
|
1161
1258
|
onItemsChange: onItemsChange,
|
|
1162
1259
|
selectedCount: selectedCount,
|
|
@@ -1408,4 +1505,4 @@ function MediasResourcePicker(_ref) {
|
|
|
1408
1505
|
MediasResourcePicker.propTypes = propTypes;
|
|
1409
1506
|
MediasResourcePicker.defaultProps = defaultProps;
|
|
1410
1507
|
|
|
1411
|
-
export { MediaForm, MediasApiProvider, MediasBrowser, MediasBrowserContainer, MediasPicker, MediasPickerContainer, MediasResourceBrowser, MediasResourcePicker, apiPropTypes, defaultColumns as columns, defaultFields as fields, defaultFilters as filters, useMedia$1 as useMedia, useMediaCreate$1 as useMediaCreate,
|
|
1508
|
+
export { MediaForm, MediasApiProvider, MediasBrowser, MediasBrowserContainer, MediasPicker, MediasPickerContainer, MediasResourceBrowser, MediasResourcePicker, apiPropTypes, defaultColumns as columns, defaultFields as fields, defaultFilters as filters, useMedia$1 as useMedia, useMediaCreate$1 as useMediaCreate, useMediaDelete$1 as useMediaDelete, useMediaTrash$1 as useMediaTrash, useMediaUpdate$1 as useMediaUpdate, useMedias$1 as useMedias, useMediasApi };
|
package/lib/index.js
CHANGED
|
@@ -69,16 +69,26 @@ var useMedias = function useMedias() {
|
|
|
69
69
|
var count = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;
|
|
70
70
|
var opts = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};
|
|
71
71
|
var api = useMediasApi();
|
|
72
|
+
var trashed = React.useMemo(function () {
|
|
73
|
+
var _ref = opts || {},
|
|
74
|
+
trashedOpt = _ref.trashed;
|
|
75
|
+
return trashedOpt;
|
|
76
|
+
}, [opts]);
|
|
77
|
+
var finalQuery = React.useMemo(function () {
|
|
78
|
+
return _objectSpread(_objectSpread({}, query), {}, {
|
|
79
|
+
trashed: trashed
|
|
80
|
+
});
|
|
81
|
+
}, [query, trashed]);
|
|
72
82
|
var getItems = React.useCallback(function () {
|
|
73
83
|
var requestedPage = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
|
|
74
|
-
return api.get(query, requestedPage, count);
|
|
75
|
-
}, [api, query, count]);
|
|
84
|
+
return trashed ? api.getTrashed(query, requestedPage, count) : api.get(query, requestedPage, count);
|
|
85
|
+
}, [api, query, count, trashed]);
|
|
76
86
|
var _useItemsStore = data.useItemsStore('medias', _objectSpread({
|
|
77
87
|
getPage: page !== null ? getItems : null,
|
|
78
88
|
getItems: page === null ? getItems : null,
|
|
79
89
|
page: page,
|
|
80
90
|
count: count,
|
|
81
|
-
query:
|
|
91
|
+
query: finalQuery
|
|
82
92
|
}, opts)),
|
|
83
93
|
items = _useItemsStore.items,
|
|
84
94
|
props = _objectWithoutProperties(_useItemsStore, _excluded$7);
|
|
@@ -88,34 +98,6 @@ var useMedias = function useMedias() {
|
|
|
88
98
|
};
|
|
89
99
|
var useMedias$1 = useMedias;
|
|
90
100
|
|
|
91
|
-
var useMediasRecent = function useMediasRecent(opts) {
|
|
92
|
-
var key = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'media-gallery-recent-searches';
|
|
93
|
-
var addSearchValue = React.useCallback(function (value) {
|
|
94
|
-
if (typeof window !== 'undefined' && typeof window.localStorage !== 'undefined' && value) {
|
|
95
|
-
var recent = window.localStorage.getItem(key) || null;
|
|
96
|
-
var current = recent !== null ? JSON.parse(recent || '[]') : [];
|
|
97
|
-
var encoded = JSON.stringify([value].concat(_toConsumableArray(current)));
|
|
98
|
-
window.localStorage.setItem(key, encoded);
|
|
99
|
-
return true;
|
|
100
|
-
}
|
|
101
|
-
return false;
|
|
102
|
-
}, [key]);
|
|
103
|
-
var getSearchValues = React.useCallback(function () {
|
|
104
|
-
var count = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 5;
|
|
105
|
-
if (typeof window !== 'undefined' && typeof window.localStorage !== 'undefined') {
|
|
106
|
-
var recent = window.localStorage.getItem(key) || null;
|
|
107
|
-
var current = recent !== null ? JSON.parse(recent || '[]') : [];
|
|
108
|
-
return current.slice(0, count);
|
|
109
|
-
}
|
|
110
|
-
return [];
|
|
111
|
-
}, [key]);
|
|
112
|
-
return {
|
|
113
|
-
addSearchValue: addSearchValue,
|
|
114
|
-
getSearchValues: getSearchValues
|
|
115
|
-
};
|
|
116
|
-
};
|
|
117
|
-
var useMediasRecent$1 = useMediasRecent;
|
|
118
|
-
|
|
119
101
|
var _excluded$6 = ["data"];
|
|
120
102
|
var useMedia = function useMedia(id, opts) {
|
|
121
103
|
var api = useMediasApi();
|
|
@@ -134,19 +116,19 @@ var useMedia$1 = useMedia;
|
|
|
134
116
|
var useMediaCreate = function useMediaCreate() {
|
|
135
117
|
var _useState = React.useState(false),
|
|
136
118
|
_useState2 = _slicedToArray(_useState, 2),
|
|
137
|
-
|
|
138
|
-
|
|
119
|
+
creating = _useState2[0],
|
|
120
|
+
setCreating = _useState2[1];
|
|
139
121
|
var api = useMediasApi();
|
|
140
122
|
var create = React.useCallback(function (data) {
|
|
141
|
-
|
|
123
|
+
setCreating(true);
|
|
142
124
|
return api.create(data).then(function (response) {
|
|
143
|
-
|
|
125
|
+
setCreating(false);
|
|
144
126
|
return response;
|
|
145
127
|
});
|
|
146
|
-
}, [api,
|
|
128
|
+
}, [api, setCreating]);
|
|
147
129
|
return {
|
|
148
130
|
create: create,
|
|
149
|
-
|
|
131
|
+
creating: creating
|
|
150
132
|
};
|
|
151
133
|
};
|
|
152
134
|
var useMediaCreate$1 = useMediaCreate;
|
|
@@ -154,41 +136,62 @@ var useMediaCreate$1 = useMediaCreate;
|
|
|
154
136
|
var useMediaUpdate = function useMediaUpdate() {
|
|
155
137
|
var _useState = React.useState(false),
|
|
156
138
|
_useState2 = _slicedToArray(_useState, 2),
|
|
157
|
-
|
|
158
|
-
|
|
139
|
+
updating = _useState2[0],
|
|
140
|
+
setUpdating = _useState2[1];
|
|
159
141
|
var api = useMediasApi();
|
|
160
142
|
var update = React.useCallback(function (id, data) {
|
|
161
|
-
|
|
143
|
+
setUpdating(true);
|
|
162
144
|
return api.update(id, data).then(function (response) {
|
|
163
|
-
|
|
145
|
+
setUpdating(false);
|
|
164
146
|
return response;
|
|
165
147
|
});
|
|
166
|
-
}, [api,
|
|
148
|
+
}, [api, setUpdating]);
|
|
167
149
|
return {
|
|
168
150
|
update: update,
|
|
169
|
-
|
|
151
|
+
updating: updating
|
|
170
152
|
};
|
|
171
153
|
};
|
|
172
154
|
var useMediaUpdate$1 = useMediaUpdate;
|
|
173
155
|
|
|
174
|
-
var
|
|
156
|
+
var useMediaDelete = function useMediaDelete() {
|
|
175
157
|
var _useState = React.useState(false),
|
|
176
158
|
_useState2 = _slicedToArray(_useState, 2),
|
|
177
|
-
|
|
178
|
-
|
|
159
|
+
deleting = _useState2[0],
|
|
160
|
+
setDeleting = _useState2[1];
|
|
179
161
|
var api = useMediasApi();
|
|
180
|
-
var
|
|
181
|
-
|
|
162
|
+
var mediaDelete = React.useCallback(function (id, data) {
|
|
163
|
+
setDeleting(true);
|
|
182
164
|
return api["delete"](id, data).then(function (response) {
|
|
183
|
-
|
|
165
|
+
setDeleting(false);
|
|
184
166
|
return response;
|
|
185
167
|
});
|
|
186
|
-
}, [api,
|
|
168
|
+
}, [api, setDeleting]);
|
|
187
169
|
return {
|
|
188
|
-
|
|
189
|
-
|
|
170
|
+
mediaDelete: mediaDelete,
|
|
171
|
+
deleting: deleting
|
|
172
|
+
};
|
|
173
|
+
};
|
|
174
|
+
var useMediaDelete$1 = useMediaDelete;
|
|
175
|
+
|
|
176
|
+
var useMediaTrash = function useMediaTrash() {
|
|
177
|
+
var _useState = React.useState(false),
|
|
178
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
179
|
+
trashing = _useState2[0],
|
|
180
|
+
setTrashing = _useState2[1];
|
|
181
|
+
var api = useMediasApi();
|
|
182
|
+
var mediaTrash = React.useCallback(function (id, data) {
|
|
183
|
+
setTrashing(true);
|
|
184
|
+
return api.trash(id, data).then(function (response) {
|
|
185
|
+
setTrashing(false);
|
|
186
|
+
return response;
|
|
187
|
+
});
|
|
188
|
+
}, [api, setTrashing]);
|
|
189
|
+
return {
|
|
190
|
+
mediaTrash: mediaTrash,
|
|
191
|
+
trashing: trashing
|
|
190
192
|
};
|
|
191
193
|
};
|
|
194
|
+
var useMediaTrash$1 = useMediaTrash;
|
|
192
195
|
|
|
193
196
|
var styles = {"mediaFrame":"panneau-medias-mediaFrame","playButton":"panneau-medias-playButton"};
|
|
194
197
|
|
|
@@ -383,6 +386,7 @@ var propTypes$7 = {
|
|
|
383
386
|
onSave: PropTypes.func,
|
|
384
387
|
onDelete: PropTypes.func,
|
|
385
388
|
onClose: PropTypes.func,
|
|
389
|
+
withTrash: PropTypes.bool,
|
|
386
390
|
className: PropTypes.string,
|
|
387
391
|
children: PropTypes.node
|
|
388
392
|
};
|
|
@@ -393,6 +397,7 @@ var defaultProps$7 = {
|
|
|
393
397
|
onSave: null,
|
|
394
398
|
onDelete: null,
|
|
395
399
|
onClose: null,
|
|
400
|
+
withTrash: false,
|
|
396
401
|
className: null,
|
|
397
402
|
children: null
|
|
398
403
|
};
|
|
@@ -403,25 +408,31 @@ function MediaForm(_ref) {
|
|
|
403
408
|
onSave = _ref.onSave,
|
|
404
409
|
onDelete = _ref.onDelete,
|
|
405
410
|
onClose = _ref.onClose,
|
|
411
|
+
withTrash = _ref.withTrash,
|
|
406
412
|
className = _ref.className,
|
|
407
413
|
children = _ref.children;
|
|
408
414
|
var FieldsComponent = contexts.useFieldComponent('fields');
|
|
409
415
|
var _useMediaUpdate = useMediaUpdate$1(),
|
|
410
416
|
update = _useMediaUpdate.update,
|
|
411
|
-
updating = _useMediaUpdate.
|
|
412
|
-
var
|
|
413
|
-
|
|
414
|
-
|
|
417
|
+
updating = _useMediaUpdate.updating;
|
|
418
|
+
var _useMediaTrash = useMediaTrash$1(),
|
|
419
|
+
mediaTrash = _useMediaTrash.mediaTrash,
|
|
420
|
+
trashing = _useMediaTrash.trashing;
|
|
421
|
+
var _useMediaDelete = useMediaDelete$1(),
|
|
422
|
+
mediaDelete = _useMediaDelete.mediaDelete,
|
|
423
|
+
deleting = _useMediaDelete.deleting;
|
|
415
424
|
var _useState = React.useState(false),
|
|
416
425
|
_useState2 = _slicedToArray(_useState, 2),
|
|
417
426
|
changed = _useState2[0],
|
|
418
427
|
setChanged = _useState2[1];
|
|
419
|
-
var disabled = updating ||
|
|
428
|
+
var disabled = updating || deleting || trashing || initialValue === null;
|
|
420
429
|
var _ref2 = initialValue || {},
|
|
421
430
|
_ref2$name = _ref2.name,
|
|
422
431
|
name = _ref2$name === void 0 ? null : _ref2$name,
|
|
423
432
|
_ref2$type = _ref2.type,
|
|
424
|
-
type = _ref2$type === void 0 ? null : _ref2$type
|
|
433
|
+
type = _ref2$type === void 0 ? null : _ref2$type,
|
|
434
|
+
_ref2$deletedAt = _ref2.deletedAt,
|
|
435
|
+
deletedAt = _ref2$deletedAt === void 0 ? null : _ref2$deletedAt;
|
|
425
436
|
var onChangeMedia = React.useCallback(function (newValue) {
|
|
426
437
|
if (onChange !== null) {
|
|
427
438
|
onChange(newValue);
|
|
@@ -435,20 +446,32 @@ function MediaForm(_ref) {
|
|
|
435
446
|
setChanged(false);
|
|
436
447
|
}, [onChange, setChanged]);
|
|
437
448
|
var onDeleteMedia = React.useCallback(function () {
|
|
438
|
-
// Destroy
|
|
439
449
|
var _ref3 = initialValue || {},
|
|
440
450
|
_ref3$id = _ref3.id,
|
|
441
451
|
id = _ref3$id === void 0 ? null : _ref3$id;
|
|
442
|
-
|
|
443
|
-
|
|
444
|
-
onDelete
|
|
445
|
-
|
|
446
|
-
|
|
447
|
-
|
|
448
|
-
onClose
|
|
449
|
-
|
|
450
|
-
|
|
451
|
-
|
|
452
|
+
if (withTrash && deletedAt !== null) {
|
|
453
|
+
mediaTrash(id, initialValue).then(function () {
|
|
454
|
+
if (onDelete !== null) {
|
|
455
|
+
onDelete();
|
|
456
|
+
}
|
|
457
|
+
setChanged(false);
|
|
458
|
+
if (onClose !== null) {
|
|
459
|
+
onClose();
|
|
460
|
+
}
|
|
461
|
+
});
|
|
462
|
+
} else {
|
|
463
|
+
// Destroy
|
|
464
|
+
mediaDelete(id, initialValue).then(function () {
|
|
465
|
+
if (onDelete !== null) {
|
|
466
|
+
onDelete();
|
|
467
|
+
}
|
|
468
|
+
setChanged(false);
|
|
469
|
+
if (onClose !== null) {
|
|
470
|
+
onClose();
|
|
471
|
+
}
|
|
472
|
+
});
|
|
473
|
+
}
|
|
474
|
+
}, [initialValue, mediaDelete, mediaTrash, deletedAt, setChanged, withTrash]);
|
|
452
475
|
var postForm = React.useCallback(function (action, data) {
|
|
453
476
|
return initialValue !== null ? update(initialValue.id, data) : new Promise();
|
|
454
477
|
}, [initialValue, update]);
|
|
@@ -479,9 +502,17 @@ function MediaForm(_ref) {
|
|
|
479
502
|
}, type)), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Button, {
|
|
480
503
|
className: "me-2 mb-1 mt-1",
|
|
481
504
|
theme: "danger",
|
|
505
|
+
icon: withTrash && deletedAt !== null ? 'trash-fill' : 'trash',
|
|
506
|
+
iconPosition: "right",
|
|
482
507
|
onClick: onDeleteMedia,
|
|
483
|
-
disabled:
|
|
484
|
-
}, /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
|
|
508
|
+
disabled: deleting || trashing
|
|
509
|
+
}, withTrash && deletedAt === null ? /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
|
|
510
|
+
id: "PSlT7H",
|
|
511
|
+
defaultMessage: [{
|
|
512
|
+
"type": 0,
|
|
513
|
+
"value": "Trash"
|
|
514
|
+
}]
|
|
515
|
+
}) : /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
|
|
485
516
|
id: "Bhu3B2",
|
|
486
517
|
defaultMessage: [{
|
|
487
518
|
"type": 0,
|
|
@@ -490,8 +521,10 @@ function MediaForm(_ref) {
|
|
|
490
521
|
})), onSave !== null ? /*#__PURE__*/React.createElement(Button, {
|
|
491
522
|
className: "mb-1 mt-1",
|
|
492
523
|
theme: "primary",
|
|
524
|
+
icon: changed ? 'check-all' : 'check',
|
|
525
|
+
iconPosition: "right",
|
|
493
526
|
onClick: onSubmit,
|
|
494
|
-
disabled: !changed || updating ||
|
|
527
|
+
disabled: !changed || updating || deleting
|
|
495
528
|
}, /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
|
|
496
529
|
id: "R1HYj0",
|
|
497
530
|
defaultMessage: [{
|
|
@@ -682,7 +715,7 @@ var defaultColumns = [{
|
|
|
682
715
|
"value": "Actions"
|
|
683
716
|
}]
|
|
684
717
|
}),
|
|
685
|
-
actions: ['edit']
|
|
718
|
+
actions: ['edit', 'delete']
|
|
686
719
|
// component: ItemActions,
|
|
687
720
|
// label: 'Edit',
|
|
688
721
|
// url: '/edit/1',
|
|
@@ -771,7 +804,7 @@ var defaultFilters = [{
|
|
|
771
804
|
];
|
|
772
805
|
|
|
773
806
|
var _excluded$5 = ["page", "count"],
|
|
774
|
-
_excluded2 = ["types"];
|
|
807
|
+
_excluded2 = ["types", "trashed"];
|
|
775
808
|
var propTypes$5 = {
|
|
776
809
|
items: core.PropTypes.medias,
|
|
777
810
|
extraItems: core.PropTypes.medias,
|
|
@@ -790,9 +823,11 @@ var propTypes$5 = {
|
|
|
790
823
|
onLayoutChange: PropTypes.func,
|
|
791
824
|
selectedCount: PropTypes.number,
|
|
792
825
|
onClearSelected: PropTypes.func,
|
|
826
|
+
withTrash: PropTypes.bool,
|
|
793
827
|
withStickySelection: PropTypes.bool,
|
|
794
828
|
className: PropTypes.string,
|
|
795
|
-
buttonsClassName: PropTypes.string
|
|
829
|
+
buttonsClassName: PropTypes.string,
|
|
830
|
+
formChildren: PropTypes.node
|
|
796
831
|
};
|
|
797
832
|
var defaultProps$5 = {
|
|
798
833
|
items: null,
|
|
@@ -822,9 +857,11 @@ var defaultProps$5 = {
|
|
|
822
857
|
onLayoutChange: null,
|
|
823
858
|
selectedCount: null,
|
|
824
859
|
onClearSelected: null,
|
|
860
|
+
withTrash: false,
|
|
825
861
|
withStickySelection: false,
|
|
826
862
|
className: null,
|
|
827
|
-
buttonsClassName: null
|
|
863
|
+
buttonsClassName: null,
|
|
864
|
+
formChildren: null
|
|
828
865
|
};
|
|
829
866
|
function MediasBrowser(_ref) {
|
|
830
867
|
var initialItems = _ref.items,
|
|
@@ -844,9 +881,11 @@ function MediasBrowser(_ref) {
|
|
|
844
881
|
onLayoutChange = _ref.onLayoutChange,
|
|
845
882
|
selectedCount = _ref.selectedCount,
|
|
846
883
|
onClearSelected = _ref.onClearSelected,
|
|
884
|
+
withTrash = _ref.withTrash,
|
|
847
885
|
withStickySelection = _ref.withStickySelection,
|
|
848
886
|
className = _ref.className,
|
|
849
|
-
buttonsClassName = _ref.buttonsClassName
|
|
887
|
+
buttonsClassName = _ref.buttonsClassName,
|
|
888
|
+
formChildren = _ref.formChildren;
|
|
850
889
|
var _useState = React.useState(initialItems || null),
|
|
851
890
|
_useState2 = _slicedToArray(_useState, 1),
|
|
852
891
|
baseItems = _useState2[0];
|
|
@@ -885,9 +924,24 @@ function MediasBrowser(_ref) {
|
|
|
885
924
|
// eslint-disable-next-line no-unused-vars
|
|
886
925
|
var _ref3 = query || {};
|
|
887
926
|
_ref3.types;
|
|
927
|
+
_ref3.trashed;
|
|
888
928
|
var queryWithoutTypes = _objectWithoutProperties(_ref3, _excluded2);
|
|
929
|
+
var _useMediaTrash = useMediaTrash$1(),
|
|
930
|
+
mediaTrash = _useMediaTrash.mediaTrash,
|
|
931
|
+
trashing = _useMediaTrash.trashing;
|
|
932
|
+
var _useMediaDelete = useMediaDelete$1(),
|
|
933
|
+
mediaDelete = _useMediaDelete.mediaDelete,
|
|
934
|
+
deleting = _useMediaDelete.deleting;
|
|
935
|
+
var _useState3 = React.useState(false),
|
|
936
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
937
|
+
showTrashed = _useState4[0],
|
|
938
|
+
setShowTrashed = _useState4[1];
|
|
939
|
+
var onClickTrash = React.useCallback(function () {
|
|
940
|
+
setShowTrashed(!showTrashed);
|
|
941
|
+
}, [showTrashed, setShowTrashed]);
|
|
889
942
|
var _useMedias = useMedias$1(query, page, count, {
|
|
890
|
-
items: baseItems
|
|
943
|
+
items: baseItems,
|
|
944
|
+
trashed: showTrashed
|
|
891
945
|
}),
|
|
892
946
|
items = _useMedias.items,
|
|
893
947
|
allItems = _useMedias.allItems,
|
|
@@ -906,10 +960,10 @@ function MediasBrowser(_ref) {
|
|
|
906
960
|
onItemsChange(items);
|
|
907
961
|
}
|
|
908
962
|
}, [items, onItemsChange]);
|
|
909
|
-
var
|
|
910
|
-
|
|
911
|
-
layout =
|
|
912
|
-
setLayout =
|
|
963
|
+
var _useState5 = React.useState(initialLayout || 'table'),
|
|
964
|
+
_useState6 = _slicedToArray(_useState5, 2),
|
|
965
|
+
layout = _useState6[0],
|
|
966
|
+
setLayout = _useState6[1];
|
|
913
967
|
var hasLayouts = React.useMemo(function () {
|
|
914
968
|
return layouts !== null && layouts.length > 1;
|
|
915
969
|
}, [layouts]);
|
|
@@ -949,8 +1003,17 @@ function MediasBrowser(_ref) {
|
|
|
949
1003
|
alwaysShowButtons: true
|
|
950
1004
|
});
|
|
951
1005
|
var finalFilters = React.useMemo(function () {
|
|
952
|
-
|
|
953
|
-
|
|
1006
|
+
var partialFilters = withTrash ? (filters || []).concat([{
|
|
1007
|
+
name: 'trashed',
|
|
1008
|
+
component: 'button',
|
|
1009
|
+
theme: showTrashed ? 'danger' : 'secondary',
|
|
1010
|
+
outline: !showTrashed,
|
|
1011
|
+
activeTheme: 'danger',
|
|
1012
|
+
icon: showTrashed ? 'trash-fill' : 'trash',
|
|
1013
|
+
onClick: onClickTrash
|
|
1014
|
+
}]) : filters;
|
|
1015
|
+
if (types !== null && partialFilters !== null) {
|
|
1016
|
+
return (partialFilters || []).map(function (filter) {
|
|
954
1017
|
var _ref4 = filter || {},
|
|
955
1018
|
_ref4$id = _ref4.id,
|
|
956
1019
|
id = _ref4$id === void 0 ? null : _ref4$id;
|
|
@@ -959,17 +1022,37 @@ function MediasBrowser(_ref) {
|
|
|
959
1022
|
}) : filter;
|
|
960
1023
|
});
|
|
961
1024
|
}
|
|
962
|
-
return
|
|
963
|
-
}, [filters, types]);
|
|
1025
|
+
return partialFilters;
|
|
1026
|
+
}, [filters, types, withTrash, showTrashed, onClickTrash]);
|
|
1027
|
+
var finalColumns = React.useMemo(function () {
|
|
1028
|
+
return withTrash && showTrashed ? (columns || []).map(function (column) {
|
|
1029
|
+
var _ref5 = column || {},
|
|
1030
|
+
_ref5$id = _ref5.id,
|
|
1031
|
+
columnId = _ref5$id === void 0 ? null : _ref5$id;
|
|
1032
|
+
if (columnId === 'created_at') {
|
|
1033
|
+
return _objectSpread(_objectSpread({}, column), {}, {
|
|
1034
|
+
path: 'deleted_at',
|
|
1035
|
+
label: /*#__PURE__*/React.createElement(reactIntl.FormattedMessage, {
|
|
1036
|
+
id: "uds4wJ",
|
|
1037
|
+
defaultMessage: [{
|
|
1038
|
+
"type": 0,
|
|
1039
|
+
"value": "Deleted at"
|
|
1040
|
+
}]
|
|
1041
|
+
})
|
|
1042
|
+
});
|
|
1043
|
+
}
|
|
1044
|
+
return column;
|
|
1045
|
+
}) : columns;
|
|
1046
|
+
}, [columns, withTrash, showTrashed]);
|
|
964
1047
|
var finalItems = React.useMemo(function () {
|
|
965
1048
|
if (withStickySelection && extraItems !== null) {
|
|
966
1049
|
return uniqBy([].concat(_toConsumableArray((extraItems || []).map(function (item) {
|
|
967
1050
|
var _item$id = item.id,
|
|
968
1051
|
itemId = _item$id === void 0 ? null : _item$id;
|
|
969
1052
|
return (allItems || []).find(function () {
|
|
970
|
-
var
|
|
971
|
-
|
|
972
|
-
otherId =
|
|
1053
|
+
var _ref6 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
|
|
1054
|
+
_ref6$id = _ref6.id,
|
|
1055
|
+
otherId = _ref6$id === void 0 ? null : _ref6$id;
|
|
973
1056
|
return otherId === itemId;
|
|
974
1057
|
}) || item || null;
|
|
975
1058
|
}).filter(function (it) {
|
|
@@ -999,8 +1082,9 @@ function MediasBrowser(_ref) {
|
|
|
999
1082
|
fields: fields,
|
|
1000
1083
|
onChange: setCurrentMedia,
|
|
1001
1084
|
onSave: onSaveMedia,
|
|
1002
|
-
onClose: onCloseMedia
|
|
1003
|
-
|
|
1085
|
+
onClose: onCloseMedia,
|
|
1086
|
+
withTrash: withTrash
|
|
1087
|
+
}, formChildren)) : /*#__PURE__*/React.createElement(React.Fragment, null, filters !== null ? /*#__PURE__*/React.createElement(Filters, {
|
|
1004
1088
|
value: query,
|
|
1005
1089
|
clearValue: types !== null ? queryWithoutTypes : null,
|
|
1006
1090
|
filters: finalFilters,
|
|
@@ -1012,10 +1096,10 @@ function MediasBrowser(_ref) {
|
|
|
1012
1096
|
className: buttonsClassName
|
|
1013
1097
|
}) : null) : null, filters === null && buttons !== null ? /*#__PURE__*/React.createElement("div", {
|
|
1014
1098
|
className: "mt-2 mb-2"
|
|
1015
|
-
},
|
|
1099
|
+
}, /*#__PURE__*/React.createElement(Buttons, {
|
|
1016
1100
|
items: buttons,
|
|
1017
1101
|
className: buttonsClassName
|
|
1018
|
-
})
|
|
1102
|
+
})) : null, /*#__PURE__*/React.createElement("div", {
|
|
1019
1103
|
className: classNames(['d-flex', 'mt-1', 'mb-3', {
|
|
1020
1104
|
'justify-content-between': hasLayouts,
|
|
1021
1105
|
'justify-content-end': !hasLayouts
|
|
@@ -1053,7 +1137,7 @@ function MediasBrowser(_ref) {
|
|
|
1053
1137
|
loading: loading
|
|
1054
1138
|
})) : null, layout === 'table' ? /*#__PURE__*/React.createElement(Table, Object.assign({
|
|
1055
1139
|
theme: theme,
|
|
1056
|
-
columns:
|
|
1140
|
+
columns: finalColumns,
|
|
1057
1141
|
displayPlaceholder: /*#__PURE__*/React.createElement("span", {
|
|
1058
1142
|
className: "text-secondary text-opacity-75"
|
|
1059
1143
|
}, "\u2014"),
|
|
@@ -1064,6 +1148,19 @@ function MediasBrowser(_ref) {
|
|
|
1064
1148
|
items: finalItems,
|
|
1065
1149
|
loading: loading,
|
|
1066
1150
|
actionsProps: {
|
|
1151
|
+
getDeletePropsFromItem: function getDeletePropsFromItem() {
|
|
1152
|
+
var _ref7 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
|
|
1153
|
+
_ref7$id = _ref7.id,
|
|
1154
|
+
id = _ref7$id === void 0 ? null : _ref7$id;
|
|
1155
|
+
return {
|
|
1156
|
+
href: null,
|
|
1157
|
+
onClick: function onClick() {
|
|
1158
|
+
return showTrashed ? mediaDelete(id) : mediaTrash(id);
|
|
1159
|
+
},
|
|
1160
|
+
disabled: trashing || deleting,
|
|
1161
|
+
icon: showTrashed ? 'trash-fill' : 'trash'
|
|
1162
|
+
};
|
|
1163
|
+
},
|
|
1067
1164
|
getEditPropsFromItem: function getEditPropsFromItem(it) {
|
|
1068
1165
|
return {
|
|
1069
1166
|
href: null,
|
|
@@ -1157,8 +1254,8 @@ function MediasPicker(_ref) {
|
|
|
1157
1254
|
onSelectPage: onSelectPage,
|
|
1158
1255
|
selectedItems: selectedItems,
|
|
1159
1256
|
pageSelected: pageSelected
|
|
1160
|
-
}, tableProps)
|
|
1161
|
-
items
|
|
1257
|
+
}, tableProps)
|
|
1258
|
+
// items={initialItems} // TODO: fix useItems if actually using this
|
|
1162
1259
|
,
|
|
1163
1260
|
onItemsChange: onItemsChange,
|
|
1164
1261
|
selectedCount: selectedCount,
|
|
@@ -1424,7 +1521,8 @@ exports.fields = defaultFields;
|
|
|
1424
1521
|
exports.filters = defaultFilters;
|
|
1425
1522
|
exports.useMedia = useMedia$1;
|
|
1426
1523
|
exports.useMediaCreate = useMediaCreate$1;
|
|
1524
|
+
exports.useMediaDelete = useMediaDelete$1;
|
|
1525
|
+
exports.useMediaTrash = useMediaTrash$1;
|
|
1427
1526
|
exports.useMediaUpdate = useMediaUpdate$1;
|
|
1428
1527
|
exports.useMedias = useMedias$1;
|
|
1429
1528
|
exports.useMediasApi = useMediasApi;
|
|
1430
|
-
exports.useMediasRecentSearches = useMediasRecent$1;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@panneau/medias",
|
|
3
|
-
"version": "3.0.
|
|
3
|
+
"version": "3.0.175",
|
|
4
4
|
"description": "",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"javascript"
|
|
@@ -46,20 +46,20 @@
|
|
|
46
46
|
},
|
|
47
47
|
"dependencies": {
|
|
48
48
|
"@babel/runtime": "^7.12.5",
|
|
49
|
-
"@panneau/core": "^3.0.
|
|
50
|
-
"@panneau/data": "^3.0.
|
|
51
|
-
"@panneau/display-image": "^3.0.
|
|
52
|
-
"@panneau/element-button": "^3.0.
|
|
53
|
-
"@panneau/element-buttons": "^3.0.
|
|
54
|
-
"@panneau/element-form": "^3.0.
|
|
55
|
-
"@panneau/element-form-status": "^3.0.
|
|
56
|
-
"@panneau/element-grid": "^3.0.
|
|
57
|
-
"@panneau/element-icon": "^3.0.
|
|
58
|
-
"@panneau/element-media-card": "^3.0.
|
|
59
|
-
"@panneau/element-media-player": "^3.0.
|
|
60
|
-
"@panneau/element-pagination": "^3.0.
|
|
61
|
-
"@panneau/element-table": "^3.0.
|
|
62
|
-
"@panneau/filter-filters": "^3.0.
|
|
49
|
+
"@panneau/core": "^3.0.175",
|
|
50
|
+
"@panneau/data": "^3.0.175",
|
|
51
|
+
"@panneau/display-image": "^3.0.175",
|
|
52
|
+
"@panneau/element-button": "^3.0.175",
|
|
53
|
+
"@panneau/element-buttons": "^3.0.175",
|
|
54
|
+
"@panneau/element-form": "^3.0.175",
|
|
55
|
+
"@panneau/element-form-status": "^3.0.175",
|
|
56
|
+
"@panneau/element-grid": "^3.0.175",
|
|
57
|
+
"@panneau/element-icon": "^3.0.175",
|
|
58
|
+
"@panneau/element-media-card": "^3.0.175",
|
|
59
|
+
"@panneau/element-media-player": "^3.0.175",
|
|
60
|
+
"@panneau/element-pagination": "^3.0.175",
|
|
61
|
+
"@panneau/element-table": "^3.0.175",
|
|
62
|
+
"@panneau/filter-filters": "^3.0.175",
|
|
63
63
|
"classnames": "^2.5.1",
|
|
64
64
|
"lodash": "^4.17.21",
|
|
65
65
|
"prop-types": "^15.7.2",
|
|
@@ -68,5 +68,5 @@
|
|
|
68
68
|
"publishConfig": {
|
|
69
69
|
"access": "public"
|
|
70
70
|
},
|
|
71
|
-
"gitHead": "
|
|
71
|
+
"gitHead": "cb8320f1041e7ced6bcf77dd6d32661950215a92"
|
|
72
72
|
}
|