@strapi/upload 5.59.0 → 5.60.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.
- package/dist/admin/components/AssetPickerDialog/AssetPickerDialog.js +434 -0
- package/dist/admin/components/AssetPickerDialog/AssetPickerDialog.js.map +1 -0
- package/dist/admin/components/AssetPickerDialog/AssetPickerDialog.mjs +432 -0
- package/dist/admin/components/AssetPickerDialog/AssetPickerDialog.mjs.map +1 -0
- package/dist/admin/components/AssetPickerDialog/FolderBreadcrumbs.js +91 -0
- package/dist/admin/components/AssetPickerDialog/FolderBreadcrumbs.js.map +1 -0
- package/dist/admin/components/AssetPickerDialog/FolderBreadcrumbs.mjs +89 -0
- package/dist/admin/components/AssetPickerDialog/FolderBreadcrumbs.mjs.map +1 -0
- package/dist/admin/components/AssetPickerDialog/PickerSelectionProvider.js +178 -0
- package/dist/admin/components/AssetPickerDialog/PickerSelectionProvider.js.map +1 -0
- package/dist/admin/components/AssetPickerDialog/PickerSelectionProvider.mjs +175 -0
- package/dist/admin/components/AssetPickerDialog/PickerSelectionProvider.mjs.map +1 -0
- package/dist/admin/components/AssetPickerDialog/SortableSelection.js +143 -0
- package/dist/admin/components/AssetPickerDialog/SortableSelection.js.map +1 -0
- package/dist/admin/components/AssetPickerDialog/SortableSelection.mjs +141 -0
- package/dist/admin/components/AssetPickerDialog/SortableSelection.mjs.map +1 -0
- package/dist/admin/components/AssetPickerDialog/pickerSelection.js +49 -0
- package/dist/admin/components/AssetPickerDialog/pickerSelection.js.map +1 -0
- package/dist/admin/components/AssetPickerDialog/pickerSelection.mjs +41 -0
- package/dist/admin/components/AssetPickerDialog/pickerSelection.mjs.map +1 -0
- package/dist/admin/components/MediaLibraryInput/AddAssetMenu.js +4 -3
- package/dist/admin/components/MediaLibraryInput/AddAssetMenu.js.map +1 -1
- package/dist/admin/components/MediaLibraryInput/AddAssetMenu.mjs +4 -3
- package/dist/admin/components/MediaLibraryInput/AddAssetMenu.mjs.map +1 -1
- package/dist/admin/components/MediaLibraryInput/AssetCard.js +240 -0
- package/dist/admin/components/MediaLibraryInput/AssetCard.js.map +1 -0
- package/dist/admin/components/MediaLibraryInput/AssetCard.mjs +237 -0
- package/dist/admin/components/MediaLibraryInput/AssetCard.mjs.map +1 -0
- package/dist/admin/components/MediaLibraryInput/AssetCarousel.js +161 -0
- package/dist/admin/components/MediaLibraryInput/AssetCarousel.js.map +1 -0
- package/dist/admin/components/MediaLibraryInput/AssetCarousel.mjs +159 -0
- package/dist/admin/components/MediaLibraryInput/AssetCarousel.mjs.map +1 -0
- package/dist/admin/components/MediaLibraryInput/AssetDropZone.js +76 -49
- package/dist/admin/components/MediaLibraryInput/AssetDropZone.js.map +1 -1
- package/dist/admin/components/MediaLibraryInput/AssetDropZone.mjs +77 -50
- package/dist/admin/components/MediaLibraryInput/AssetDropZone.mjs.map +1 -1
- package/dist/admin/components/MediaLibraryInput/AssetPreview.js +109 -0
- package/dist/admin/components/MediaLibraryInput/AssetPreview.js.map +1 -0
- package/dist/admin/components/MediaLibraryInput/AssetPreview.mjs +106 -0
- package/dist/admin/components/MediaLibraryInput/AssetPreview.mjs.map +1 -0
- package/dist/admin/components/MediaLibraryInput/AssetRow.js +146 -79
- package/dist/admin/components/MediaLibraryInput/AssetRow.js.map +1 -1
- package/dist/admin/components/MediaLibraryInput/AssetRow.mjs +148 -82
- package/dist/admin/components/MediaLibraryInput/AssetRow.mjs.map +1 -1
- package/dist/admin/components/MediaLibraryInput/FieldControls.js +32 -0
- package/dist/admin/components/MediaLibraryInput/FieldControls.js.map +1 -0
- package/dist/admin/components/MediaLibraryInput/FieldControls.mjs +29 -0
- package/dist/admin/components/MediaLibraryInput/FieldControls.mjs.map +1 -0
- package/dist/admin/components/MediaLibraryInput/MediaLibraryInput.js +130 -88
- package/dist/admin/components/MediaLibraryInput/MediaLibraryInput.js.map +1 -1
- package/dist/admin/components/MediaLibraryInput/MediaLibraryInput.mjs +129 -91
- package/dist/admin/components/MediaLibraryInput/MediaLibraryInput.mjs.map +1 -1
- package/dist/admin/components/MediaLibraryInput/UploadProgressBar.js +42 -0
- package/dist/admin/components/MediaLibraryInput/UploadProgressBar.js.map +1 -0
- package/dist/admin/components/MediaLibraryInput/UploadProgressBar.mjs +40 -0
- package/dist/admin/components/MediaLibraryInput/UploadProgressBar.mjs.map +1 -0
- package/dist/admin/components/MediaLibraryInput/useFieldUploads.js +122 -0
- package/dist/admin/components/MediaLibraryInput/useFieldUploads.js.map +1 -0
- package/dist/admin/components/MediaLibraryInput/useFieldUploads.mjs +120 -0
- package/dist/admin/components/MediaLibraryInput/useFieldUploads.mjs.map +1 -0
- package/dist/admin/components/UploadProgressDialog.js +2 -1
- package/dist/admin/components/UploadProgressDialog.js.map +1 -1
- package/dist/admin/components/UploadProgressDialog.mjs +2 -1
- package/dist/admin/components/UploadProgressDialog.mjs.map +1 -1
- package/dist/admin/hooks/useMediaLibraryPermissions.js +12 -2
- package/dist/admin/hooks/useMediaLibraryPermissions.js.map +1 -1
- package/dist/admin/hooks/useMediaLibraryPermissions.mjs +12 -2
- package/dist/admin/hooks/useMediaLibraryPermissions.mjs.map +1 -1
- package/dist/admin/pages/Assets/AssetsPage.js +13 -302
- package/dist/admin/pages/Assets/AssetsPage.js.map +1 -1
- package/dist/admin/pages/Assets/AssetsPage.mjs +11 -280
- package/dist/admin/pages/Assets/AssetsPage.mjs.map +1 -1
- package/dist/admin/pages/Assets/components/AssetsGrid.js +142 -31
- package/dist/admin/pages/Assets/components/AssetsGrid.js.map +1 -1
- package/dist/admin/pages/Assets/components/AssetsGrid.mjs +145 -34
- package/dist/admin/pages/Assets/components/AssetsGrid.mjs.map +1 -1
- package/dist/admin/pages/Assets/components/AssetsSearchInput.js +43 -2
- package/dist/admin/pages/Assets/components/AssetsSearchInput.js.map +1 -1
- package/dist/admin/pages/Assets/components/AssetsSearchInput.mjs +45 -4
- package/dist/admin/pages/Assets/components/AssetsSearchInput.mjs.map +1 -1
- package/dist/admin/pages/Assets/components/AssetsTable.js +58 -34
- package/dist/admin/pages/Assets/components/AssetsTable.js.map +1 -1
- package/dist/admin/pages/Assets/components/AssetsTable.mjs +60 -36
- package/dist/admin/pages/Assets/components/AssetsTable.mjs.map +1 -1
- package/dist/admin/pages/Assets/components/AssetsView.js +145 -0
- package/dist/admin/pages/Assets/components/AssetsView.js.map +1 -0
- package/dist/admin/pages/Assets/components/AssetsView.mjs +143 -0
- package/dist/admin/pages/Assets/components/AssetsView.mjs.map +1 -0
- package/dist/admin/pages/Assets/components/BulkActionsBar.mjs +1 -1
- package/dist/admin/pages/Assets/components/BusyOverlay.mjs +1 -1
- package/dist/admin/pages/Assets/components/Dnd/DragOverlayChip.mjs +1 -1
- package/dist/admin/pages/Assets/components/Dnd/ReorderHandle.js +40 -0
- package/dist/admin/pages/Assets/components/Dnd/ReorderHandle.js.map +1 -0
- package/dist/admin/pages/Assets/components/Dnd/ReorderHandle.mjs +38 -0
- package/dist/admin/pages/Assets/components/Dnd/ReorderHandle.mjs.map +1 -0
- package/dist/admin/pages/Assets/components/Dnd/assetSortable.js +29 -0
- package/dist/admin/pages/Assets/components/Dnd/assetSortable.js.map +1 -0
- package/dist/admin/pages/Assets/components/Dnd/assetSortable.mjs +24 -0
- package/dist/admin/pages/Assets/components/Dnd/assetSortable.mjs.map +1 -0
- package/dist/admin/pages/Assets/components/Dnd/dndIds.js +5 -0
- package/dist/admin/pages/Assets/components/Dnd/dndIds.js.map +1 -1
- package/dist/admin/pages/Assets/components/Dnd/dndIds.mjs +5 -1
- package/dist/admin/pages/Assets/components/Dnd/dndIds.mjs.map +1 -1
- package/dist/admin/pages/Assets/components/Dnd/useAssetDnd.js +41 -13
- package/dist/admin/pages/Assets/components/Dnd/useAssetDnd.js.map +1 -1
- package/dist/admin/pages/Assets/components/Dnd/useAssetDnd.mjs +41 -13
- package/dist/admin/pages/Assets/components/Dnd/useAssetDnd.mjs.map +1 -1
- package/dist/admin/pages/Assets/components/FilterBadges.mjs +2 -2
- package/dist/admin/pages/Assets/components/FilterMenu.mjs +2 -2
- package/dist/admin/pages/Assets/components/FolderTree/FolderTree.js +274 -55
- package/dist/admin/pages/Assets/components/FolderTree/FolderTree.js.map +1 -1
- package/dist/admin/pages/Assets/components/FolderTree/FolderTree.mjs +277 -59
- package/dist/admin/pages/Assets/components/FolderTree/FolderTree.mjs.map +1 -1
- package/dist/admin/pages/Assets/components/FolderTree/collapsedBranch.js +32 -0
- package/dist/admin/pages/Assets/components/FolderTree/collapsedBranch.js.map +1 -0
- package/dist/admin/pages/Assets/components/FolderTree/collapsedBranch.mjs +29 -0
- package/dist/admin/pages/Assets/components/FolderTree/collapsedBranch.mjs.map +1 -0
- package/dist/admin/pages/Assets/components/ViewToggle.js +126 -0
- package/dist/admin/pages/Assets/components/ViewToggle.js.map +1 -0
- package/dist/admin/pages/Assets/components/ViewToggle.mjs +104 -0
- package/dist/admin/pages/Assets/components/ViewToggle.mjs.map +1 -0
- package/dist/admin/pages/Assets/hooks/useAssetSearch.js +2 -2
- package/dist/admin/pages/Assets/hooks/useAssetSearch.js.map +1 -1
- package/dist/admin/pages/Assets/hooks/useAssetSearch.mjs +2 -2
- package/dist/admin/pages/Assets/hooks/useAssetSearch.mjs.map +1 -1
- package/dist/admin/pages/Assets/hooks/useAssetSelection.js +19 -1
- package/dist/admin/pages/Assets/hooks/useAssetSelection.js.map +1 -1
- package/dist/admin/pages/Assets/hooks/useAssetSelection.mjs +20 -3
- package/dist/admin/pages/Assets/hooks/useAssetSelection.mjs.map +1 -1
- package/dist/admin/pages/Assets/hooks/useAssetsList.js +87 -0
- package/dist/admin/pages/Assets/hooks/useAssetsList.js.map +1 -0
- package/dist/admin/pages/Assets/hooks/useAssetsList.mjs +85 -0
- package/dist/admin/pages/Assets/hooks/useAssetsList.mjs.map +1 -0
- package/dist/admin/pages/Assets/hooks/useBusyAssets.mjs +1 -1
- package/dist/admin/pages/Assets/hooks/useFolderNavigation.js +2 -1
- package/dist/admin/pages/Assets/hooks/useFolderNavigation.js.map +1 -1
- package/dist/admin/pages/Assets/hooks/useFolderNavigation.mjs +3 -2
- package/dist/admin/pages/Assets/hooks/useFolderNavigation.mjs.map +1 -1
- package/dist/admin/pages/Assets/hooks/useListFilters.js +2 -1
- package/dist/admin/pages/Assets/hooks/useListFilters.js.map +1 -1
- package/dist/admin/pages/Assets/hooks/useListFilters.mjs +3 -2
- package/dist/admin/pages/Assets/hooks/useListFilters.mjs.map +1 -1
- package/dist/admin/pages/Assets/hooks/useListQueryParams.js +80 -0
- package/dist/admin/pages/Assets/hooks/useListQueryParams.js.map +1 -0
- package/dist/admin/pages/Assets/hooks/useListQueryParams.mjs +77 -0
- package/dist/admin/pages/Assets/hooks/useListQueryParams.mjs.map +1 -0
- package/dist/admin/pages/Assets/hooks/useListSettings.js +32 -0
- package/dist/admin/pages/Assets/hooks/useListSettings.js.map +1 -0
- package/dist/admin/pages/Assets/hooks/useListSettings.mjs +29 -0
- package/dist/admin/pages/Assets/hooks/useListSettings.mjs.map +1 -0
- package/dist/admin/pages/Assets/hooks/useListSort.js +2 -1
- package/dist/admin/pages/Assets/hooks/useListSort.js.map +1 -1
- package/dist/admin/pages/Assets/hooks/useListSort.mjs +3 -2
- package/dist/admin/pages/Assets/hooks/useListSort.mjs.map +1 -1
- package/dist/admin/services/api.js +92 -7
- package/dist/admin/services/api.js.map +1 -1
- package/dist/admin/services/api.mjs +91 -9
- package/dist/admin/services/api.mjs.map +1 -1
- package/dist/admin/src/components/AssetPickerDialog/AssetPickerDialog.d.ts +19 -0
- package/dist/admin/src/components/AssetPickerDialog/FolderBreadcrumbs.d.ts +10 -0
- package/dist/admin/src/components/AssetPickerDialog/PickerSelectionProvider.d.ts +28 -0
- package/dist/admin/src/components/AssetPickerDialog/SortableSelection.d.ts +12 -0
- package/dist/admin/src/components/AssetPickerDialog/pickerSelection.d.ts +26 -0
- package/dist/admin/src/components/MediaLibraryInput/AssetCard.d.ts +25 -0
- package/dist/admin/src/components/MediaLibraryInput/AssetCarousel.d.ts +16 -0
- package/dist/admin/src/components/MediaLibraryInput/AssetDropZone.d.ts +11 -3
- package/dist/admin/src/components/MediaLibraryInput/AssetPreview.d.ts +17 -0
- package/dist/admin/src/components/MediaLibraryInput/AssetRow.d.ts +13 -3
- package/dist/admin/src/components/MediaLibraryInput/FieldControls.d.ts +19 -0
- package/dist/admin/src/components/MediaLibraryInput/MediaLibraryInput.d.ts +3 -1
- package/dist/admin/src/components/MediaLibraryInput/UploadProgressBar.d.ts +7 -0
- package/dist/admin/src/components/MediaLibraryInput/useFieldUploads.d.ts +31 -0
- package/dist/admin/src/hooks/useMediaLibraryPermissions.d.ts +2 -0
- package/dist/admin/src/pages/Assets/components/AssetsGrid.d.ts +3 -1
- package/dist/admin/src/pages/Assets/components/AssetsSearchInput.d.ts +11 -1
- package/dist/admin/src/pages/Assets/components/AssetsView.d.ts +29 -0
- package/dist/admin/src/pages/Assets/components/Dnd/ReorderHandle.d.ts +12 -0
- package/dist/admin/src/pages/Assets/components/Dnd/assetSortable.d.ts +37 -0
- package/dist/admin/src/pages/Assets/components/Dnd/dndIds.d.ts +5 -0
- package/dist/admin/src/pages/Assets/components/Dnd/useAssetDnd.d.ts +23 -2
- package/dist/admin/src/pages/Assets/components/FolderTree/FolderTree.d.ts +1 -0
- package/dist/admin/src/pages/Assets/components/FolderTree/collapsedBranch.d.ts +21 -0
- package/dist/admin/src/pages/Assets/components/ViewToggle.d.ts +8 -0
- package/dist/admin/src/pages/Assets/hooks/useAssetSelection.d.ts +26 -0
- package/dist/admin/src/pages/Assets/hooks/useAssetsList.d.ts +30 -0
- package/dist/admin/src/pages/Assets/hooks/useListQueryParams.d.ts +27 -0
- package/dist/admin/src/pages/Assets/hooks/useListSettings.d.ts +29 -0
- package/dist/admin/src/services/api.d.ts +24 -1
- package/dist/admin/src/store/uploadProgress.d.ts +14 -1
- package/dist/admin/src/utils/findFolderPath.d.ts +6 -0
- package/dist/admin/src/utils/isAllowedAssetType.d.ts +14 -0
- package/dist/admin/store/uploadProgress.js +30 -3
- package/dist/admin/store/uploadProgress.js.map +1 -1
- package/dist/admin/store/uploadProgress.mjs +29 -4
- package/dist/admin/store/uploadProgress.mjs.map +1 -1
- package/dist/admin/translations/en.json.js +20 -0
- package/dist/admin/translations/en.json.js.map +1 -1
- package/dist/admin/translations/en.json.mjs +20 -0
- package/dist/admin/translations/en.json.mjs.map +1 -1
- package/dist/admin/utils/findFolderPath.js +26 -0
- package/dist/admin/utils/findFolderPath.js.map +1 -0
- package/dist/admin/utils/findFolderPath.mjs +24 -0
- package/dist/admin/utils/findFolderPath.mjs.map +1 -0
- package/dist/admin/utils/isAllowedAssetType.js +33 -0
- package/dist/admin/utils/isAllowedAssetType.js.map +1 -0
- package/dist/admin/utils/isAllowedAssetType.mjs +31 -0
- package/dist/admin/utils/isAllowedAssetType.mjs.map +1 -0
- package/dist/server/controllers/admin-settings.js +5 -1
- package/dist/server/controllers/admin-settings.js.map +1 -1
- package/dist/server/controllers/admin-settings.mjs +5 -1
- package/dist/server/controllers/admin-settings.mjs.map +1 -1
- package/dist/server/services/image-manipulation.js +2 -2
- package/dist/server/services/image-manipulation.js.map +1 -1
- package/dist/server/services/image-manipulation.mjs +2 -2
- package/dist/server/services/image-manipulation.mjs.map +1 -1
- package/dist/server/services/upload.js.map +1 -1
- package/dist/server/services/upload.mjs.map +1 -1
- package/dist/server/src/controllers/admin-settings.d.ts.map +1 -1
- package/dist/server/src/index.d.ts +1 -1
- package/dist/server/src/services/extensions/utils.d.ts +11 -11
- package/dist/server/src/services/image-manipulation.d.ts +1 -1
- package/dist/server/src/services/image-manipulation.d.ts.map +1 -1
- package/dist/server/src/services/index.d.ts +1 -1
- package/dist/server/src/types.d.ts +63 -12
- package/dist/server/src/types.d.ts.map +1 -1
- package/package.json +8 -6
- package/dist/admin/components/MediaLibraryInput/NoLibraryAccessDialog.js +0 -45
- package/dist/admin/components/MediaLibraryInput/NoLibraryAccessDialog.js.map +0 -1
- package/dist/admin/components/MediaLibraryInput/NoLibraryAccessDialog.mjs +0 -43
- package/dist/admin/components/MediaLibraryInput/NoLibraryAccessDialog.mjs.map +0 -1
- package/dist/admin/src/components/MediaLibraryInput/NoLibraryAccessDialog.d.ts +0 -10
|
@@ -1,26 +1,36 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
2
|
import { useState, useRef } from 'react';
|
|
3
|
-
import { useField, useNotification, useClipboard } from '@strapi/admin/strapi-admin';
|
|
3
|
+
import { useField, useNotification, useClipboard, useForm } from '@strapi/admin/strapi-admin';
|
|
4
4
|
import { Field, Flex, VisuallyHidden } from '@strapi/design-system';
|
|
5
|
+
import get from 'lodash/get';
|
|
5
6
|
import { useIntl } from 'react-intl';
|
|
6
7
|
import { useAIMetadataEnabled } from '../../hooks/useAIMetadataEnabled.mjs';
|
|
7
8
|
import { useMediaLibraryPermissions } from '../../hooks/useMediaLibraryPermissions.mjs';
|
|
8
9
|
import { useTracking } from '../../hooks/useTracking.mjs';
|
|
9
|
-
import { AssetDialog } from '../../legacy/components/AssetDialog/AssetDialog.mjs';
|
|
10
10
|
import { EditAssetDialog } from '../../legacy/components/EditAssetDialog/EditAssetContent.mjs';
|
|
11
|
-
import { EditFolderDialog } from '../../legacy/components/EditFolderDialog/EditFolderDialog.mjs';
|
|
12
11
|
import { ImportFromUrlDialog } from '../../pages/Assets/components/ImportFromUrlDialog.mjs';
|
|
13
12
|
import { useUploadFilesMutation, useUploadFromUrlsMutation } from '../../services/api.mjs';
|
|
14
13
|
import { useGetUploadSettingsQuery } from '../../services/settings.mjs';
|
|
15
|
-
import {
|
|
14
|
+
import { isMediaTypeAllowed, filterAllowedFiles } from '../../utils/allowedMediaTypes.mjs';
|
|
16
15
|
import { prefixFileUrlWithBackendUrl } from '../../utils/files.mjs';
|
|
17
16
|
import { getTranslationKey } from '../../utils/translations.mjs';
|
|
18
17
|
import { typeFromMime } from '../../utils/typeFromMime.mjs';
|
|
18
|
+
import { AssetPickerDialog } from '../AssetPickerDialog/AssetPickerDialog.mjs';
|
|
19
19
|
import { AddAssetMenu } from './AddAssetMenu.mjs';
|
|
20
|
+
import { AssetCard, UploadCard } from './AssetCard.mjs';
|
|
21
|
+
import { AssetCarousel } from './AssetCarousel.mjs';
|
|
20
22
|
import { AssetDropZone } from './AssetDropZone.mjs';
|
|
21
|
-
import { AssetRow } from './AssetRow.mjs';
|
|
22
|
-
import {
|
|
23
|
+
import { UploadRow, AssetRow } from './AssetRow.mjs';
|
|
24
|
+
import { useFieldUploads } from './useFieldUploads.mjs';
|
|
23
25
|
|
|
26
|
+
/**
|
|
27
|
+
* What a field wrote that its form has not rendered yet, per form and field.
|
|
28
|
+
* `getValues()` only catches up on render, and two uploads can complete before
|
|
29
|
+
* the next one. Kept outside the input so it survives a remount.
|
|
30
|
+
*/ const unrenderedWrites = new WeakMap();
|
|
31
|
+
const toAssets = (value)=>Array.isArray(value) ? value : value ? [
|
|
32
|
+
value
|
|
33
|
+
] : [];
|
|
24
34
|
/**
|
|
25
35
|
* `location` for every event this field fires. The standalone Media Library
|
|
26
36
|
* tags its events `'upload'`; the picker inside an entry form has always been
|
|
@@ -42,15 +52,15 @@ const EMPTY_ATTRIBUTE = {};
|
|
|
42
52
|
*
|
|
43
53
|
* The legacy input is still registered when `useLegacyMediaLibrary` is on, and
|
|
44
54
|
* is untouched by this.
|
|
45
|
-
*/ const MediaLibraryInput = ({ name, label, labelAction, hint, required = false, disabled = false, attribute = EMPTY_ATTRIBUTE })=>{
|
|
55
|
+
*/ const MediaLibraryInput = ({ name, label, labelAction, hint, required = false, disabled = false, attribute = EMPTY_ATTRIBUTE, layoutSize })=>{
|
|
46
56
|
const { allowedTypes = null, multiple = false } = attribute;
|
|
47
57
|
const { formatMessage } = useIntl();
|
|
48
58
|
const { onChange, value, error } = useField(name);
|
|
49
59
|
const { toggleNotification } = useNotification();
|
|
50
60
|
const { trackUsage } = useTracking();
|
|
51
61
|
const { copy } = useClipboard();
|
|
62
|
+
const getValues = useForm('MediaLibraryInput', (state)=>state.getValues);
|
|
52
63
|
const [step, setStep] = useState(undefined);
|
|
53
|
-
const [folderId, setFolderId] = useState(null);
|
|
54
64
|
const [editedAsset, setEditedAsset] = useState(null);
|
|
55
65
|
const [isUrlDialogOpen, setIsUrlDialogOpen] = useState(false);
|
|
56
66
|
const fileInputRef = useRef(null);
|
|
@@ -58,7 +68,10 @@ const EMPTY_ATTRIBUTE = {};
|
|
|
58
68
|
const [uploadFromUrls] = useUploadFromUrlsMutation();
|
|
59
69
|
// Echoes the app config; a missing payload (still loading) falls back to
|
|
60
70
|
// sequential rather than outpacing what the server asked for.
|
|
61
|
-
const { canRead, canCreate, canUpdate, canCopyLink, canDownload } = useMediaLibraryPermissions();
|
|
71
|
+
const { isLoading, canRead, canCreate, canUpdate, canCopyLink, canDownload } = useMediaLibraryPermissions();
|
|
72
|
+
// Not while permissions load: `useRBAC` starts with every flag false, and an
|
|
73
|
+
// upload sent before it settles can end in a 403.
|
|
74
|
+
const canUpload = !isLoading && canCreate;
|
|
62
75
|
const { data: settings } = useGetUploadSettingsQuery(undefined, {
|
|
63
76
|
skip: !canRead
|
|
64
77
|
});
|
|
@@ -80,20 +93,30 @@ const EMPTY_ATTRIBUTE = {};
|
|
|
80
93
|
}
|
|
81
94
|
onChange(name, nextAssets[0] ?? null);
|
|
82
95
|
};
|
|
96
|
+
const handleRemove = (asset)=>{
|
|
97
|
+
setAssets(assets.filter((current)=>current.id !== asset.id));
|
|
98
|
+
};
|
|
99
|
+
// Bound to the form, not to this input: a component collapsed mid-upload
|
|
100
|
+
// unmounts the field, and the file must still land on the entry.
|
|
83
101
|
const attachUploadedFile = (file)=>{
|
|
84
|
-
const
|
|
85
|
-
|
|
102
|
+
const writes = unrenderedWrites.get(getValues) ?? new Map();
|
|
103
|
+
unrenderedWrites.set(getValues, writes);
|
|
104
|
+
const value = get(getValues(), name);
|
|
105
|
+
const pending = writes.get(name);
|
|
106
|
+
const current = pending && pending.seen === value ? pending.written : toAssets(value);
|
|
107
|
+
const next = multiple ? [
|
|
108
|
+
...current,
|
|
86
109
|
file
|
|
87
110
|
] : [
|
|
88
111
|
file
|
|
89
112
|
];
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
setAssets(assets.filter((current)=>current.id !== asset.id));
|
|
113
|
+
writes.set(name, {
|
|
114
|
+
seen: value,
|
|
115
|
+
written: next
|
|
116
|
+
});
|
|
117
|
+
setAssets(next);
|
|
96
118
|
};
|
|
119
|
+
const { uploads, cancel, retry, dismiss } = useFieldUploads(name);
|
|
97
120
|
const handleCopyLink = async (asset)=>{
|
|
98
121
|
const url = prefixFileUrlWithBackendUrl(asset.url);
|
|
99
122
|
if (!url) {
|
|
@@ -129,7 +152,6 @@ const EMPTY_ATTRIBUTE = {};
|
|
|
129
152
|
const handleSelect = (selectedAssets)=>{
|
|
130
153
|
setAssets(selectedAssets);
|
|
131
154
|
setStep(undefined);
|
|
132
|
-
setFolderId(null);
|
|
133
155
|
};
|
|
134
156
|
const notifyUnsupported = ()=>{
|
|
135
157
|
toggleNotification({
|
|
@@ -163,8 +185,8 @@ const EMPTY_ATTRIBUTE = {};
|
|
|
163
185
|
});
|
|
164
186
|
return true;
|
|
165
187
|
};
|
|
166
|
-
const handleUpload =
|
|
167
|
-
if (disabled || files.length === 0) {
|
|
188
|
+
const handleUpload = (files)=>{
|
|
189
|
+
if (disabled || !canUpload || files.length === 0) {
|
|
168
190
|
return;
|
|
169
191
|
}
|
|
170
192
|
// The device picker can't reach this — it carries `multiple` — so a drop is
|
|
@@ -195,6 +217,12 @@ const EMPTY_ATTRIBUTE = {};
|
|
|
195
217
|
location: CONTENT_MANAGER_LOCATION,
|
|
196
218
|
...assetsCountByType
|
|
197
219
|
});
|
|
220
|
+
startUpload(allowedFiles);
|
|
221
|
+
};
|
|
222
|
+
/**
|
|
223
|
+
* Hands the files to the shared upload pool. The field picks the results up
|
|
224
|
+
* from `onFileUploaded`, which also runs for retries of the same rows.
|
|
225
|
+
*/ const startUpload = (allowedFiles)=>{
|
|
198
226
|
const formData = new FormData();
|
|
199
227
|
allowedFiles.forEach((file)=>formData.append('files', file));
|
|
200
228
|
formData.append('fileInfo', JSON.stringify(allowedFiles.map((file)=>({
|
|
@@ -203,30 +231,18 @@ const EMPTY_ATTRIBUTE = {};
|
|
|
203
231
|
alternativeText: null,
|
|
204
232
|
folder: UPLOAD_FOLDER_ID
|
|
205
233
|
}))));
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
onFileUploaded: attachUploadedFile
|
|
215
|
-
}).unwrap();
|
|
216
|
-
} catch {
|
|
217
|
-
// Errors reach the user through the progress dialog, which the mutation
|
|
218
|
-
// populates itself.
|
|
219
|
-
}
|
|
220
|
-
};
|
|
221
|
-
const handleZoneClick = ()=>{
|
|
222
|
-
if (canRead) {
|
|
223
|
-
setStep('browse');
|
|
224
|
-
} else if (canCreate) {
|
|
225
|
-
fileInputRef.current?.click();
|
|
226
|
-
} else {
|
|
227
|
-
setStep('no-access');
|
|
228
|
-
}
|
|
234
|
+
uploadFiles({
|
|
235
|
+
formData,
|
|
236
|
+
totalFiles: allowedFiles.length,
|
|
237
|
+
concurrency,
|
|
238
|
+
generateAiMetadata: Boolean(isAiMetadataEnabled),
|
|
239
|
+
onFileUploaded: attachUploadedFile,
|
|
240
|
+
owner: name
|
|
241
|
+
});
|
|
229
242
|
};
|
|
243
|
+
const handleRetry = (upload)=>retry(upload, (file)=>startUpload([
|
|
244
|
+
file
|
|
245
|
+
]));
|
|
230
246
|
/**
|
|
231
247
|
* The server fetches each URL and uploads what it finds, so the file's type
|
|
232
248
|
* is not known here — `allowedTypes` can only be enforced on what comes back.
|
|
@@ -278,7 +294,7 @@ const EMPTY_ATTRIBUTE = {};
|
|
|
278
294
|
// populates itself.
|
|
279
295
|
}
|
|
280
296
|
};
|
|
281
|
-
const handleFileInputChange =
|
|
297
|
+
const handleFileInputChange = (event)=>{
|
|
282
298
|
// Copied before the reset, not after: `event.target.files` is the input's
|
|
283
299
|
// live FileList, and clearing `value` empties it in place. Reading it
|
|
284
300
|
// afterwards yields nothing and the upload never starts.
|
|
@@ -286,8 +302,64 @@ const EMPTY_ATTRIBUTE = {};
|
|
|
286
302
|
// Reset so picking the same file twice in a row still fires `change`.
|
|
287
303
|
event.target.value = '';
|
|
288
304
|
if (files.length > 0) {
|
|
289
|
-
|
|
305
|
+
handleUpload(files);
|
|
306
|
+
}
|
|
307
|
+
};
|
|
308
|
+
const renderValue = ()=>{
|
|
309
|
+
const dropZone = (variant)=>/*#__PURE__*/ jsx(AssetDropZone, {
|
|
310
|
+
variant: variant,
|
|
311
|
+
disabled: disabled || !canUpload,
|
|
312
|
+
onDropFiles: handleUpload
|
|
313
|
+
});
|
|
314
|
+
if (assets.length === 0 && uploads.length === 0) {
|
|
315
|
+
return dropZone('bar');
|
|
316
|
+
}
|
|
317
|
+
const uploadHandlers = {
|
|
318
|
+
disabled,
|
|
319
|
+
onCancel: cancel,
|
|
320
|
+
onRetry: handleRetry,
|
|
321
|
+
onRemove: (upload)=>dismiss(upload.key)
|
|
322
|
+
};
|
|
323
|
+
if (!multiple) {
|
|
324
|
+
// A replacement in flight, or one that failed, stands in for the current
|
|
325
|
+
// asset until it lands or is removed.
|
|
326
|
+
if (uploads.length > 0) {
|
|
327
|
+
return /*#__PURE__*/ jsx(Flex, {
|
|
328
|
+
direction: "column",
|
|
329
|
+
alignItems: "stretch",
|
|
330
|
+
gap: 2,
|
|
331
|
+
children: uploads.map((upload)=>/*#__PURE__*/ jsx(UploadRow, {
|
|
332
|
+
upload: upload,
|
|
333
|
+
...uploadHandlers
|
|
334
|
+
}, upload.key))
|
|
335
|
+
});
|
|
336
|
+
}
|
|
337
|
+
return /*#__PURE__*/ jsx(AssetRow, {
|
|
338
|
+
asset: assets[0],
|
|
339
|
+
disabled: disabled,
|
|
340
|
+
onCopyLink: handleCopyLink,
|
|
341
|
+
// The details dialog needs the library's folder tree, which needs read access.
|
|
342
|
+
onEdit: canRead ? setEditedAsset : undefined,
|
|
343
|
+
onRemove: handleRemove
|
|
344
|
+
});
|
|
290
345
|
}
|
|
346
|
+
return /*#__PURE__*/ jsxs(AssetCarousel, {
|
|
347
|
+
renderDropZone: dropZone,
|
|
348
|
+
layoutSize: layoutSize,
|
|
349
|
+
children: [
|
|
350
|
+
assets.map((asset)=>/*#__PURE__*/ jsx(AssetCard, {
|
|
351
|
+
asset: asset,
|
|
352
|
+
disabled: disabled,
|
|
353
|
+
onCopyLink: handleCopyLink,
|
|
354
|
+
onEdit: canRead ? setEditedAsset : undefined,
|
|
355
|
+
onRemove: handleRemove
|
|
356
|
+
}, asset.id)),
|
|
357
|
+
uploads.map((upload)=>/*#__PURE__*/ jsx(UploadCard, {
|
|
358
|
+
upload: upload,
|
|
359
|
+
...uploadHandlers
|
|
360
|
+
}, upload.key))
|
|
361
|
+
]
|
|
362
|
+
});
|
|
291
363
|
};
|
|
292
364
|
return /*#__PURE__*/ jsxs(Field.Root, {
|
|
293
365
|
name: name,
|
|
@@ -312,26 +384,7 @@ const EMPTY_ATTRIBUTE = {};
|
|
|
312
384
|
})
|
|
313
385
|
]
|
|
314
386
|
}),
|
|
315
|
-
|
|
316
|
-
direction: "column",
|
|
317
|
-
alignItems: "stretch",
|
|
318
|
-
gap: 1,
|
|
319
|
-
children: [
|
|
320
|
-
assets.map((asset)=>/*#__PURE__*/ jsx(AssetRow, {
|
|
321
|
-
asset: asset,
|
|
322
|
-
disabled: disabled,
|
|
323
|
-
onCopyLink: handleCopyLink,
|
|
324
|
-
// The details dialog needs the library's folder tree, which needs read access.
|
|
325
|
-
onEdit: canRead ? setEditedAsset : undefined,
|
|
326
|
-
onRemove: handleRemove
|
|
327
|
-
}, asset.id)),
|
|
328
|
-
/*#__PURE__*/ jsx(AssetDropZone, {
|
|
329
|
-
disabled: disabled,
|
|
330
|
-
onClick: handleZoneClick,
|
|
331
|
-
onDropFiles: handleUpload
|
|
332
|
-
})
|
|
333
|
-
]
|
|
334
|
-
}),
|
|
387
|
+
renderValue(),
|
|
335
388
|
/*#__PURE__*/ jsx(Field.Error, {}),
|
|
336
389
|
/*#__PURE__*/ jsx(Field.Hint, {}),
|
|
337
390
|
/*#__PURE__*/ jsx(VisuallyHidden, {
|
|
@@ -344,26 +397,19 @@ const EMPTY_ATTRIBUTE = {};
|
|
|
344
397
|
"aria-hidden": true
|
|
345
398
|
})
|
|
346
399
|
}),
|
|
347
|
-
step === 'browse' && /*#__PURE__*/ jsx(
|
|
400
|
+
step === 'browse' && /*#__PURE__*/ jsx(AssetPickerDialog, {
|
|
348
401
|
open: true,
|
|
402
|
+
title: formatMessage({
|
|
403
|
+
id: getTranslationKey('asset-picker.title'),
|
|
404
|
+
defaultMessage: 'Add asset for {fieldName}'
|
|
405
|
+
}, {
|
|
406
|
+
fieldName: label ?? name
|
|
407
|
+
}),
|
|
408
|
+
initialSelection: assets,
|
|
349
409
|
multiple: multiple,
|
|
350
|
-
allowedTypes: allowedTypes
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
trackedLocation: CONTENT_MANAGER_LOCATION,
|
|
354
|
-
onClose: ()=>{
|
|
355
|
-
setStep(undefined);
|
|
356
|
-
setFolderId(null);
|
|
357
|
-
},
|
|
358
|
-
onValidate: handleSelect,
|
|
359
|
-
onAddFolder: ()=>setStep('create-folder'),
|
|
360
|
-
// The dialog's own upload button hands back to this field's upload
|
|
361
|
-
// path, so every route to an uploaded file opens the progress dialog.
|
|
362
|
-
onAddAsset: ()=>{
|
|
363
|
-
setStep(undefined);
|
|
364
|
-
fileInputRef.current?.click();
|
|
365
|
-
},
|
|
366
|
-
onChangeFolder: (nextFolderId)=>setFolderId(nextFolderId)
|
|
410
|
+
allowedTypes: allowedTypes,
|
|
411
|
+
onClose: ()=>setStep(undefined),
|
|
412
|
+
onConfirm: handleSelect
|
|
367
413
|
}),
|
|
368
414
|
editedAsset && /*#__PURE__*/ jsx(EditAssetDialog, {
|
|
369
415
|
open: true,
|
|
@@ -374,14 +420,6 @@ const EMPTY_ATTRIBUTE = {};
|
|
|
374
420
|
trackedLocation: CONTENT_MANAGER_LOCATION,
|
|
375
421
|
onClose: handleEditClose
|
|
376
422
|
}),
|
|
377
|
-
step === 'create-folder' && /*#__PURE__*/ jsx(EditFolderDialog, {
|
|
378
|
-
open: true,
|
|
379
|
-
onClose: ()=>setStep('browse'),
|
|
380
|
-
parentFolderId: folderId
|
|
381
|
-
}),
|
|
382
|
-
step === 'no-access' && /*#__PURE__*/ jsx(NoLibraryAccessDialog, {
|
|
383
|
-
onClose: ()=>setStep(undefined)
|
|
384
|
-
}),
|
|
385
423
|
/*#__PURE__*/ jsx(ImportFromUrlDialog, {
|
|
386
424
|
open: isUrlDialogOpen,
|
|
387
425
|
onClose: ()=>setIsUrlDialogOpen(false),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MediaLibraryInput.mjs","sources":["../../../../admin/src/components/MediaLibraryInput/MediaLibraryInput.tsx"],"sourcesContent":["import { useRef, useState, type ChangeEvent, type ReactNode } from 'react';\n\nimport { useClipboard, useField, useNotification } from '@strapi/admin/strapi-admin';\nimport { Field, Flex, VisuallyHidden } from '@strapi/design-system';\nimport { useIntl } from 'react-intl';\n\nimport { useAIMetadataEnabled } from '../../hooks/useAIMetadataEnabled';\nimport { useMediaLibraryPermissions } from '../../hooks/useMediaLibraryPermissions';\nimport { useTracking } from '../../hooks/useTracking';\n// Temporary: the Content Manager's own asset picker is not built on this stack\n// yet, so browsing and editing the library still go through the legacy dialogs.\n// These imports go when that modal lands.\nimport { AssetDialog } from '../../legacy/components/AssetDialog/AssetDialog';\nimport {\n EditAssetDialog,\n type Asset as EditableAsset,\n} from '../../legacy/components/EditAssetDialog/EditAssetContent';\nimport { EditFolderDialog } from '../../legacy/components/EditFolderDialog/EditFolderDialog';\nimport { ImportFromUrlDialog } from '../../pages/Assets/components/ImportFromUrlDialog';\nimport { useUploadFilesMutation, useUploadFromUrlsMutation } from '../../services/api';\nimport { useGetUploadSettingsQuery } from '../../services/settings';\nimport {\n filterAllowedFiles,\n isMediaTypeAllowed,\n type AllowedMediaType,\n} from '../../utils/allowedMediaTypes';\nimport { prefixFileUrlWithBackendUrl } from '../../utils/files';\nimport { getTranslationKey } from '../../utils/translations';\nimport { typeFromMime } from '../../utils/typeFromMime';\n\nimport { AddAssetMenu } from './AddAssetMenu';\nimport { AssetDropZone } from './AssetDropZone';\nimport { AssetRow } from './AssetRow';\nimport { NoLibraryAccessDialog } from './NoLibraryAccessDialog';\n\nimport type { File } from '../../../../shared/contracts/files';\n\n/**\n * `location` for every event this field fires. The standalone Media Library\n * tags its events `'upload'`; the picker inside an entry form has always been\n * `'content-manager'`, and analytics still splits the two on that axis.\n */\nconst CONTENT_MANAGER_LOCATION = 'content-manager';\n\n/**\n * Uploads from here land at the root of the Media Library. An entry form has no\n * current folder to inherit, and the field offers no destination picker — same\n * place the legacy upload wizard put them when none was chosen.\n */\nconst UPLOAD_FOLDER_ID = null;\n\ntype Step = 'browse' | 'create-folder' | 'no-access';\n\nexport interface MediaLibraryInputProps {\n name: string;\n label?: string;\n labelAction?: ReactNode;\n hint?: string;\n required?: boolean;\n disabled?: boolean;\n attribute?: {\n allowedTypes?: AllowedMediaType[] | null;\n multiple?: boolean;\n };\n}\n\nconst EMPTY_ATTRIBUTE: NonNullable<MediaLibraryInputProps['attribute']> = {};\n\n/**\n * The Content Manager's `media` field, on the current Media Library stack.\n *\n * Files dropped here (or picked from the device) upload straight through\n * `uploadFiles`, which is what drives the global upload progress dialog — so the\n * entry form stays usable while they go, instead of being covered by the legacy\n * wizard.\n *\n * The legacy input is still registered when `useLegacyMediaLibrary` is on, and\n * is untouched by this.\n */\nexport const MediaLibraryInput = ({\n name,\n label,\n labelAction,\n hint,\n required = false,\n disabled = false,\n attribute = EMPTY_ATTRIBUTE,\n}: MediaLibraryInputProps) => {\n const { allowedTypes = null, multiple = false } = attribute;\n const { formatMessage } = useIntl();\n const { onChange, value, error } = useField<File | File[] | null>(name);\n const { toggleNotification } = useNotification();\n const { trackUsage } = useTracking();\n const { copy } = useClipboard();\n\n const [step, setStep] = useState<Step | undefined>(undefined);\n const [folderId, setFolderId] = useState<number | null>(null);\n const [editedAsset, setEditedAsset] = useState<File | null>(null);\n const [isUrlDialogOpen, setIsUrlDialogOpen] = useState(false);\n const fileInputRef = useRef<HTMLInputElement>(null);\n\n const [uploadFiles] = useUploadFilesMutation();\n const [uploadFromUrls] = useUploadFromUrlsMutation();\n // Echoes the app config; a missing payload (still loading) falls back to\n // sequential rather than outpacing what the server asked for.\n const { canRead, canCreate, canUpdate, canCopyLink, canDownload } = useMediaLibraryPermissions();\n const { data: settings } = useGetUploadSettingsQuery(undefined, { skip: !canRead });\n const concurrency = settings?.data?.concurrentUploadRequests ?? 1;\n const isAiMetadataEnabled = useAIMetadataEnabled();\n\n const assets: File[] = Array.isArray(value) ? value : value ? [value] : [];\n\n // An upload resumes long after the render that started it, and the dialog is\n // non-blocking precisely so a second batch can be dropped meanwhile. Reading\n // the closed-over `assets` on resume would then append to whatever the field\n // held when that drop began, dropping every asset that landed since.\n const assetsRef = useRef(assets);\n assetsRef.current = assets;\n\n const setAssets = (nextAssets: File[]) => {\n if (multiple) {\n onChange(name, nextAssets.length > 0 ? nextAssets : null);\n return;\n }\n onChange(name, nextAssets[0] ?? null);\n };\n\n const attachUploadedFile = (file: File) => {\n const nextAssets = multiple ? [...assetsRef.current, file] : [file];\n // Parallel uploads can finish before the next render refreshes the ref.\n assetsRef.current = nextAssets;\n setAssets(nextAssets);\n };\n\n const handleRemove = (asset: File) => {\n setAssets(assets.filter((current) => current.id !== asset.id));\n };\n\n const handleCopyLink = async (asset: File) => {\n const url = prefixFileUrlWithBackendUrl(asset.url);\n\n if (!url) {\n return;\n }\n\n const didCopy = await copy(url);\n\n toggleNotification({\n type: didCopy ? 'success' : 'danger',\n message: formatMessage(\n didCopy\n ? {\n id: getTranslationKey('asset-details.copy-link.success'),\n defaultMessage: 'Link copied.',\n }\n : {\n id: getTranslationKey('asset-details.copy-link.error'),\n defaultMessage: 'Failed to copy the link.',\n }\n ),\n });\n };\n\n const handleEditClose = (result?: EditableAsset | null | boolean) => {\n const asset = editedAsset;\n setEditedAsset(null);\n\n if (!asset) {\n return;\n }\n\n // `null` means the asset was deleted from the library from inside the dialog.\n if (result === null) {\n setAssets(assetsRef.current.filter((current) => current.id !== asset.id));\n return;\n }\n\n if (result && typeof result !== 'boolean') {\n setAssets(\n assetsRef.current.map((current) => (current.id === asset.id ? (result as File) : current))\n );\n }\n };\n\n const handleSelect = (selectedAssets: File[]) => {\n setAssets(selectedAssets);\n setStep(undefined);\n setFolderId(null);\n };\n\n const notifyUnsupported = () => {\n toggleNotification({\n type: 'danger',\n timeout: 4000,\n message: formatMessage(\n {\n // Legacy key: translated everywhere, and it names the accepted types,\n // which the field already passes as `fileTypes`.\n id: getTranslationKey('input.notification.not-supported'),\n defaultMessage: `You can't upload this type of file, only the following types are accepted – {fileTypes}`,\n },\n { fileTypes: (allowedTypes ?? []).join(',') }\n ),\n });\n };\n\n /**\n * True when the batch is more than a single-value field can take. Counted on\n * what was handed in rather than on what survives filtering: uploading one of\n * several would leave the user guessing which one the field kept.\n */\n const rejectsBatch = (count: number) => {\n if (multiple || count <= 1) {\n return false;\n }\n\n toggleNotification({\n type: 'danger',\n timeout: 4000,\n message: formatMessage({\n id: getTranslationKey('content-manager.input.notification.single-file'),\n defaultMessage: 'This field accepts only one file.',\n }),\n });\n\n return true;\n };\n\n const handleUpload = async (files: globalThis.File[]) => {\n if (disabled || files.length === 0) {\n return;\n }\n\n // The device picker can't reach this — it carries `multiple` — so a drop is\n // the only way in.\n if (rejectsBatch(files.length)) {\n return;\n }\n\n const allowedFiles = filterAllowedFiles(allowedTypes, files);\n\n if (allowedFiles.length === 0) {\n notifyUnsupported();\n return;\n }\n\n // A mixed drop uploads what it can and says so, rather than silently\n // dropping the rest.\n if (allowedFiles.length < files.length) {\n notifyUnsupported();\n }\n\n const assetsCountByType = allowedFiles.reduce<Record<string, number>>((acc, file) => {\n const type = typeFromMime(file.type);\n acc[type] = (acc[type] ?? 0) + 1;\n return acc;\n }, {});\n trackUsage('didSelectFile', { source: 'computer', location: CONTENT_MANAGER_LOCATION });\n trackUsage('willAddMediaLibraryAssets', {\n location: CONTENT_MANAGER_LOCATION,\n ...assetsCountByType,\n });\n\n const formData = new FormData();\n allowedFiles.forEach((file) => formData.append('files', file));\n formData.append(\n 'fileInfo',\n JSON.stringify(\n allowedFiles.map((file) => ({\n name: file.name,\n caption: null,\n alternativeText: null,\n folder: UPLOAD_FOLDER_ID,\n }))\n )\n );\n\n try {\n // Attached per file rather than from the result: a Retry in the progress\n // dialog uploads cancelled files after this call has already resolved.\n await uploadFiles({\n formData,\n totalFiles: allowedFiles.length,\n concurrency,\n generateAiMetadata: Boolean(isAiMetadataEnabled),\n onFileUploaded: attachUploadedFile,\n }).unwrap();\n } catch {\n // Errors reach the user through the progress dialog, which the mutation\n // populates itself.\n }\n };\n\n const handleZoneClick = () => {\n if (canRead) {\n setStep('browse');\n } else if (canCreate) {\n fileInputRef.current?.click();\n } else {\n setStep('no-access');\n }\n };\n\n /**\n * The server fetches each URL and uploads what it finds, so the file's type\n * is not known here — `allowedTypes` can only be enforced on what comes back.\n * A URL whose file the field does not accept is uploaded to the library and\n * left off the field, which is also what the Media Library page does with it.\n */\n const handleUrlUpload = async (urls: string[]) => {\n if (disabled || urls.length === 0 || rejectsBatch(urls.length)) {\n return;\n }\n\n trackUsage('didSelectFile', { source: 'url', location: CONTENT_MANAGER_LOCATION });\n trackUsage('willAddMediaLibraryAssets', { location: CONTENT_MANAGER_LOCATION });\n\n try {\n const { data: uploadedFiles } = await uploadFromUrls({\n urls,\n folderId: UPLOAD_FOLDER_ID,\n generateAiMetadata: Boolean(isAiMetadataEnabled),\n }).unwrap();\n\n const allowedFiles = uploadedFiles.filter((file) =>\n isMediaTypeAllowed(allowedTypes, file.mime)\n );\n const notAttachedFiles = uploadedFiles.filter((file) => !allowedFiles.includes(file));\n\n if (notAttachedFiles.length > 0) {\n toggleNotification({\n type: 'warning',\n timeout: 4000,\n message: formatMessage(\n {\n id: getTranslationKey('content-manager.input.notification.not-attached'),\n defaultMessage:\n '{fileNames} {count, plural, one {was} other {were}} added to the Media Library, but this field only accepts {fileTypes}.',\n },\n {\n fileNames: notAttachedFiles.map((file) => file.name).join(', '),\n count: notAttachedFiles.length,\n fileTypes: (allowedTypes ?? []).join(', '),\n }\n ),\n });\n }\n\n if (allowedFiles.length > 0) {\n setAssets(multiple ? [...assetsRef.current, ...allowedFiles] : [allowedFiles[0]]);\n }\n } catch {\n // Errors reach the user through the progress dialog, which the mutation\n // populates itself.\n }\n };\n\n const handleFileInputChange = async (event: ChangeEvent<HTMLInputElement>) => {\n // Copied before the reset, not after: `event.target.files` is the input's\n // live FileList, and clearing `value` empties it in place. Reading it\n // afterwards yields nothing and the upload never starts.\n const files = Array.from(event.target.files ?? []);\n // Reset so picking the same file twice in a row still fires `change`.\n event.target.value = '';\n\n if (files.length > 0) {\n await handleUpload(files);\n }\n };\n\n return (\n <Field.Root name={name} error={error} hint={hint} required={required}>\n <Flex justifyContent=\"space-between\" alignItems=\"center\" gap={2}>\n <Field.Label action={labelAction}>{label}</Field.Label>\n <AddAssetMenu\n disabled={disabled}\n onBrowseLibrary={() => setStep('browse')}\n onUploadFromDevice={() => fileInputRef.current?.click()}\n onUploadFromUrl={() => setIsUrlDialogOpen(true)}\n />\n </Flex>\n\n <Flex direction=\"column\" alignItems=\"stretch\" gap={1}>\n {assets.map((asset) => (\n <AssetRow\n key={asset.id}\n asset={asset}\n disabled={disabled}\n onCopyLink={handleCopyLink}\n // The details dialog needs the library's folder tree, which needs read access.\n onEdit={canRead ? setEditedAsset : undefined}\n onRemove={handleRemove}\n />\n ))}\n\n <AssetDropZone disabled={disabled} onClick={handleZoneClick} onDropFiles={handleUpload} />\n </Flex>\n\n <Field.Error />\n <Field.Hint />\n\n <VisuallyHidden>\n <input\n ref={fileInputRef}\n type=\"file\"\n multiple={multiple}\n onChange={handleFileInputChange}\n tabIndex={-1}\n aria-hidden\n />\n </VisuallyHidden>\n\n {step === 'browse' && (\n <AssetDialog\n open\n multiple={multiple}\n allowedTypes={allowedTypes ?? []}\n initiallySelectedAssets={assets}\n folderId={folderId}\n trackedLocation={CONTENT_MANAGER_LOCATION}\n onClose={() => {\n setStep(undefined);\n setFolderId(null);\n }}\n onValidate={handleSelect}\n onAddFolder={() => setStep('create-folder')}\n // The dialog's own upload button hands back to this field's upload\n // path, so every route to an uploaded file opens the progress dialog.\n onAddAsset={() => {\n setStep(undefined);\n fileInputRef.current?.click();\n }}\n onChangeFolder={(nextFolderId) => setFolderId(nextFolderId)}\n />\n )}\n\n {editedAsset && (\n <EditAssetDialog\n open\n asset={editedAsset as EditableAsset}\n canUpdate={canUpdate && !disabled}\n canCopyLink={canCopyLink}\n canDownload={canDownload}\n trackedLocation={CONTENT_MANAGER_LOCATION}\n onClose={handleEditClose}\n />\n )}\n\n {step === 'create-folder' && (\n <EditFolderDialog open onClose={() => setStep('browse')} parentFolderId={folderId} />\n )}\n\n {step === 'no-access' && <NoLibraryAccessDialog onClose={() => setStep(undefined)} />}\n\n <ImportFromUrlDialog\n open={isUrlDialogOpen}\n onClose={() => setIsUrlDialogOpen(false)}\n onUpload={handleUrlUpload}\n />\n </Field.Root>\n );\n};\n"],"names":["CONTENT_MANAGER_LOCATION","UPLOAD_FOLDER_ID","EMPTY_ATTRIBUTE","MediaLibraryInput","name","label","labelAction","hint","required","disabled","attribute","allowedTypes","multiple","formatMessage","useIntl","onChange","value","error","useField","toggleNotification","useNotification","trackUsage","useTracking","copy","useClipboard","step","setStep","useState","undefined","folderId","setFolderId","editedAsset","setEditedAsset","isUrlDialogOpen","setIsUrlDialogOpen","fileInputRef","useRef","uploadFiles","useUploadFilesMutation","uploadFromUrls","useUploadFromUrlsMutation","canRead","canCreate","canUpdate","canCopyLink","canDownload","useMediaLibraryPermissions","data","settings","useGetUploadSettingsQuery","skip","concurrency","concurrentUploadRequests","isAiMetadataEnabled","useAIMetadataEnabled","assets","Array","isArray","assetsRef","current","setAssets","nextAssets","length","attachUploadedFile","file","handleRemove","asset","filter","id","handleCopyLink","url","prefixFileUrlWithBackendUrl","didCopy","type","message","getTranslationKey","defaultMessage","handleEditClose","result","map","handleSelect","selectedAssets","notifyUnsupported","timeout","fileTypes","join","rejectsBatch","count","handleUpload","files","allowedFiles","filterAllowedFiles","assetsCountByType","reduce","acc","typeFromMime","source","location","formData","FormData","forEach","append","JSON","stringify","caption","alternativeText","folder","totalFiles","generateAiMetadata","Boolean","onFileUploaded","unwrap","handleZoneClick","click","handleUrlUpload","urls","uploadedFiles","isMediaTypeAllowed","mime","notAttachedFiles","includes","fileNames","handleFileInputChange","event","from","target","_jsxs","Field","Root","Flex","justifyContent","alignItems","gap","_jsx","Label","action","AddAssetMenu","onBrowseLibrary","onUploadFromDevice","onUploadFromUrl","direction","AssetRow","onCopyLink","onEdit","onRemove","AssetDropZone","onClick","onDropFiles","Error","Hint","VisuallyHidden","input","ref","tabIndex","aria-hidden","AssetDialog","open","initiallySelectedAssets","trackedLocation","onClose","onValidate","onAddFolder","onAddAsset","onChangeFolder","nextFolderId","EditAssetDialog","EditFolderDialog","parentFolderId","NoLibraryAccessDialog","ImportFromUrlDialog","onUpload"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"MediaLibraryInput.mjs","sources":["../../../../admin/src/components/MediaLibraryInput/MediaLibraryInput.tsx"],"sourcesContent":["import { useRef, useState, type ChangeEvent, type ReactNode } from 'react';\n\nimport { useClipboard, useField, useForm, useNotification } from '@strapi/admin/strapi-admin';\nimport { Field, Flex, VisuallyHidden } from '@strapi/design-system';\nimport get from 'lodash/get';\nimport { useIntl } from 'react-intl';\n\nimport { useAIMetadataEnabled } from '../../hooks/useAIMetadataEnabled';\nimport { useMediaLibraryPermissions } from '../../hooks/useMediaLibraryPermissions';\nimport { useTracking } from '../../hooks/useTracking';\nimport {\n EditAssetDialog,\n type Asset as EditableAsset,\n} from '../../legacy/components/EditAssetDialog/EditAssetContent';\nimport { ImportFromUrlDialog } from '../../pages/Assets/components/ImportFromUrlDialog';\nimport { useUploadFilesMutation, useUploadFromUrlsMutation } from '../../services/api';\nimport { useGetUploadSettingsQuery } from '../../services/settings';\nimport {\n filterAllowedFiles,\n isMediaTypeAllowed,\n type AllowedMediaType,\n} from '../../utils/allowedMediaTypes';\nimport { prefixFileUrlWithBackendUrl } from '../../utils/files';\nimport { getTranslationKey } from '../../utils/translations';\nimport { typeFromMime } from '../../utils/typeFromMime';\nimport { AssetPickerDialog } from '../AssetPickerDialog/AssetPickerDialog';\n\nimport { AddAssetMenu } from './AddAssetMenu';\nimport { AssetCard, UploadCard } from './AssetCard';\nimport { AssetCarousel } from './AssetCarousel';\nimport { AssetDropZone, type ZoneVariant } from './AssetDropZone';\nimport { AssetRow, UploadRow } from './AssetRow';\nimport { useFieldUploads, type FieldUpload } from './useFieldUploads';\n\nimport type { File } from '../../../../shared/contracts/files';\n\n/**\n * What a field wrote that its form has not rendered yet, per form and field.\n * `getValues()` only catches up on render, and two uploads can complete before\n * the next one. Kept outside the input so it survives a remount.\n */\nconst unrenderedWrites = new WeakMap<object, Map<string, { seen: unknown; written: File[] }>>();\n\nconst toAssets = (value: unknown): File[] =>\n Array.isArray(value) ? value : value ? [value as File] : [];\n\n/**\n * `location` for every event this field fires. The standalone Media Library\n * tags its events `'upload'`; the picker inside an entry form has always been\n * `'content-manager'`, and analytics still splits the two on that axis.\n */\nconst CONTENT_MANAGER_LOCATION = 'content-manager';\n\n/**\n * Uploads from here land at the root of the Media Library. An entry form has no\n * current folder to inherit, and the field offers no destination picker — same\n * place the legacy upload wizard put them when none was chosen.\n */\nconst UPLOAD_FOLDER_ID = null;\n\ntype Step = 'browse';\n\nexport interface MediaLibraryInputProps {\n name: string;\n label?: string;\n labelAction?: ReactNode;\n hint?: string;\n required?: boolean;\n disabled?: boolean;\n attribute?: {\n allowedTypes?: AllowedMediaType[] | null;\n multiple?: boolean;\n };\n /** The field's width in the edit layout, out of 12. Set by the Content Manager. */\n layoutSize?: number;\n}\n\nconst EMPTY_ATTRIBUTE: NonNullable<MediaLibraryInputProps['attribute']> = {};\n\n/**\n * The Content Manager's `media` field, on the current Media Library stack.\n *\n * Files dropped here (or picked from the device) upload straight through\n * `uploadFiles`, which is what drives the global upload progress dialog — so the\n * entry form stays usable while they go, instead of being covered by the legacy\n * wizard.\n *\n * The legacy input is still registered when `useLegacyMediaLibrary` is on, and\n * is untouched by this.\n */\nexport const MediaLibraryInput = ({\n name,\n label,\n labelAction,\n hint,\n required = false,\n disabled = false,\n attribute = EMPTY_ATTRIBUTE,\n layoutSize,\n}: MediaLibraryInputProps) => {\n const { allowedTypes = null, multiple = false } = attribute;\n const { formatMessage } = useIntl();\n const { onChange, value, error } = useField<File | File[] | null>(name);\n const { toggleNotification } = useNotification();\n const { trackUsage } = useTracking();\n const { copy } = useClipboard();\n const getValues = useForm('MediaLibraryInput', (state) => state.getValues);\n\n const [step, setStep] = useState<Step | undefined>(undefined);\n const [editedAsset, setEditedAsset] = useState<File | null>(null);\n const [isUrlDialogOpen, setIsUrlDialogOpen] = useState(false);\n const fileInputRef = useRef<HTMLInputElement>(null);\n\n const [uploadFiles] = useUploadFilesMutation();\n const [uploadFromUrls] = useUploadFromUrlsMutation();\n // Echoes the app config; a missing payload (still loading) falls back to\n // sequential rather than outpacing what the server asked for.\n const { isLoading, canRead, canCreate, canUpdate, canCopyLink, canDownload } =\n useMediaLibraryPermissions();\n // Not while permissions load: `useRBAC` starts with every flag false, and an\n // upload sent before it settles can end in a 403.\n const canUpload = !isLoading && canCreate;\n const { data: settings } = useGetUploadSettingsQuery(undefined, { skip: !canRead });\n const concurrency = settings?.data?.concurrentUploadRequests ?? 1;\n const isAiMetadataEnabled = useAIMetadataEnabled();\n\n const assets: File[] = Array.isArray(value) ? value : value ? [value] : [];\n\n // An upload resumes long after the render that started it, and the dialog is\n // non-blocking precisely so a second batch can be dropped meanwhile. Reading\n // the closed-over `assets` on resume would then append to whatever the field\n // held when that drop began, dropping every asset that landed since.\n const assetsRef = useRef(assets);\n assetsRef.current = assets;\n\n const setAssets = (nextAssets: File[]) => {\n if (multiple) {\n onChange(name, nextAssets.length > 0 ? nextAssets : null);\n return;\n }\n onChange(name, nextAssets[0] ?? null);\n };\n\n const handleRemove = (asset: File) => {\n setAssets(assets.filter((current) => current.id !== asset.id));\n };\n\n // Bound to the form, not to this input: a component collapsed mid-upload\n // unmounts the field, and the file must still land on the entry.\n const attachUploadedFile = (file: File) => {\n const writes = unrenderedWrites.get(getValues) ?? new Map();\n unrenderedWrites.set(getValues, writes);\n\n const value = get(getValues(), name);\n const pending = writes.get(name);\n const current = pending && pending.seen === value ? pending.written : toAssets(value);\n const next = multiple ? [...current, file] : [file];\n\n writes.set(name, { seen: value, written: next });\n setAssets(next);\n };\n\n const { uploads, cancel, retry, dismiss } = useFieldUploads(name);\n\n const handleCopyLink = async (asset: File) => {\n const url = prefixFileUrlWithBackendUrl(asset.url);\n\n if (!url) {\n return;\n }\n\n const didCopy = await copy(url);\n\n toggleNotification({\n type: didCopy ? 'success' : 'danger',\n message: formatMessage(\n didCopy\n ? {\n id: getTranslationKey('asset-details.copy-link.success'),\n defaultMessage: 'Link copied.',\n }\n : {\n id: getTranslationKey('asset-details.copy-link.error'),\n defaultMessage: 'Failed to copy the link.',\n }\n ),\n });\n };\n\n const handleEditClose = (result?: EditableAsset | null | boolean) => {\n const asset = editedAsset;\n setEditedAsset(null);\n\n if (!asset) {\n return;\n }\n\n // `null` means the asset was deleted from the library from inside the dialog.\n if (result === null) {\n setAssets(assetsRef.current.filter((current) => current.id !== asset.id));\n return;\n }\n\n if (result && typeof result !== 'boolean') {\n setAssets(\n assetsRef.current.map((current) => (current.id === asset.id ? (result as File) : current))\n );\n }\n };\n\n const handleSelect = (selectedAssets: File[]) => {\n setAssets(selectedAssets);\n setStep(undefined);\n };\n\n const notifyUnsupported = () => {\n toggleNotification({\n type: 'danger',\n timeout: 4000,\n message: formatMessage(\n {\n // Legacy key: translated everywhere, and it names the accepted types,\n // which the field already passes as `fileTypes`.\n id: getTranslationKey('input.notification.not-supported'),\n defaultMessage: `You can't upload this type of file, only the following types are accepted – {fileTypes}`,\n },\n { fileTypes: (allowedTypes ?? []).join(',') }\n ),\n });\n };\n\n /**\n * True when the batch is more than a single-value field can take. Counted on\n * what was handed in rather than on what survives filtering: uploading one of\n * several would leave the user guessing which one the field kept.\n */\n const rejectsBatch = (count: number) => {\n if (multiple || count <= 1) {\n return false;\n }\n\n toggleNotification({\n type: 'danger',\n timeout: 4000,\n message: formatMessage({\n id: getTranslationKey('content-manager.input.notification.single-file'),\n defaultMessage: 'This field accepts only one file.',\n }),\n });\n\n return true;\n };\n\n const handleUpload = (files: globalThis.File[]) => {\n if (disabled || !canUpload || files.length === 0) {\n return;\n }\n\n // The device picker can't reach this — it carries `multiple` — so a drop is\n // the only way in.\n if (rejectsBatch(files.length)) {\n return;\n }\n\n const allowedFiles = filterAllowedFiles(allowedTypes, files);\n\n if (allowedFiles.length === 0) {\n notifyUnsupported();\n return;\n }\n\n // A mixed drop uploads what it can and says so, rather than silently\n // dropping the rest.\n if (allowedFiles.length < files.length) {\n notifyUnsupported();\n }\n\n const assetsCountByType = allowedFiles.reduce<Record<string, number>>((acc, file) => {\n const type = typeFromMime(file.type);\n acc[type] = (acc[type] ?? 0) + 1;\n return acc;\n }, {});\n trackUsage('didSelectFile', { source: 'computer', location: CONTENT_MANAGER_LOCATION });\n trackUsage('willAddMediaLibraryAssets', {\n location: CONTENT_MANAGER_LOCATION,\n ...assetsCountByType,\n });\n\n startUpload(allowedFiles);\n };\n\n /**\n * Hands the files to the shared upload pool. The field picks the results up\n * from `onFileUploaded`, which also runs for retries of the same rows.\n */\n const startUpload = (allowedFiles: globalThis.File[]) => {\n const formData = new FormData();\n allowedFiles.forEach((file) => formData.append('files', file));\n formData.append(\n 'fileInfo',\n JSON.stringify(\n allowedFiles.map((file) => ({\n name: file.name,\n caption: null,\n alternativeText: null,\n folder: UPLOAD_FOLDER_ID,\n }))\n )\n );\n\n uploadFiles({\n formData,\n totalFiles: allowedFiles.length,\n concurrency,\n generateAiMetadata: Boolean(isAiMetadataEnabled),\n onFileUploaded: attachUploadedFile,\n owner: name,\n });\n };\n\n const handleRetry = (upload: FieldUpload) => retry(upload, (file) => startUpload([file]));\n\n /**\n * The server fetches each URL and uploads what it finds, so the file's type\n * is not known here — `allowedTypes` can only be enforced on what comes back.\n * A URL whose file the field does not accept is uploaded to the library and\n * left off the field, which is also what the Media Library page does with it.\n */\n const handleUrlUpload = async (urls: string[]) => {\n if (disabled || urls.length === 0 || rejectsBatch(urls.length)) {\n return;\n }\n\n trackUsage('didSelectFile', { source: 'url', location: CONTENT_MANAGER_LOCATION });\n trackUsage('willAddMediaLibraryAssets', { location: CONTENT_MANAGER_LOCATION });\n\n try {\n const { data: uploadedFiles } = await uploadFromUrls({\n urls,\n folderId: UPLOAD_FOLDER_ID,\n generateAiMetadata: Boolean(isAiMetadataEnabled),\n }).unwrap();\n\n const allowedFiles = uploadedFiles.filter((file) =>\n isMediaTypeAllowed(allowedTypes, file.mime)\n );\n const notAttachedFiles = uploadedFiles.filter((file) => !allowedFiles.includes(file));\n\n if (notAttachedFiles.length > 0) {\n toggleNotification({\n type: 'warning',\n timeout: 4000,\n message: formatMessage(\n {\n id: getTranslationKey('content-manager.input.notification.not-attached'),\n defaultMessage:\n '{fileNames} {count, plural, one {was} other {were}} added to the Media Library, but this field only accepts {fileTypes}.',\n },\n {\n fileNames: notAttachedFiles.map((file) => file.name).join(', '),\n count: notAttachedFiles.length,\n fileTypes: (allowedTypes ?? []).join(', '),\n }\n ),\n });\n }\n\n if (allowedFiles.length > 0) {\n setAssets(multiple ? [...assetsRef.current, ...allowedFiles] : [allowedFiles[0]]);\n }\n } catch {\n // Errors reach the user through the progress dialog, which the mutation\n // populates itself.\n }\n };\n\n const handleFileInputChange = (event: ChangeEvent<HTMLInputElement>) => {\n // Copied before the reset, not after: `event.target.files` is the input's\n // live FileList, and clearing `value` empties it in place. Reading it\n // afterwards yields nothing and the upload never starts.\n const files = Array.from(event.target.files ?? []);\n // Reset so picking the same file twice in a row still fires `change`.\n event.target.value = '';\n\n if (files.length > 0) {\n handleUpload(files);\n }\n };\n\n const renderValue = () => {\n const dropZone = (variant: ZoneVariant) => (\n <AssetDropZone\n variant={variant}\n disabled={disabled || !canUpload}\n onDropFiles={handleUpload}\n />\n );\n\n if (assets.length === 0 && uploads.length === 0) {\n return dropZone('bar');\n }\n\n const uploadHandlers = {\n disabled,\n onCancel: cancel,\n onRetry: handleRetry,\n onRemove: (upload: FieldUpload) => dismiss(upload.key),\n };\n\n if (!multiple) {\n // A replacement in flight, or one that failed, stands in for the current\n // asset until it lands or is removed.\n if (uploads.length > 0) {\n return (\n <Flex direction=\"column\" alignItems=\"stretch\" gap={2}>\n {uploads.map((upload) => (\n <UploadRow key={upload.key} upload={upload} {...uploadHandlers} />\n ))}\n </Flex>\n );\n }\n\n return (\n <AssetRow\n asset={assets[0]}\n disabled={disabled}\n onCopyLink={handleCopyLink}\n // The details dialog needs the library's folder tree, which needs read access.\n onEdit={canRead ? setEditedAsset : undefined}\n onRemove={handleRemove}\n />\n );\n }\n\n return (\n <AssetCarousel renderDropZone={dropZone} layoutSize={layoutSize}>\n {assets.map((asset) => (\n <AssetCard\n key={asset.id}\n asset={asset}\n disabled={disabled}\n onCopyLink={handleCopyLink}\n onEdit={canRead ? setEditedAsset : undefined}\n onRemove={handleRemove}\n />\n ))}\n {uploads.map((upload) => (\n <UploadCard key={upload.key} upload={upload} {...uploadHandlers} />\n ))}\n </AssetCarousel>\n );\n };\n\n return (\n <Field.Root name={name} error={error} hint={hint} required={required}>\n <Flex justifyContent=\"space-between\" alignItems=\"center\" gap={2}>\n <Field.Label action={labelAction}>{label}</Field.Label>\n <AddAssetMenu\n disabled={disabled}\n onBrowseLibrary={() => setStep('browse')}\n onUploadFromDevice={() => fileInputRef.current?.click()}\n onUploadFromUrl={() => setIsUrlDialogOpen(true)}\n />\n </Flex>\n\n {renderValue()}\n\n <Field.Error />\n <Field.Hint />\n\n <VisuallyHidden>\n <input\n ref={fileInputRef}\n type=\"file\"\n multiple={multiple}\n onChange={handleFileInputChange}\n tabIndex={-1}\n aria-hidden\n />\n </VisuallyHidden>\n\n {step === 'browse' && (\n <AssetPickerDialog\n open\n title={formatMessage(\n {\n id: getTranslationKey('asset-picker.title'),\n defaultMessage: 'Add asset for {fieldName}',\n },\n { fieldName: label ?? name }\n )}\n initialSelection={assets}\n multiple={multiple}\n allowedTypes={allowedTypes}\n onClose={() => setStep(undefined)}\n onConfirm={handleSelect}\n />\n )}\n\n {editedAsset && (\n <EditAssetDialog\n open\n asset={editedAsset as EditableAsset}\n canUpdate={canUpdate && !disabled}\n canCopyLink={canCopyLink}\n canDownload={canDownload}\n trackedLocation={CONTENT_MANAGER_LOCATION}\n onClose={handleEditClose}\n />\n )}\n\n <ImportFromUrlDialog\n open={isUrlDialogOpen}\n onClose={() => setIsUrlDialogOpen(false)}\n onUpload={handleUrlUpload}\n />\n </Field.Root>\n );\n};\n"],"names":["unrenderedWrites","WeakMap","toAssets","value","Array","isArray","CONTENT_MANAGER_LOCATION","UPLOAD_FOLDER_ID","EMPTY_ATTRIBUTE","MediaLibraryInput","name","label","labelAction","hint","required","disabled","attribute","layoutSize","allowedTypes","multiple","formatMessage","useIntl","onChange","error","useField","toggleNotification","useNotification","trackUsage","useTracking","copy","useClipboard","getValues","useForm","state","step","setStep","useState","undefined","editedAsset","setEditedAsset","isUrlDialogOpen","setIsUrlDialogOpen","fileInputRef","useRef","uploadFiles","useUploadFilesMutation","uploadFromUrls","useUploadFromUrlsMutation","isLoading","canRead","canCreate","canUpdate","canCopyLink","canDownload","useMediaLibraryPermissions","canUpload","data","settings","useGetUploadSettingsQuery","skip","concurrency","concurrentUploadRequests","isAiMetadataEnabled","useAIMetadataEnabled","assets","assetsRef","current","setAssets","nextAssets","length","handleRemove","asset","filter","id","attachUploadedFile","file","writes","get","Map","set","pending","seen","written","next","uploads","cancel","retry","dismiss","useFieldUploads","handleCopyLink","url","prefixFileUrlWithBackendUrl","didCopy","type","message","getTranslationKey","defaultMessage","handleEditClose","result","map","handleSelect","selectedAssets","notifyUnsupported","timeout","fileTypes","join","rejectsBatch","count","handleUpload","files","allowedFiles","filterAllowedFiles","assetsCountByType","reduce","acc","typeFromMime","source","location","startUpload","formData","FormData","forEach","append","JSON","stringify","caption","alternativeText","folder","totalFiles","generateAiMetadata","Boolean","onFileUploaded","owner","handleRetry","upload","handleUrlUpload","urls","uploadedFiles","folderId","unwrap","isMediaTypeAllowed","mime","notAttachedFiles","includes","fileNames","handleFileInputChange","event","from","target","renderValue","dropZone","variant","_jsx","AssetDropZone","onDropFiles","uploadHandlers","onCancel","onRetry","onRemove","key","Flex","direction","alignItems","gap","UploadRow","AssetRow","onCopyLink","onEdit","_jsxs","AssetCarousel","renderDropZone","AssetCard","UploadCard","Field","Root","justifyContent","Label","action","AddAssetMenu","onBrowseLibrary","onUploadFromDevice","click","onUploadFromUrl","Error","Hint","VisuallyHidden","input","ref","tabIndex","aria-hidden","AssetPickerDialog","open","title","fieldName","initialSelection","onClose","onConfirm","EditAssetDialog","trackedLocation","ImportFromUrlDialog","onUpload"],"mappings":"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"}
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
4
|
+
var styledComponents = require('styled-components');
|
|
5
|
+
|
|
6
|
+
const slide = styledComponents.keyframes`
|
|
7
|
+
from { transform: translateX(-100%); }
|
|
8
|
+
to { transform: translateX(400%); }
|
|
9
|
+
`;
|
|
10
|
+
const Track = styledComponents.styled.div`
|
|
11
|
+
position: relative;
|
|
12
|
+
width: 100%;
|
|
13
|
+
height: 0.4rem;
|
|
14
|
+
overflow: hidden;
|
|
15
|
+
border-radius: 0.2rem;
|
|
16
|
+
background: ${({ theme })=>theme.colors.primary200};
|
|
17
|
+
`;
|
|
18
|
+
const Fill = styledComponents.styled.div`
|
|
19
|
+
height: 100%;
|
|
20
|
+
border-radius: inherit;
|
|
21
|
+
background: ${({ theme })=>theme.colors.primary600};
|
|
22
|
+
transition: width 0.2s linear;
|
|
23
|
+
width: ${({ $progress })=>$progress === null ? '25%' : `${$progress}%`};
|
|
24
|
+
animation: ${({ $progress })=>$progress === null ? slide : 'none'} 1.2s ease-in-out infinite;
|
|
25
|
+
|
|
26
|
+
@media (prefers-reduced-motion: reduce) {
|
|
27
|
+
animation: none;
|
|
28
|
+
}
|
|
29
|
+
`;
|
|
30
|
+
const UploadProgressBar = ({ progress, label })=>/*#__PURE__*/ jsxRuntime.jsx(Track, {
|
|
31
|
+
role: "progressbar",
|
|
32
|
+
"aria-label": label,
|
|
33
|
+
"aria-valuemin": 0,
|
|
34
|
+
"aria-valuemax": 100,
|
|
35
|
+
"aria-valuenow": progress ?? undefined,
|
|
36
|
+
children: /*#__PURE__*/ jsxRuntime.jsx(Fill, {
|
|
37
|
+
$progress: progress
|
|
38
|
+
})
|
|
39
|
+
});
|
|
40
|
+
|
|
41
|
+
exports.UploadProgressBar = UploadProgressBar;
|
|
42
|
+
//# sourceMappingURL=UploadProgressBar.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"UploadProgressBar.js","sources":["../../../../admin/src/components/MediaLibraryInput/UploadProgressBar.tsx"],"sourcesContent":["import { keyframes, styled } from 'styled-components';\n\nconst slide = keyframes`\n from { transform: translateX(-100%); }\n to { transform: translateX(400%); }\n`;\n\nconst Track = styled.div`\n position: relative;\n width: 100%;\n height: 0.4rem;\n overflow: hidden;\n border-radius: 0.2rem;\n background: ${({ theme }) => theme.colors.primary200};\n`;\n\nconst Fill = styled.div<{ $progress: number | null }>`\n height: 100%;\n border-radius: inherit;\n background: ${({ theme }) => theme.colors.primary600};\n transition: width 0.2s linear;\n width: ${({ $progress }) => ($progress === null ? '25%' : `${$progress}%`)};\n animation: ${({ $progress }) => ($progress === null ? slide : 'none')} 1.2s ease-in-out infinite;\n\n @media (prefers-reduced-motion: reduce) {\n animation: none;\n }\n`;\n\ninterface UploadProgressBarProps {\n /** 0–100, or `null` for an upload whose size is not known. */\n progress: number | null;\n label: string;\n}\n\nexport const UploadProgressBar = ({ progress, label }: UploadProgressBarProps) => (\n <Track\n role=\"progressbar\"\n aria-label={label}\n aria-valuemin={0}\n aria-valuemax={100}\n aria-valuenow={progress ?? undefined}\n >\n <Fill $progress={progress} />\n </Track>\n);\n"],"names":["slide","keyframes","Track","styled","div","theme","colors","primary200","Fill","primary600","$progress","UploadProgressBar","progress","label","_jsx","role","aria-label","aria-valuemin","aria-valuemax","aria-valuenow","undefined"],"mappings":";;;;;AAEA,MAAMA,KAAAA,GAAQC,0BAAS;;;AAGvB,CAAC;AAED,MAAMC,KAAAA,GAAQC,uBAAAA,CAAOC,GAAG;;;;;;cAMV,EAAE,CAAC,EAAEC,KAAK,EAAE,GAAKA,KAAAA,CAAMC,MAAM,CAACC,UAAU,CAAC;AACvD,CAAC;AAED,MAAMC,IAAAA,GAAOL,uBAAAA,CAAOC,GAAiC;;;cAGvC,EAAE,CAAC,EAAEC,KAAK,EAAE,GAAKA,KAAAA,CAAMC,MAAM,CAACG,UAAU,CAAC;;AAE9C,SAAA,EAAE,CAAC,EAAEC,SAAS,EAAE,GAAMA,SAAAA,KAAc,IAAA,GAAO,KAAA,GAAQ,CAAA,EAAGA,SAAAA,CAAU,CAAC,CAAC,CAAE;aAChE,EAAE,CAAC,EAAEA,SAAS,EAAE,GAAMA,SAAAA,KAAc,IAAA,GAAOV,QAAQ,MAAA,CAAQ;;;;;AAKxE,CAAC;AAQM,MAAMW,oBAAoB,CAAC,EAAEC,QAAQ,EAAEC,KAAK,EAA0B,iBAC3EC,cAAA,CAACZ,KAAAA,EAAAA;QACCa,IAAAA,EAAK,aAAA;QACLC,YAAAA,EAAYH,KAAAA;QACZI,eAAAA,EAAe,CAAA;QACfC,eAAAA,EAAe,GAAA;AACfC,QAAAA,eAAAA,EAAeP,QAAAA,IAAYQ,SAAAA;AAE3B,QAAA,QAAA,gBAAAN,cAAA,CAACN,IAAAA,EAAAA;YAAKE,SAAAA,EAAWE;;AAEnB,KAAA;;;;"}
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
import { jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { keyframes, styled } from 'styled-components';
|
|
3
|
+
|
|
4
|
+
const slide = keyframes`
|
|
5
|
+
from { transform: translateX(-100%); }
|
|
6
|
+
to { transform: translateX(400%); }
|
|
7
|
+
`;
|
|
8
|
+
const Track = styled.div`
|
|
9
|
+
position: relative;
|
|
10
|
+
width: 100%;
|
|
11
|
+
height: 0.4rem;
|
|
12
|
+
overflow: hidden;
|
|
13
|
+
border-radius: 0.2rem;
|
|
14
|
+
background: ${({ theme })=>theme.colors.primary200};
|
|
15
|
+
`;
|
|
16
|
+
const Fill = styled.div`
|
|
17
|
+
height: 100%;
|
|
18
|
+
border-radius: inherit;
|
|
19
|
+
background: ${({ theme })=>theme.colors.primary600};
|
|
20
|
+
transition: width 0.2s linear;
|
|
21
|
+
width: ${({ $progress })=>$progress === null ? '25%' : `${$progress}%`};
|
|
22
|
+
animation: ${({ $progress })=>$progress === null ? slide : 'none'} 1.2s ease-in-out infinite;
|
|
23
|
+
|
|
24
|
+
@media (prefers-reduced-motion: reduce) {
|
|
25
|
+
animation: none;
|
|
26
|
+
}
|
|
27
|
+
`;
|
|
28
|
+
const UploadProgressBar = ({ progress, label })=>/*#__PURE__*/ jsx(Track, {
|
|
29
|
+
role: "progressbar",
|
|
30
|
+
"aria-label": label,
|
|
31
|
+
"aria-valuemin": 0,
|
|
32
|
+
"aria-valuemax": 100,
|
|
33
|
+
"aria-valuenow": progress ?? undefined,
|
|
34
|
+
children: /*#__PURE__*/ jsx(Fill, {
|
|
35
|
+
$progress: progress
|
|
36
|
+
})
|
|
37
|
+
});
|
|
38
|
+
|
|
39
|
+
export { UploadProgressBar };
|
|
40
|
+
//# sourceMappingURL=UploadProgressBar.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"UploadProgressBar.mjs","sources":["../../../../admin/src/components/MediaLibraryInput/UploadProgressBar.tsx"],"sourcesContent":["import { keyframes, styled } from 'styled-components';\n\nconst slide = keyframes`\n from { transform: translateX(-100%); }\n to { transform: translateX(400%); }\n`;\n\nconst Track = styled.div`\n position: relative;\n width: 100%;\n height: 0.4rem;\n overflow: hidden;\n border-radius: 0.2rem;\n background: ${({ theme }) => theme.colors.primary200};\n`;\n\nconst Fill = styled.div<{ $progress: number | null }>`\n height: 100%;\n border-radius: inherit;\n background: ${({ theme }) => theme.colors.primary600};\n transition: width 0.2s linear;\n width: ${({ $progress }) => ($progress === null ? '25%' : `${$progress}%`)};\n animation: ${({ $progress }) => ($progress === null ? slide : 'none')} 1.2s ease-in-out infinite;\n\n @media (prefers-reduced-motion: reduce) {\n animation: none;\n }\n`;\n\ninterface UploadProgressBarProps {\n /** 0–100, or `null` for an upload whose size is not known. */\n progress: number | null;\n label: string;\n}\n\nexport const UploadProgressBar = ({ progress, label }: UploadProgressBarProps) => (\n <Track\n role=\"progressbar\"\n aria-label={label}\n aria-valuemin={0}\n aria-valuemax={100}\n aria-valuenow={progress ?? undefined}\n >\n <Fill $progress={progress} />\n </Track>\n);\n"],"names":["slide","keyframes","Track","styled","div","theme","colors","primary200","Fill","primary600","$progress","UploadProgressBar","progress","label","_jsx","role","aria-label","aria-valuemin","aria-valuemax","aria-valuenow","undefined"],"mappings":";;;AAEA,MAAMA,KAAAA,GAAQC,SAAS;;;AAGvB,CAAC;AAED,MAAMC,KAAAA,GAAQC,MAAAA,CAAOC,GAAG;;;;;;cAMV,EAAE,CAAC,EAAEC,KAAK,EAAE,GAAKA,KAAAA,CAAMC,MAAM,CAACC,UAAU,CAAC;AACvD,CAAC;AAED,MAAMC,IAAAA,GAAOL,MAAAA,CAAOC,GAAiC;;;cAGvC,EAAE,CAAC,EAAEC,KAAK,EAAE,GAAKA,KAAAA,CAAMC,MAAM,CAACG,UAAU,CAAC;;AAE9C,SAAA,EAAE,CAAC,EAAEC,SAAS,EAAE,GAAMA,SAAAA,KAAc,IAAA,GAAO,KAAA,GAAQ,CAAA,EAAGA,SAAAA,CAAU,CAAC,CAAC,CAAE;aAChE,EAAE,CAAC,EAAEA,SAAS,EAAE,GAAMA,SAAAA,KAAc,IAAA,GAAOV,QAAQ,MAAA,CAAQ;;;;;AAKxE,CAAC;AAQM,MAAMW,oBAAoB,CAAC,EAAEC,QAAQ,EAAEC,KAAK,EAA0B,iBAC3EC,GAAA,CAACZ,KAAAA,EAAAA;QACCa,IAAAA,EAAK,aAAA;QACLC,YAAAA,EAAYH,KAAAA;QACZI,eAAAA,EAAe,CAAA;QACfC,eAAAA,EAAe,GAAA;AACfC,QAAAA,eAAAA,EAAeP,QAAAA,IAAYQ,SAAAA;AAE3B,QAAA,QAAA,gBAAAN,GAAA,CAACN,IAAAA,EAAAA;YAAKE,SAAAA,EAAWE;;AAEnB,KAAA;;;;"}
|