@strapi/upload 5.36.0 → 5.37.0

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 (119) hide show
  1. package/dist/admin/future/App.js +5 -12
  2. package/dist/admin/future/App.js.map +1 -1
  3. package/dist/admin/future/App.mjs +5 -12
  4. package/dist/admin/future/App.mjs.map +1 -1
  5. package/dist/admin/future/components/UploadProgressDialog.js +494 -0
  6. package/dist/admin/future/components/UploadProgressDialog.js.map +1 -0
  7. package/dist/admin/future/components/UploadProgressDialog.mjs +473 -0
  8. package/dist/admin/future/components/UploadProgressDialog.mjs.map +1 -0
  9. package/dist/admin/future/pages/Assets/AssetsPage.js +183 -181
  10. package/dist/admin/future/pages/Assets/AssetsPage.js.map +1 -1
  11. package/dist/admin/future/pages/Assets/AssetsPage.mjs +190 -188
  12. package/dist/admin/future/pages/Assets/AssetsPage.mjs.map +1 -1
  13. package/dist/admin/future/pages/Assets/components/AssetsGrid.js +95 -13
  14. package/dist/admin/future/pages/Assets/components/AssetsGrid.js.map +1 -1
  15. package/dist/admin/future/pages/Assets/components/AssetsGrid.mjs +97 -15
  16. package/dist/admin/future/pages/Assets/components/AssetsGrid.mjs.map +1 -1
  17. package/dist/admin/future/pages/Assets/components/AssetsTable.js +99 -6
  18. package/dist/admin/future/pages/Assets/components/AssetsTable.js.map +1 -1
  19. package/dist/admin/future/pages/Assets/components/AssetsTable.mjs +100 -7
  20. package/dist/admin/future/pages/Assets/components/AssetsTable.mjs.map +1 -1
  21. package/dist/admin/future/pages/Assets/components/DropZone/UploadDropZone.js +127 -0
  22. package/dist/admin/future/pages/Assets/components/DropZone/UploadDropZone.js.map +1 -0
  23. package/dist/admin/future/pages/Assets/components/DropZone/UploadDropZone.mjs +105 -0
  24. package/dist/admin/future/pages/Assets/components/DropZone/UploadDropZone.mjs.map +1 -0
  25. package/dist/admin/future/pages/Assets/hooks/useFolderInfo.js +50 -0
  26. package/dist/admin/future/pages/Assets/hooks/useFolderInfo.js.map +1 -0
  27. package/dist/admin/future/pages/Assets/hooks/useFolderInfo.mjs +48 -0
  28. package/dist/admin/future/pages/Assets/hooks/useFolderInfo.mjs.map +1 -0
  29. package/dist/admin/future/pages/Assets/hooks/useFolderNavigation.js +20 -0
  30. package/dist/admin/future/pages/Assets/hooks/useFolderNavigation.js.map +1 -0
  31. package/dist/admin/future/pages/Assets/hooks/useFolderNavigation.mjs +18 -0
  32. package/dist/admin/future/pages/Assets/hooks/useFolderNavigation.mjs.map +1 -0
  33. package/dist/admin/future/pages/Assets/hooks/useInfiniteAssets.js +77 -0
  34. package/dist/admin/future/pages/Assets/hooks/useInfiniteAssets.js.map +1 -0
  35. package/dist/admin/future/pages/Assets/hooks/useInfiniteAssets.mjs +74 -0
  36. package/dist/admin/future/pages/Assets/hooks/useInfiniteAssets.mjs.map +1 -0
  37. package/dist/admin/future/services/api.js +419 -9
  38. package/dist/admin/future/services/api.js.map +1 -1
  39. package/dist/admin/future/services/api.mjs +417 -9
  40. package/dist/admin/future/services/api.mjs.map +1 -1
  41. package/dist/admin/future/services/assets.js +32 -3
  42. package/dist/admin/future/services/assets.js.map +1 -1
  43. package/dist/admin/future/services/assets.mjs +32 -3
  44. package/dist/admin/future/services/assets.mjs.map +1 -1
  45. package/dist/admin/future/services/folders.js +101 -0
  46. package/dist/admin/future/services/folders.js.map +1 -0
  47. package/dist/admin/future/services/folders.mjs +98 -0
  48. package/dist/admin/future/services/folders.mjs.map +1 -0
  49. package/dist/admin/future/store/hooks.js +10 -0
  50. package/dist/admin/future/store/hooks.js.map +1 -0
  51. package/dist/admin/future/store/hooks.mjs +7 -0
  52. package/dist/admin/future/store/hooks.mjs.map +1 -0
  53. package/dist/admin/future/store/uploadProgress.js +156 -0
  54. package/dist/admin/future/store/uploadProgress.js.map +1 -0
  55. package/dist/admin/future/store/uploadProgress.mjs +143 -0
  56. package/dist/admin/future/store/uploadProgress.mjs.map +1 -0
  57. package/dist/admin/index.js +11 -0
  58. package/dist/admin/index.js.map +1 -1
  59. package/dist/admin/index.mjs +11 -0
  60. package/dist/admin/index.mjs.map +1 -1
  61. package/dist/admin/package.json.js +11 -10
  62. package/dist/admin/package.json.js.map +1 -1
  63. package/dist/admin/package.json.mjs +11 -10
  64. package/dist/admin/package.json.mjs.map +1 -1
  65. package/dist/admin/src/future/components/UploadProgressDialog.d.ts +1 -0
  66. package/dist/admin/src/future/pages/Assets/components/AssetsGrid.d.ts +3 -1
  67. package/dist/admin/src/future/pages/Assets/components/AssetsTable.d.ts +3 -1
  68. package/dist/admin/src/future/pages/Assets/components/DropZone/UploadDropZone.d.ts +10 -0
  69. package/dist/admin/src/future/pages/Assets/hooks/useFolderInfo.d.ts +5 -0
  70. package/dist/admin/src/future/pages/Assets/hooks/useFolderNavigation.d.ts +5 -0
  71. package/dist/admin/src/future/pages/Assets/hooks/useInfiniteAssets.d.ts +17 -0
  72. package/dist/admin/src/future/services/api.d.ts +21 -3
  73. package/dist/admin/src/future/services/folders.d.ts +16 -0
  74. package/dist/admin/src/future/store/hooks.d.ts +6 -0
  75. package/dist/admin/src/future/store/uploadProgress.d.ts +46 -0
  76. package/dist/admin/translations/en.json.js +24 -0
  77. package/dist/admin/translations/en.json.js.map +1 -1
  78. package/dist/admin/translations/en.json.mjs +24 -0
  79. package/dist/admin/translations/en.json.mjs.map +1 -1
  80. package/dist/server/controllers/admin-upload.js +151 -2
  81. package/dist/server/controllers/admin-upload.js.map +1 -1
  82. package/dist/server/controllers/admin-upload.mjs +151 -2
  83. package/dist/server/controllers/admin-upload.mjs.map +1 -1
  84. package/dist/server/controllers/content-api.js +14 -6
  85. package/dist/server/controllers/content-api.js.map +1 -1
  86. package/dist/server/controllers/content-api.mjs +15 -7
  87. package/dist/server/controllers/content-api.mjs.map +1 -1
  88. package/dist/server/routes/admin.js +10 -0
  89. package/dist/server/routes/admin.js.map +1 -1
  90. package/dist/server/routes/admin.mjs +10 -0
  91. package/dist/server/routes/admin.mjs.map +1 -1
  92. package/dist/server/src/controllers/admin-upload.d.ts +12 -0
  93. package/dist/server/src/controllers/admin-upload.d.ts.map +1 -1
  94. package/dist/server/src/controllers/content-api.d.ts.map +1 -1
  95. package/dist/server/src/controllers/index.d.ts +1 -0
  96. package/dist/server/src/controllers/index.d.ts.map +1 -1
  97. package/dist/server/src/index.d.ts +1 -0
  98. package/dist/server/src/index.d.ts.map +1 -1
  99. package/dist/server/src/routes/admin.d.ts.map +1 -1
  100. package/dist/server/src/utils/mime-validation.d.ts +5 -0
  101. package/dist/server/src/utils/mime-validation.d.ts.map +1 -1
  102. package/dist/server/utils/mime-validation.js +7 -4
  103. package/dist/server/utils/mime-validation.js.map +1 -1
  104. package/dist/server/utils/mime-validation.mjs +7 -4
  105. package/dist/server/utils/mime-validation.mjs.map +1 -1
  106. package/dist/shared/contracts/files.d.ts +52 -0
  107. package/dist/shared/contracts/files.d.ts.map +1 -0
  108. package/dist/shared/contracts/folders.d.ts +2 -0
  109. package/package.json +11 -10
  110. package/dist/admin/future/pages/AIGenerationPage.js +0 -24
  111. package/dist/admin/future/pages/AIGenerationPage.js.map +0 -1
  112. package/dist/admin/future/pages/AIGenerationPage.mjs +0 -22
  113. package/dist/admin/future/pages/AIGenerationPage.mjs.map +0 -1
  114. package/dist/admin/future/pages/Assets/components/DropZone/DropZoneWithOverlay.js +0 -33
  115. package/dist/admin/future/pages/Assets/components/DropZone/DropZoneWithOverlay.js.map +0 -1
  116. package/dist/admin/future/pages/Assets/components/DropZone/DropZoneWithOverlay.mjs +0 -31
  117. package/dist/admin/future/pages/Assets/components/DropZone/DropZoneWithOverlay.mjs.map +0 -1
  118. package/dist/admin/src/future/pages/AIGenerationPage.d.ts +0 -1
  119. package/dist/admin/src/future/pages/Assets/components/DropZone/DropZoneWithOverlay.d.ts +0 -4
@@ -8,15 +8,17 @@ var designSystem = require('@strapi/design-system');
8
8
  var icons = require('@strapi/icons');
9
9
  var reactIntl = require('react-intl');
10
10
  var styledComponents = require('styled-components');
11
- var usePersistentState = require('../../../hooks/usePersistentState.js');
12
11
  var api = require('../../services/api.js');
13
- var assets = require('../../services/assets.js');
12
+ var folders = require('../../services/folders.js');
14
13
  var translations = require('../../utils/translations.js');
15
14
  var AssetsGrid = require('./components/AssetsGrid.js');
16
15
  var AssetsTable = require('./components/AssetsTable.js');
17
- var DropZoneWithOverlay = require('./components/DropZone/DropZoneWithOverlay.js');
16
+ var UploadDropZone = require('./components/DropZone/UploadDropZone.js');
18
17
  var UploadDropZoneContext = require('./components/DropZone/UploadDropZoneContext.js');
19
18
  var constants = require('./constants.js');
19
+ var useFolderInfo = require('./hooks/useFolderInfo.js');
20
+ var useFolderNavigation = require('./hooks/useFolderNavigation.js');
21
+ var useInfiniteAssets = require('./hooks/useInfiniteAssets.js');
20
22
 
21
23
  function _interopNamespaceDefault(e) {
22
24
  var n = Object.create(null);
@@ -37,13 +39,28 @@ function _interopNamespaceDefault(e) {
37
39
 
38
40
  var ToggleGroup__namespace = /*#__PURE__*/_interopNamespaceDefault(ToggleGroup);
39
41
 
40
- const AssetsView = ({ view })=>{
42
+ const INTERSECTION_OPTIONS = {
43
+ threshold: 0.1
44
+ };
45
+ const AssetsView = ({ view, folderId })=>{
41
46
  const { formatMessage } = reactIntl.useIntl();
42
- const { data, isLoading, error } = assets.useGetAssetsQuery({
43
- folder: null
47
+ const { assets, isLoading: isLoadingAssets, isFetchingMore, hasNextPage, fetchNextPage, error } = useInfiniteAssets.useInfiniteAssets({
48
+ folder: folderId
49
+ });
50
+ const { data: folders$1 = [], isLoading: isLoadingFolders } = folders.useGetFoldersQuery({
51
+ parentId: folderId
44
52
  });
45
53
  const isGridView = view === constants.viewOptions.GRID;
46
- const assets$1 = data?.results ?? [];
54
+ const isLoading = isLoadingAssets || isLoadingFolders;
55
+ const loadMoreRef = strapiAdmin.useElementOnScreen(React.useCallback((isVisible)=>{
56
+ if (isVisible && hasNextPage && !isFetchingMore) {
57
+ fetchNextPage();
58
+ }
59
+ }, [
60
+ hasNextPage,
61
+ isFetchingMore,
62
+ fetchNextPage
63
+ ]), INTERSECTION_OPTIONS);
47
64
  if (isLoading) {
48
65
  return /*#__PURE__*/ jsxRuntime.jsx(designSystem.Flex, {
49
66
  justifyContent: "center",
@@ -68,16 +85,49 @@ const AssetsView = ({ view })=>{
68
85
  })
69
86
  });
70
87
  }
71
- if (isGridView) {
72
- return /*#__PURE__*/ jsxRuntime.jsx(AssetsGrid.AssetsGrid, {
73
- assets: assets$1
88
+ if (folders$1.length === 0 && assets.length === 0) {
89
+ return /*#__PURE__*/ jsxRuntime.jsx(designSystem.Box, {
90
+ padding: 8,
91
+ children: /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
92
+ textColor: "neutral600",
93
+ children: formatMessage({
94
+ id: 'app.components.EmptyStateLayout.content-document',
95
+ defaultMessage: 'No content found'
96
+ })
97
+ })
74
98
  });
75
99
  }
76
- return /*#__PURE__*/ jsxRuntime.jsx(AssetsTable.AssetsTable, {
77
- assets: assets$1
100
+ return /*#__PURE__*/ jsxRuntime.jsxs(jsxRuntime.Fragment, {
101
+ children: [
102
+ isGridView ? /*#__PURE__*/ jsxRuntime.jsx(AssetsGrid.AssetsGrid, {
103
+ folders: folders$1,
104
+ assets: assets
105
+ }) : /*#__PURE__*/ jsxRuntime.jsx(AssetsTable.AssetsTable, {
106
+ assets: assets,
107
+ folders: folders$1
108
+ }),
109
+ /*#__PURE__*/ jsxRuntime.jsx("div", {
110
+ ref: loadMoreRef,
111
+ style: {
112
+ height: 1
113
+ }
114
+ }),
115
+ isFetchingMore && /*#__PURE__*/ jsxRuntime.jsx(designSystem.Flex, {
116
+ justifyContent: "center",
117
+ padding: 4,
118
+ children: /*#__PURE__*/ jsxRuntime.jsx(designSystem.Loader, {
119
+ children: formatMessage({
120
+ id: translations.getTranslationKey('list.assets.loading-more'),
121
+ defaultMessage: 'Loading more assets...'
122
+ })
123
+ })
124
+ })
125
+ ]
78
126
  });
79
127
  };
80
- const StyledToggleGroup = styledComponents.styled(ToggleGroup__namespace.Root)`
128
+ /* -------------------------------------------------------------------------------------------------
129
+ * AssetsPage
130
+ * -----------------------------------------------------------------------------------------------*/ const StyledToggleGroup = styledComponents.styled(ToggleGroup__namespace.Root)`
81
131
  display: flex;
82
132
  border: 1px solid ${({ theme })=>theme.colors.neutral200};
83
133
  border-radius: ${({ theme })=>theme.borderRadius};
@@ -96,7 +146,7 @@ const StyledToggleItem = styledComponents.styled(ToggleGroup__namespace.Item)`
96
146
  font-weight: ${({ theme })=>theme.fontWeights.semiBold};
97
147
 
98
148
  &:hover {
99
- background: ${({ theme })=>theme.colors.neutral100};
149
+ background: ${({ theme })=>theme.colors.primary100};
100
150
  }
101
151
 
102
152
  &[data-state='on'] {
@@ -108,113 +158,54 @@ const StyledToggleItem = styledComponents.styled(ToggleGroup__namespace.Item)`
108
158
  height: 1.6rem;
109
159
  }
110
160
  `;
111
- const DropFilesMessage = ({ uploadDropZoneRef })=>{
112
- const { formatMessage } = reactIntl.useIntl();
113
- const { isDragging } = UploadDropZoneContext.useUploadDropZone();
114
- // Dropzone message position (relative to main content)
115
- const [leftContentWidth, setLeftContentWidth] = React.useState(0);
116
- // Calculate the left content width to position the dropzone message correctly
117
- React.useEffect(()=>{
118
- if (!uploadDropZoneRef?.current) return;
119
- const updateRect = ()=>{
120
- const rect = uploadDropZoneRef.current?.getBoundingClientRect();
121
- if (rect) {
122
- setLeftContentWidth((prev)=>prev !== rect.left ? rect.left : prev);
123
- }
124
- };
125
- updateRect();
126
- const resizeObserver = new ResizeObserver(updateRect);
127
- resizeObserver.observe(uploadDropZoneRef.current);
128
- return ()=>resizeObserver.disconnect();
129
- }, [
130
- uploadDropZoneRef
131
- ]);
132
- if (!isDragging) return null;
133
- return /*#__PURE__*/ jsxRuntime.jsxs(DropFilesMessageImpl, {
134
- $leftContentWidth: leftContentWidth,
135
- children: [
136
- /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
137
- textColor: "neutral0",
138
- children: formatMessage({
139
- id: translations.getTranslationKey('dropzone.upload.message'),
140
- defaultMessage: 'Drop here to upload to'
141
- })
142
- }),
143
- /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
144
- gap: 2,
145
- alignItems: "center",
146
- children: [
147
- /*#__PURE__*/ jsxRuntime.jsx(icons.Folder, {
148
- width: 20,
149
- height: 20,
150
- fill: "neutral0"
151
- }),
152
- /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
153
- textColor: "neutral0",
154
- fontWeight: "semiBold",
155
- children: "Current folder"
156
- })
157
- ]
158
- })
159
- ]
160
- });
161
- };
162
- const DropFilesMessageImpl = styledComponents.styled(designSystem.Box)`
163
- position: fixed;
164
- bottom: ${({ theme })=>theme.spaces[8]};
165
- left: 50%;
166
- transform: translateX(calc(-50% + ${({ $leftContentWidth })=>$leftContentWidth / 2}px));
167
- display: flex;
168
- flex-direction: column;
169
- align-items: center;
170
- justify-content: center;
171
- gap: ${({ theme })=>theme.spaces[2]};
172
- background: ${({ theme })=>theme.colors.primary600};
173
- padding: ${({ theme })=>theme.spaces[4]} ${({ theme })=>theme.spaces[6]};
174
- border-radius: ${({ theme })=>theme.borderRadius};
175
- z-index: 2;
161
+ const HeaderWrapper = styledComponents.styled.div`
162
+ [data-strapi-header] {
163
+ background: ${({ theme })=>theme.colors.neutral0};
164
+
165
+ h1 {
166
+ font-size: 1.8rem;
167
+ }
168
+ }
176
169
  `;
177
170
  const AssetsPage = ()=>{
178
171
  const { formatMessage } = reactIntl.useIntl();
172
+ const { currentFolderId } = useFolderNavigation.useFolderNavigation();
173
+ const { title, itemCount } = useFolderInfo.useFolderInfo(currentFolderId);
174
+ const itemCountLabel = formatMessage({
175
+ id: translations.getTranslationKey('header.content.item-count'),
176
+ defaultMessage: '{count, plural, =1 {# item} other {# items}}'
177
+ }, {
178
+ count: itemCount
179
+ });
179
180
  // View state
180
- const [view, setView] = usePersistentState.usePersistentState(constants.localStorageKeys.view, constants.viewOptions.GRID);
181
+ const [view, setView] = strapiAdmin.usePersistentState(constants.localStorageKeys.view, constants.viewOptions.GRID);
181
182
  const isGridView = view === constants.viewOptions.GRID;
182
183
  // Refs
183
184
  const fileInputRef = React.useRef(null);
184
185
  const uploadDropZoneRef = React.useRef(null);
185
186
  // Upload handlers
186
- const { toggleNotification } = strapiAdmin.useNotification();
187
- const { _unstableFormatAPIError } = strapiAdmin.useAPIErrorHandler();
188
- const [uploadFiles] = api.useUploadFilesMutation();
187
+ const [uploadFilesStream] = api.useUploadFilesStreamMutation();
189
188
  const uploadFilesToFolder = async (files, folderId)=>{
190
189
  if (files.length === 0) return;
191
190
  const formData = new FormData();
191
+ const fileInfoArray = [];
192
192
  files.forEach((file)=>{
193
193
  formData.append('files', file);
194
- formData.append('fileInfo', JSON.stringify({
194
+ fileInfoArray.push({
195
195
  name: file.name,
196
196
  caption: null,
197
197
  alternativeText: null,
198
198
  folder: folderId
199
- }));
199
+ });
200
200
  });
201
+ formData.append('fileInfo', JSON.stringify(fileInfoArray));
201
202
  try {
202
- await uploadFiles(formData).unwrap();
203
- toggleNotification({
204
- type: 'success',
205
- message: formatMessage({
206
- id: translations.getTranslationKey('assets.uploaded'),
207
- defaultMessage: '{number, plural, one {# asset} other {# assets}} uploaded successfully'
208
- }, {
209
- number: files.length
210
- })
211
- });
203
+ await uploadFilesStream({
204
+ formData,
205
+ totalFiles: files.length
206
+ }).unwrap();
212
207
  } catch (error) {
213
- const errorMessage = _unstableFormatAPIError(error);
214
- toggleNotification({
215
- type: 'danger',
216
- message: errorMessage
217
- });
208
+ // Error is already dispatched to store from the API queryFn
218
209
  }
219
210
  };
220
211
  const handleFileSelect = ()=>{
@@ -223,12 +214,12 @@ const AssetsPage = ()=>{
223
214
  const handleFileChange = async (e)=>{
224
215
  const files = e.target.files;
225
216
  if (files && files.length > 0) {
226
- await uploadFilesToFolder(Array.from(files), null);
217
+ await uploadFilesToFolder(Array.from(files), currentFolderId);
227
218
  }
228
219
  e.target.value = '';
229
220
  };
230
221
  const handleDrop = async (files)=>{
231
- await uploadFilesToFolder(files, null);
222
+ await uploadFilesToFolder(files, currentFolderId);
232
223
  };
233
224
  return /*#__PURE__*/ jsxRuntime.jsx(UploadDropZoneContext.UploadDropZoneProvider, {
234
225
  onDrop: handleDrop,
@@ -236,6 +227,7 @@ const AssetsPage = ()=>{
236
227
  ref: uploadDropZoneRef,
237
228
  children: /*#__PURE__*/ jsxRuntime.jsxs(strapiAdmin.Layouts.Root, {
238
229
  minHeight: "100vh",
230
+ background: "neutral0",
239
231
  children: [
240
232
  /*#__PURE__*/ jsxRuntime.jsx(designSystem.VisuallyHidden, {
241
233
  children: /*#__PURE__*/ jsxRuntime.jsx("input", {
@@ -245,91 +237,101 @@ const AssetsPage = ()=>{
245
237
  multiple: true
246
238
  })
247
239
  }),
248
- /*#__PURE__*/ jsxRuntime.jsx(DropFilesMessage, {
249
- uploadDropZoneRef: uploadDropZoneRef
250
- }),
251
- /*#__PURE__*/ jsxRuntime.jsx(strapiAdmin.Layouts.Header, {
252
- navigationAction: /*#__PURE__*/ jsxRuntime.jsx(designSystem.Box, {
253
- children: "TODO: Breadcrumbs"
254
- }),
255
- title: "TODO: Folder location",
256
- primaryAction: /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
257
- gap: 2,
258
- children: [
259
- /*#__PURE__*/ jsxRuntime.jsx(designSystem.SimpleMenu, {
260
- popoverPlacement: "bottom-end",
261
- variant: "default",
262
- endIcon: /*#__PURE__*/ jsxRuntime.jsx(icons.ChevronDown, {}),
263
- label: formatMessage({
264
- id: translations.getTranslationKey('new'),
265
- defaultMessage: 'New'
266
- }),
267
- children: /*#__PURE__*/ jsxRuntime.jsx(designSystem.MenuItem, {
268
- onSelect: handleFileSelect,
269
- startIcon: /*#__PURE__*/ jsxRuntime.jsx(icons.Files, {}),
270
- children: formatMessage({
271
- id: translations.getTranslationKey('import-files'),
272
- defaultMessage: 'Import files'
273
- })
274
- })
275
- }),
276
- /*#__PURE__*/ jsxRuntime.jsx(strapiAdmin.SearchInput, {
277
- label: formatMessage({
278
- id: translations.getTranslationKey('search.label'),
279
- defaultMessage: 'Search for an asset'
280
- }),
281
- trackedEvent: "didSearchMediaLibraryElements",
282
- trackedEventDetails: {
283
- location: 'upload'
284
- }
240
+ /*#__PURE__*/ jsxRuntime.jsx(HeaderWrapper, {
241
+ children: /*#__PURE__*/ jsxRuntime.jsx(strapiAdmin.Layouts.Header, {
242
+ title: `${title} (${itemCountLabel})`,
243
+ primaryAction: /*#__PURE__*/ jsxRuntime.jsx(designSystem.SimpleMenu, {
244
+ popoverPlacement: "bottom-end",
245
+ variant: "default",
246
+ endIcon: /*#__PURE__*/ jsxRuntime.jsx(icons.ChevronDown, {}),
247
+ label: formatMessage({
248
+ id: translations.getTranslationKey('new'),
249
+ defaultMessage: 'New'
285
250
  }),
286
- /*#__PURE__*/ jsxRuntime.jsxs(StyledToggleGroup, {
287
- type: "single",
288
- value: isGridView ? 'grid' : 'table',
289
- onValueChange: (value)=>value && setView(value === 'grid' ? constants.viewOptions.GRID : constants.viewOptions.TABLE),
290
- "aria-label": formatMessage({
291
- id: translations.getTranslationKey('view.switch.label'),
292
- defaultMessage: 'View options'
251
+ children: /*#__PURE__*/ jsxRuntime.jsx(designSystem.MenuItem, {
252
+ onSelect: handleFileSelect,
253
+ startIcon: /*#__PURE__*/ jsxRuntime.jsx(icons.Files, {}),
254
+ children: formatMessage({
255
+ id: translations.getTranslationKey('import-files'),
256
+ defaultMessage: 'Import files'
257
+ })
258
+ })
259
+ }),
260
+ subtitle: /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
261
+ justifyContent: "space-between",
262
+ alignItems: "center",
263
+ gap: 4,
264
+ width: "100%",
265
+ children: [
266
+ /*#__PURE__*/ jsxRuntime.jsx(designSystem.Flex, {
267
+ gap: 4,
268
+ alignItems: "center",
269
+ children: "TODO: Filters and search"
293
270
  }),
294
- children: [
295
- /*#__PURE__*/ jsxRuntime.jsxs(StyledToggleItem, {
296
- value: "table",
297
- "aria-label": formatMessage({
298
- id: translations.getTranslationKey('view.table'),
299
- defaultMessage: 'Table view'
300
- }),
301
- children: [
302
- /*#__PURE__*/ jsxRuntime.jsx(icons.List, {}),
303
- formatMessage({
304
- id: translations.getTranslationKey('view.table'),
305
- defaultMessage: 'Table view'
306
- })
307
- ]
308
- }),
309
- /*#__PURE__*/ jsxRuntime.jsxs(StyledToggleItem, {
310
- value: "grid",
311
- "aria-label": formatMessage({
312
- id: translations.getTranslationKey('view.grid'),
313
- defaultMessage: 'Grid view'
271
+ /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
272
+ gap: 4,
273
+ alignItems: "center",
274
+ children: [
275
+ /*#__PURE__*/ jsxRuntime.jsx(designSystem.Box, {
276
+ children: "TODO: Sort"
314
277
  }),
315
- children: [
316
- /*#__PURE__*/ jsxRuntime.jsx(icons.GridFour, {}),
317
- formatMessage({
318
- id: translations.getTranslationKey('view.grid'),
319
- defaultMessage: 'Grid view'
320
- })
321
- ]
322
- })
323
- ]
324
- })
325
- ]
278
+ /*#__PURE__*/ jsxRuntime.jsxs(StyledToggleGroup, {
279
+ type: "single",
280
+ value: isGridView ? 'grid' : 'table',
281
+ onValueChange: (value)=>value && setView(value === 'grid' ? constants.viewOptions.GRID : constants.viewOptions.TABLE),
282
+ "aria-label": formatMessage({
283
+ id: translations.getTranslationKey('view.switch.label'),
284
+ defaultMessage: 'View options'
285
+ }),
286
+ children: [
287
+ /*#__PURE__*/ jsxRuntime.jsxs(StyledToggleItem, {
288
+ value: "table",
289
+ "aria-label": formatMessage({
290
+ id: translations.getTranslationKey('view.table'),
291
+ defaultMessage: 'Table view'
292
+ }),
293
+ children: [
294
+ /*#__PURE__*/ jsxRuntime.jsx(icons.List, {}),
295
+ formatMessage({
296
+ id: translations.getTranslationKey('view.table'),
297
+ defaultMessage: 'Table view'
298
+ })
299
+ ]
300
+ }),
301
+ /*#__PURE__*/ jsxRuntime.jsxs(StyledToggleItem, {
302
+ value: "grid",
303
+ "aria-label": formatMessage({
304
+ id: translations.getTranslationKey('view.grid'),
305
+ defaultMessage: 'Grid view'
306
+ }),
307
+ children: [
308
+ /*#__PURE__*/ jsxRuntime.jsx(icons.GridFour, {}),
309
+ formatMessage({
310
+ id: translations.getTranslationKey('view.grid'),
311
+ defaultMessage: 'Grid view'
312
+ })
313
+ ]
314
+ })
315
+ ]
316
+ })
317
+ ]
318
+ })
319
+ ]
320
+ })
326
321
  })
327
322
  }),
328
323
  /*#__PURE__*/ jsxRuntime.jsx(strapiAdmin.Layouts.Content, {
329
- children: /*#__PURE__*/ jsxRuntime.jsx(DropZoneWithOverlay.DropZoneWithOverlay, {
330
- children: /*#__PURE__*/ jsxRuntime.jsx(AssetsView, {
331
- view: view
332
- })
324
+ children: /*#__PURE__*/ jsxRuntime.jsxs(UploadDropZone.DropZoneWithOverlay, {
325
+ children: [
326
+ /*#__PURE__*/ jsxRuntime.jsx(UploadDropZone.DropFilesMessage, {
327
+ uploadDropZoneRef: uploadDropZoneRef,
328
+ folderName: title
329
+ }),
330
+ /*#__PURE__*/ jsxRuntime.jsx(AssetsView, {
331
+ view: view,
332
+ folderId: currentFolderId
333
+ })
334
+ ]
333
335
  })
334
336
  })
335
337
  ]
@@ -1 +1 @@
1
- {"version":3,"file":"AssetsPage.js","sources":["../../../../../admin/src/future/pages/Assets/AssetsPage.tsx"],"sourcesContent":["import { useEffect, useRef, useState, type ChangeEvent } from 'react';\n\nimport * as ToggleGroup from '@radix-ui/react-toggle-group';\nimport {\n Layouts,\n SearchInput,\n useNotification,\n useAPIErrorHandler,\n} from '@strapi/admin/strapi-admin';\nimport {\n Box,\n Flex,\n Loader,\n MenuItem,\n SimpleMenu,\n Typography,\n VisuallyHidden,\n} from '@strapi/design-system';\nimport { ChevronDown, Files, Folder, GridFour as GridIcon, List } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\n\nimport { usePersistentState } from '../../../hooks/usePersistentState';\nimport { useUploadFilesMutation } from '../../services/api';\nimport { useGetAssetsQuery } from '../../services/assets';\nimport { getTranslationKey } from '../../utils/translations';\n\nimport { AssetsGrid } from './components/AssetsGrid';\nimport { AssetsTable } from './components/AssetsTable';\nimport { DropZoneWithOverlay } from './components/DropZone/DropZoneWithOverlay';\nimport {\n UploadDropZoneProvider,\n useUploadDropZone,\n} from './components/DropZone/UploadDropZoneContext';\nimport { localStorageKeys, viewOptions } from './constants';\n\ninterface AssetsViewProps {\n view: number;\n}\n\nconst AssetsView = ({ view }: AssetsViewProps) => {\n const { formatMessage } = useIntl();\n const { data, isLoading, error } = useGetAssetsQuery({ folder: null });\n\n const isGridView = view === viewOptions.GRID;\n const assets = data?.results ?? [];\n\n if (isLoading) {\n return (\n <Flex justifyContent=\"center\" padding={8}>\n <Loader>{formatMessage({ id: 'app.loading', defaultMessage: 'Loading...' })}</Loader>\n </Flex>\n );\n }\n\n if (error) {\n return (\n <Box padding={8}>\n <Typography textColor=\"danger600\">\n {formatMessage({\n id: getTranslationKey('list.assets.error'),\n defaultMessage: 'An error occurred while fetching assets.',\n })}\n </Typography>\n </Box>\n );\n }\n\n if (isGridView) {\n return <AssetsGrid assets={assets} />;\n }\n\n return <AssetsTable assets={assets} />;\n};\n\nconst StyledToggleGroup = styled(ToggleGroup.Root)`\n display: flex;\n border: 1px solid ${({ theme }) => theme.colors.neutral200};\n border-radius: ${({ theme }) => theme.borderRadius};\n overflow: hidden;\n`;\n\nconst StyledToggleItem = styled(ToggleGroup.Item)`\n display: flex;\n align-items: center;\n gap: ${({ theme }) => theme.spaces[2]};\n padding: ${({ theme }) => `${theme.spaces[2]} ${theme.spaces[4]}`};\n border: none;\n background: ${({ theme }) => theme.colors.neutral0};\n color: ${({ theme }) => theme.colors.neutral800};\n cursor: pointer;\n font-size: ${({ theme }) => theme.fontSizes[1]};\n font-weight: ${({ theme }) => theme.fontWeights.semiBold};\n\n &:hover {\n background: ${({ theme }) => theme.colors.neutral100};\n }\n\n &[data-state='on'] {\n background: ${({ theme }) => theme.colors.neutral150};\n }\n\n svg {\n width: 1.6rem;\n height: 1.6rem;\n }\n`;\n\n/**\n * Dropzone items\n */\n\ninterface DropFilesMessageProps {\n uploadDropZoneRef?: React.RefObject<HTMLDivElement>;\n}\n\nconst DropFilesMessage = ({ uploadDropZoneRef }: DropFilesMessageProps) => {\n const { formatMessage } = useIntl();\n const { isDragging } = useUploadDropZone();\n\n // Dropzone message position (relative to main content)\n const [leftContentWidth, setLeftContentWidth] = useState(0);\n\n // Calculate the left content width to position the dropzone message correctly\n useEffect(() => {\n if (!uploadDropZoneRef?.current) return;\n\n const updateRect = () => {\n const rect = uploadDropZoneRef.current?.getBoundingClientRect();\n if (rect) {\n setLeftContentWidth((prev) => (prev !== rect.left ? rect.left : prev));\n }\n };\n\n updateRect();\n const resizeObserver = new ResizeObserver(updateRect);\n resizeObserver.observe(uploadDropZoneRef.current);\n return () => resizeObserver.disconnect();\n }, [uploadDropZoneRef]);\n\n if (!isDragging) return null;\n\n return (\n <DropFilesMessageImpl $leftContentWidth={leftContentWidth}>\n <Typography textColor=\"neutral0\">\n {formatMessage({\n id: getTranslationKey('dropzone.upload.message'),\n defaultMessage: 'Drop here to upload to',\n })}\n </Typography>\n <Flex gap={2} alignItems=\"center\">\n <Folder width={20} height={20} fill=\"neutral0\" />\n <Typography textColor=\"neutral0\" fontWeight=\"semiBold\">\n Current folder{/* TODO: Replace this later with the current folder name */}\n </Typography>\n </Flex>\n </DropFilesMessageImpl>\n );\n};\n\nconst DropFilesMessageImpl = styled(Box)<{ $leftContentWidth: number }>`\n position: fixed;\n bottom: ${({ theme }) => theme.spaces[8]};\n left: 50%;\n transform: translateX(calc(-50% + ${({ $leftContentWidth }) => $leftContentWidth / 2}px));\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: ${({ theme }) => theme.spaces[2]};\n background: ${({ theme }) => theme.colors.primary600};\n padding: ${({ theme }) => theme.spaces[4]} ${({ theme }) => theme.spaces[6]};\n border-radius: ${({ theme }) => theme.borderRadius};\n z-index: 2;\n`;\n\nexport const AssetsPage = () => {\n const { formatMessage } = useIntl();\n\n // View state\n const [view, setView] = usePersistentState(localStorageKeys.view, viewOptions.GRID);\n const isGridView = view === viewOptions.GRID;\n\n // Refs\n const fileInputRef = useRef<HTMLInputElement>(null);\n const uploadDropZoneRef = useRef<HTMLDivElement>(null);\n\n // Upload handlers\n const { toggleNotification } = useNotification();\n const { _unstableFormatAPIError } = useAPIErrorHandler();\n const [uploadFiles] = useUploadFilesMutation();\n\n const uploadFilesToFolder = async (files: globalThis.File[], folderId: number | null) => {\n if (files.length === 0) return;\n const formData = new FormData();\n files.forEach((file) => {\n formData.append('files', file);\n formData.append(\n 'fileInfo',\n JSON.stringify({\n name: file.name,\n caption: null,\n alternativeText: null,\n folder: folderId,\n })\n );\n });\n try {\n await uploadFiles(formData).unwrap();\n toggleNotification({\n type: 'success',\n message: formatMessage(\n {\n id: getTranslationKey('assets.uploaded'),\n defaultMessage:\n '{number, plural, one {# asset} other {# assets}} uploaded successfully',\n },\n { number: files.length }\n ),\n });\n } catch (error) {\n const errorMessage = _unstableFormatAPIError(error as Error);\n toggleNotification({\n type: 'danger',\n message: errorMessage,\n });\n }\n };\n\n const handleFileSelect = () => {\n fileInputRef.current?.click();\n };\n\n const handleFileChange = async (e: ChangeEvent<HTMLInputElement>) => {\n const files = e.target.files;\n if (files && files.length > 0) {\n await uploadFilesToFolder(Array.from(files), null);\n }\n e.target.value = '';\n };\n\n const handleDrop = async (files: globalThis.File[]) => {\n await uploadFilesToFolder(files, null);\n };\n\n return (\n <UploadDropZoneProvider onDrop={handleDrop}>\n <Box ref={uploadDropZoneRef}>\n <Layouts.Root minHeight=\"100vh\">\n <VisuallyHidden>\n <input type=\"file\" ref={fileInputRef} onChange={handleFileChange} multiple />\n </VisuallyHidden>\n\n <DropFilesMessage uploadDropZoneRef={uploadDropZoneRef} />\n\n <Layouts.Header\n navigationAction={<Box>TODO: Breadcrumbs</Box>}\n title=\"TODO: Folder location\"\n primaryAction={\n <Flex gap={2}>\n <SimpleMenu\n popoverPlacement=\"bottom-end\"\n variant=\"default\"\n endIcon={<ChevronDown />}\n label={formatMessage({ id: getTranslationKey('new'), defaultMessage: 'New' })}\n >\n <MenuItem onSelect={handleFileSelect} startIcon={<Files />}>\n {formatMessage({\n id: getTranslationKey('import-files'),\n defaultMessage: 'Import files',\n })}\n </MenuItem>\n </SimpleMenu>\n <SearchInput\n label={formatMessage({\n id: getTranslationKey('search.label'),\n defaultMessage: 'Search for an asset',\n })}\n trackedEvent=\"didSearchMediaLibraryElements\"\n trackedEventDetails={{ location: 'upload' }}\n />\n <StyledToggleGroup\n type=\"single\"\n value={isGridView ? 'grid' : 'table'}\n onValueChange={(value) =>\n value && setView(value === 'grid' ? viewOptions.GRID : viewOptions.TABLE)\n }\n aria-label={formatMessage({\n id: getTranslationKey('view.switch.label'),\n defaultMessage: 'View options',\n })}\n >\n <StyledToggleItem\n value=\"table\"\n aria-label={formatMessage({\n id: getTranslationKey('view.table'),\n defaultMessage: 'Table view',\n })}\n >\n <List />\n {formatMessage({\n id: getTranslationKey('view.table'),\n defaultMessage: 'Table view',\n })}\n </StyledToggleItem>\n <StyledToggleItem\n value=\"grid\"\n aria-label={formatMessage({\n id: getTranslationKey('view.grid'),\n defaultMessage: 'Grid view',\n })}\n >\n <GridIcon />\n {formatMessage({\n id: getTranslationKey('view.grid'),\n defaultMessage: 'Grid view',\n })}\n </StyledToggleItem>\n </StyledToggleGroup>\n </Flex>\n }\n />\n\n <Layouts.Content>\n <DropZoneWithOverlay>\n <AssetsView view={view} />\n </DropZoneWithOverlay>\n </Layouts.Content>\n </Layouts.Root>\n </Box>\n </UploadDropZoneProvider>\n );\n};\n"],"names":["AssetsView","view","formatMessage","useIntl","data","isLoading","error","useGetAssetsQuery","folder","isGridView","viewOptions","GRID","assets","results","_jsx","Flex","justifyContent","padding","Loader","id","defaultMessage","Box","Typography","textColor","getTranslationKey","AssetsGrid","AssetsTable","StyledToggleGroup","styled","ToggleGroup","Root","theme","colors","neutral200","borderRadius","StyledToggleItem","Item","spaces","neutral0","neutral800","fontSizes","fontWeights","semiBold","neutral100","neutral150","DropFilesMessage","uploadDropZoneRef","isDragging","useUploadDropZone","leftContentWidth","setLeftContentWidth","useState","useEffect","current","updateRect","rect","getBoundingClientRect","prev","left","resizeObserver","ResizeObserver","observe","disconnect","_jsxs","DropFilesMessageImpl","$leftContentWidth","gap","alignItems","Folder","width","height","fill","fontWeight","primary600","AssetsPage","setView","usePersistentState","localStorageKeys","fileInputRef","useRef","toggleNotification","useNotification","_unstableFormatAPIError","useAPIErrorHandler","uploadFiles","useUploadFilesMutation","uploadFilesToFolder","files","folderId","length","formData","FormData","forEach","file","append","JSON","stringify","name","caption","alternativeText","unwrap","type","message","number","errorMessage","handleFileSelect","click","handleFileChange","e","target","Array","from","value","handleDrop","UploadDropZoneProvider","onDrop","ref","Layouts","minHeight","VisuallyHidden","input","onChange","multiple","Header","navigationAction","title","primaryAction","SimpleMenu","popoverPlacement","variant","endIcon","ChevronDown","label","MenuItem","onSelect","startIcon","Files","SearchInput","trackedEvent","trackedEventDetails","location","onValueChange","TABLE","aria-label","List","GridIcon","Content","DropZoneWithOverlay"],"mappings":"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"}
1
+ {"version":3,"file":"AssetsPage.js","sources":["../../../../../admin/src/future/pages/Assets/AssetsPage.tsx"],"sourcesContent":["import { useRef, useCallback, type ChangeEvent } from 'react';\n\nimport * as ToggleGroup from '@radix-ui/react-toggle-group';\nimport { Layouts, useElementOnScreen, usePersistentState } from '@strapi/admin/strapi-admin';\nimport {\n Box,\n Flex,\n Loader,\n MenuItem,\n SimpleMenu,\n Typography,\n VisuallyHidden,\n} from '@strapi/design-system';\nimport { ChevronDown, Files, GridFour as GridIcon, List } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\n\nimport { useUploadFilesStreamMutation } from '../../services/api';\nimport { useGetFoldersQuery } from '../../services/folders';\nimport { getTranslationKey } from '../../utils/translations';\n\nimport { AssetsGrid } from './components/AssetsGrid';\nimport { AssetsTable } from './components/AssetsTable';\nimport { DropFilesMessage, DropZoneWithOverlay } from './components/DropZone/UploadDropZone';\nimport { UploadDropZoneProvider } from './components/DropZone/UploadDropZoneContext';\nimport { localStorageKeys, viewOptions } from './constants';\nimport { useFolderInfo } from './hooks/useFolderInfo';\nimport { useFolderNavigation } from './hooks/useFolderNavigation';\nimport { useInfiniteAssets } from './hooks/useInfiniteAssets';\n\nimport type { UploadFileInfo } from '../../../../../shared/contracts/files';\n\nconst INTERSECTION_OPTIONS: IntersectionObserverInit = { threshold: 0.1 };\n\n/* -------------------------------------------------------------------------------------------------\n * AssetsView\n * -----------------------------------------------------------------------------------------------*/\n\ninterface AssetsViewProps {\n view: number;\n folderId: number | null;\n}\n\nconst AssetsView = ({ view, folderId }: AssetsViewProps) => {\n const { formatMessage } = useIntl();\n const {\n assets,\n isLoading: isLoadingAssets,\n isFetchingMore,\n hasNextPage,\n fetchNextPage,\n error,\n } = useInfiniteAssets({ folder: folderId });\n const { data: folders = [], isLoading: isLoadingFolders } = useGetFoldersQuery({\n parentId: folderId,\n });\n\n const isGridView = view === viewOptions.GRID;\n const isLoading = isLoadingAssets || isLoadingFolders;\n\n const loadMoreRef = useElementOnScreen<HTMLDivElement>(\n useCallback(\n (isVisible) => {\n if (isVisible && hasNextPage && !isFetchingMore) {\n fetchNextPage();\n }\n },\n [hasNextPage, isFetchingMore, fetchNextPage]\n ),\n INTERSECTION_OPTIONS\n );\n\n if (isLoading) {\n return (\n <Flex justifyContent=\"center\" padding={8}>\n <Loader>{formatMessage({ id: 'app.loading', defaultMessage: 'Loading...' })}</Loader>\n </Flex>\n );\n }\n\n if (error) {\n return (\n <Box padding={8}>\n <Typography textColor=\"danger600\">\n {formatMessage({\n id: getTranslationKey('list.assets.error'),\n defaultMessage: 'An error occurred while fetching assets.',\n })}\n </Typography>\n </Box>\n );\n }\n\n if (folders.length === 0 && assets.length === 0) {\n return (\n <Box padding={8}>\n <Typography textColor=\"neutral600\">\n {formatMessage({\n id: 'app.components.EmptyStateLayout.content-document',\n defaultMessage: 'No content found',\n })}\n </Typography>\n </Box>\n );\n }\n return (\n <>\n {isGridView ? (\n <AssetsGrid folders={folders} assets={assets} />\n ) : (\n <AssetsTable assets={assets} folders={folders} />\n )}\n <div ref={loadMoreRef} style={{ height: 1 }} />\n {isFetchingMore && (\n <Flex justifyContent=\"center\" padding={4}>\n <Loader>\n {formatMessage({\n id: getTranslationKey('list.assets.loading-more'),\n defaultMessage: 'Loading more assets...',\n })}\n </Loader>\n </Flex>\n )}\n </>\n );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * AssetsPage\n * -----------------------------------------------------------------------------------------------*/\n\nconst StyledToggleGroup = styled(ToggleGroup.Root)`\n display: flex;\n border: 1px solid ${({ theme }) => theme.colors.neutral200};\n border-radius: ${({ theme }) => theme.borderRadius};\n overflow: hidden;\n`;\n\nconst StyledToggleItem = styled(ToggleGroup.Item)`\n display: flex;\n align-items: center;\n gap: ${({ theme }) => theme.spaces[2]};\n padding: ${({ theme }) => `${theme.spaces[2]} ${theme.spaces[4]}`};\n border: none;\n background: ${({ theme }) => theme.colors.neutral0};\n color: ${({ theme }) => theme.colors.neutral800};\n cursor: pointer;\n font-size: ${({ theme }) => theme.fontSizes[1]};\n font-weight: ${({ theme }) => theme.fontWeights.semiBold};\n\n &:hover {\n background: ${({ theme }) => theme.colors.primary100};\n }\n\n &[data-state='on'] {\n background: ${({ theme }) => theme.colors.neutral150};\n }\n\n svg {\n width: 1.6rem;\n height: 1.6rem;\n }\n`;\n\nconst HeaderWrapper = styled.div`\n [data-strapi-header] {\n background: ${({ theme }) => theme.colors.neutral0};\n\n h1 {\n font-size: 1.8rem;\n }\n }\n`;\n\nexport const AssetsPage = () => {\n const { formatMessage } = useIntl();\n\n const { currentFolderId } = useFolderNavigation();\n const { title, itemCount } = useFolderInfo(currentFolderId);\n const itemCountLabel = formatMessage(\n {\n id: getTranslationKey('header.content.item-count'),\n defaultMessage: '{count, plural, =1 {# item} other {# items}}',\n },\n { count: itemCount }\n );\n\n // View state\n const [view, setView] = usePersistentState(localStorageKeys.view, viewOptions.GRID);\n const isGridView = view === viewOptions.GRID;\n\n // Refs\n const fileInputRef = useRef<HTMLInputElement>(null);\n const uploadDropZoneRef = useRef<HTMLDivElement>(null);\n\n // Upload handlers\n const [uploadFilesStream] = useUploadFilesStreamMutation();\n\n const uploadFilesToFolder = async (files: globalThis.File[], folderId: number | null) => {\n if (files.length === 0) return;\n\n const formData = new FormData();\n const fileInfoArray: UploadFileInfo[] = [];\n\n files.forEach((file) => {\n formData.append('files', file);\n fileInfoArray.push({\n name: file.name,\n caption: null,\n alternativeText: null,\n folder: folderId,\n });\n });\n\n formData.append('fileInfo', JSON.stringify(fileInfoArray));\n try {\n await uploadFilesStream({ formData, totalFiles: files.length }).unwrap();\n } catch (error) {\n // Error is already dispatched to store from the API queryFn\n }\n };\n\n const handleFileSelect = () => {\n fileInputRef.current?.click();\n };\n\n const handleFileChange = async (e: ChangeEvent<HTMLInputElement>) => {\n const files = e.target.files;\n if (files && files.length > 0) {\n await uploadFilesToFolder(Array.from(files), currentFolderId);\n }\n e.target.value = '';\n };\n\n const handleDrop = async (files: globalThis.File[]) => {\n await uploadFilesToFolder(files, currentFolderId);\n };\n\n return (\n <UploadDropZoneProvider onDrop={handleDrop}>\n <Box ref={uploadDropZoneRef}>\n <Layouts.Root minHeight=\"100vh\" background=\"neutral0\">\n <VisuallyHidden>\n <input type=\"file\" ref={fileInputRef} onChange={handleFileChange} multiple />\n </VisuallyHidden>\n\n <HeaderWrapper>\n <Layouts.Header\n title={`${title} (${itemCountLabel})`}\n primaryAction={\n <SimpleMenu\n popoverPlacement=\"bottom-end\"\n variant=\"default\"\n endIcon={<ChevronDown />}\n label={formatMessage({ id: getTranslationKey('new'), defaultMessage: 'New' })}\n >\n <MenuItem onSelect={handleFileSelect} startIcon={<Files />}>\n {formatMessage({\n id: getTranslationKey('import-files'),\n defaultMessage: 'Import files',\n })}\n </MenuItem>\n </SimpleMenu>\n }\n subtitle={\n <Flex justifyContent=\"space-between\" alignItems=\"center\" gap={4} width=\"100%\">\n <Flex gap={4} alignItems=\"center\">\n TODO: Filters and search\n </Flex>\n\n <Flex gap={4} alignItems=\"center\">\n <Box>TODO: Sort</Box>\n <StyledToggleGroup\n type=\"single\"\n value={isGridView ? 'grid' : 'table'}\n onValueChange={(value) =>\n value && setView(value === 'grid' ? viewOptions.GRID : viewOptions.TABLE)\n }\n aria-label={formatMessage({\n id: getTranslationKey('view.switch.label'),\n defaultMessage: 'View options',\n })}\n >\n <StyledToggleItem\n value=\"table\"\n aria-label={formatMessage({\n id: getTranslationKey('view.table'),\n defaultMessage: 'Table view',\n })}\n >\n <List />\n {formatMessage({\n id: getTranslationKey('view.table'),\n defaultMessage: 'Table view',\n })}\n </StyledToggleItem>\n <StyledToggleItem\n value=\"grid\"\n aria-label={formatMessage({\n id: getTranslationKey('view.grid'),\n defaultMessage: 'Grid view',\n })}\n >\n <GridIcon />\n {formatMessage({\n id: getTranslationKey('view.grid'),\n defaultMessage: 'Grid view',\n })}\n </StyledToggleItem>\n </StyledToggleGroup>\n </Flex>\n </Flex>\n }\n />\n </HeaderWrapper>\n\n <Layouts.Content>\n <DropZoneWithOverlay>\n <DropFilesMessage uploadDropZoneRef={uploadDropZoneRef} folderName={title} />\n <AssetsView view={view} folderId={currentFolderId} />\n </DropZoneWithOverlay>\n </Layouts.Content>\n </Layouts.Root>\n </Box>\n </UploadDropZoneProvider>\n );\n};\n"],"names":["INTERSECTION_OPTIONS","threshold","AssetsView","view","folderId","formatMessage","useIntl","assets","isLoading","isLoadingAssets","isFetchingMore","hasNextPage","fetchNextPage","error","useInfiniteAssets","folder","data","folders","isLoadingFolders","useGetFoldersQuery","parentId","isGridView","viewOptions","GRID","loadMoreRef","useElementOnScreen","useCallback","isVisible","_jsx","Flex","justifyContent","padding","Loader","id","defaultMessage","Box","Typography","textColor","getTranslationKey","length","_jsxs","_Fragment","AssetsGrid","AssetsTable","div","ref","style","height","StyledToggleGroup","styled","ToggleGroup","Root","theme","colors","neutral200","borderRadius","StyledToggleItem","Item","spaces","neutral0","neutral800","fontSizes","fontWeights","semiBold","primary100","neutral150","HeaderWrapper","AssetsPage","currentFolderId","useFolderNavigation","title","itemCount","useFolderInfo","itemCountLabel","count","setView","usePersistentState","localStorageKeys","fileInputRef","useRef","uploadDropZoneRef","uploadFilesStream","useUploadFilesStreamMutation","uploadFilesToFolder","files","formData","FormData","fileInfoArray","forEach","file","append","push","name","caption","alternativeText","JSON","stringify","totalFiles","unwrap","handleFileSelect","current","click","handleFileChange","e","target","Array","from","value","handleDrop","UploadDropZoneProvider","onDrop","Layouts","minHeight","background","VisuallyHidden","input","type","onChange","multiple","Header","primaryAction","SimpleMenu","popoverPlacement","variant","endIcon","ChevronDown","label","MenuItem","onSelect","startIcon","Files","subtitle","alignItems","gap","width","onValueChange","TABLE","aria-label","List","GridIcon","Content","DropZoneWithOverlay","DropFilesMessage","folderName"],"mappings":"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"}