@strapi/upload 5.50.1 → 5.51.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/ai/components/AIAssetCard.js +7 -1
- package/dist/admin/ai/components/AIAssetCard.js.map +1 -1
- package/dist/admin/ai/components/AIAssetCard.mjs +7 -1
- package/dist/admin/ai/components/AIAssetCard.mjs.map +1 -1
- package/dist/admin/components/AssetCard/AssetCard.js +6 -0
- package/dist/admin/components/AssetCard/AssetCard.js.map +1 -1
- package/dist/admin/components/AssetCard/AssetCard.mjs +6 -0
- package/dist/admin/components/AssetCard/AssetCard.mjs.map +1 -1
- package/dist/admin/components/AssetCard/ImageAssetCard.js +3 -2
- package/dist/admin/components/AssetCard/ImageAssetCard.js.map +1 -1
- package/dist/admin/components/AssetCard/ImageAssetCard.mjs +3 -2
- package/dist/admin/components/AssetCard/ImageAssetCard.mjs.map +1 -1
- package/dist/admin/components/EditAssetDialog/EditAssetContent.js +2 -2
- package/dist/admin/components/EditAssetDialog/EditAssetContent.js.map +1 -1
- package/dist/admin/components/EditAssetDialog/EditAssetContent.mjs +2 -2
- package/dist/admin/components/EditAssetDialog/EditAssetContent.mjs.map +1 -1
- package/dist/admin/components/MediaLibraryInput/Carousel/CarouselAsset.js +8 -0
- package/dist/admin/components/MediaLibraryInput/Carousel/CarouselAsset.js.map +1 -1
- package/dist/admin/components/MediaLibraryInput/Carousel/CarouselAsset.mjs +8 -0
- package/dist/admin/components/MediaLibraryInput/Carousel/CarouselAsset.mjs.map +1 -1
- package/dist/admin/components/TableList/PreviewCell.js +5 -1
- package/dist/admin/components/TableList/PreviewCell.js.map +1 -1
- package/dist/admin/components/TableList/PreviewCell.mjs +5 -1
- package/dist/admin/components/TableList/PreviewCell.mjs.map +1 -1
- package/dist/admin/future/pages/Assets/AssetsPage.js +6 -11
- package/dist/admin/future/pages/Assets/AssetsPage.js.map +1 -1
- package/dist/admin/future/pages/Assets/AssetsPage.mjs +6 -11
- package/dist/admin/future/pages/Assets/AssetsPage.mjs.map +1 -1
- package/dist/admin/future/pages/Assets/components/AssetDetails/AssetPreview.js +6 -3
- package/dist/admin/future/pages/Assets/components/AssetDetails/AssetPreview.js.map +1 -1
- package/dist/admin/future/pages/Assets/components/AssetDetails/AssetPreview.mjs +6 -3
- package/dist/admin/future/pages/Assets/components/AssetDetails/AssetPreview.mjs.map +1 -1
- package/dist/admin/future/pages/Assets/components/AssetsGrid.js +8 -12
- package/dist/admin/future/pages/Assets/components/AssetsGrid.js.map +1 -1
- package/dist/admin/future/pages/Assets/components/AssetsGrid.mjs +10 -14
- package/dist/admin/future/pages/Assets/components/AssetsGrid.mjs.map +1 -1
- package/dist/admin/future/pages/Assets/components/AssetsTable.js +15 -27
- package/dist/admin/future/pages/Assets/components/AssetsTable.js.map +1 -1
- package/dist/admin/future/pages/Assets/components/AssetsTable.mjs +16 -28
- package/dist/admin/future/pages/Assets/components/AssetsTable.mjs.map +1 -1
- package/dist/admin/future/pages/Assets/components/EmptyState.js +63 -0
- package/dist/admin/future/pages/Assets/components/EmptyState.js.map +1 -0
- package/dist/admin/future/pages/Assets/components/EmptyState.mjs +61 -0
- package/dist/admin/future/pages/Assets/components/EmptyState.mjs.map +1 -0
- package/dist/admin/future/services/uploadFileViaXHR.js +23 -2
- package/dist/admin/future/services/uploadFileViaXHR.js.map +1 -1
- package/dist/admin/future/services/uploadFileViaXHR.mjs +23 -2
- package/dist/admin/future/services/uploadFileViaXHR.mjs.map +1 -1
- package/dist/admin/hooks/useUpload.js +15 -9
- package/dist/admin/hooks/useUpload.js.map +1 -1
- package/dist/admin/hooks/useUpload.mjs +17 -11
- package/dist/admin/hooks/useUpload.mjs.map +1 -1
- package/dist/admin/src/components/AssetCard/ImageAssetCard.d.ts +2 -1
- package/dist/admin/src/future/pages/Assets/components/AssetsGrid.d.ts +1 -1
- package/dist/admin/src/future/pages/Assets/components/AssetsTable.d.ts +1 -1
- package/dist/admin/src/future/pages/Assets/components/EmptyState.d.ts +11 -0
- package/dist/admin/src/future/services/uploadFileViaXHR.d.ts +1 -17
- package/dist/admin/src/hooks/useAiAvailability.d.ts +1 -1
- package/dist/admin/src/hooks/useEditAsset.d.ts +4 -4
- package/dist/admin/src/hooks/useEditFolder.d.ts +4 -4
- package/dist/admin/src/hooks/useUpload.d.ts +1 -1
- package/dist/admin/translations/en.json.js +3 -0
- package/dist/admin/translations/en.json.js.map +1 -1
- package/dist/admin/translations/en.json.mjs +3 -0
- package/dist/admin/translations/en.json.mjs.map +1 -1
- package/dist/admin/translations/ko.json.js +183 -1
- package/dist/admin/translations/ko.json.js.map +1 -1
- package/dist/admin/translations/ko.json.mjs +183 -1
- package/dist/admin/translations/ko.json.mjs.map +1 -1
- package/dist/server/src/controllers/index.d.ts +1 -1
- package/dist/server/src/index.d.ts +11 -11
- package/dist/server/src/routes/index.d.ts +1 -1
- package/dist/server/src/services/image-manipulation.d.ts +3 -3
- package/dist/server/src/services/index.d.ts +9 -9
- package/package.json +17 -13
|
@@ -162,7 +162,7 @@ const IconPreview = styledComponents.styled(designSystem.Flex)`
|
|
|
162
162
|
background: ${({ theme })=>theme.colors.neutral100};
|
|
163
163
|
`;
|
|
164
164
|
const AssetPreview = ({ asset })=>{
|
|
165
|
-
const { alternativeText, ext, formats, mime, url } = asset;
|
|
165
|
+
const { alternativeText, ext, formats, mime, url, isLocal, isUrlSigned } = asset;
|
|
166
166
|
if (mime?.includes(enums.ASSET_TYPES.Image)) {
|
|
167
167
|
const mediaURL = files.prefixFileUrlWithBackendUrl(formats?.thumbnail?.url) ?? files.prefixFileUrlWithBackendUrl(url);
|
|
168
168
|
if (mediaURL) {
|
|
@@ -170,6 +170,10 @@ const AssetPreview = ({ asset })=>{
|
|
|
170
170
|
children: /*#__PURE__*/ jsxRuntime.jsx(StyledImage, {
|
|
171
171
|
src: mediaURL,
|
|
172
172
|
alt: alternativeText || '',
|
|
173
|
+
// Only signed remote URLs need crossOrigin (cache collision with
|
|
174
|
+
// the preview). Public/unsigned remote thumbnails must render
|
|
175
|
+
// without a bucket CORS rule. See #26581.
|
|
176
|
+
crossOrigin: !isLocal && isUrlSigned ? 'anonymous' : undefined,
|
|
173
177
|
draggable: false,
|
|
174
178
|
onDragStart: (e)=>e.preventDefault()
|
|
175
179
|
})
|
|
@@ -267,19 +271,11 @@ const AssetCard = ({ asset, onAssetItemClick })=>{
|
|
|
267
271
|
});
|
|
268
272
|
};
|
|
269
273
|
const AssetsGrid = ({ assets, folders = [], onAssetItemClick })=>{
|
|
270
|
-
const { formatMessage } = reactIntl.useIntl();
|
|
271
274
|
const totalItems = folders.length + assets.length;
|
|
275
|
+
// The empty state is owned by the page (`AssetsView` renders `EmptyState`) — an
|
|
276
|
+
// empty grid renders nothing at all.
|
|
272
277
|
if (totalItems === 0) {
|
|
273
|
-
return
|
|
274
|
-
padding: 8,
|
|
275
|
-
children: /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
|
|
276
|
-
textColor: "neutral600",
|
|
277
|
-
children: formatMessage({
|
|
278
|
-
id: 'app.components.EmptyStateLayout.content-document',
|
|
279
|
-
defaultMessage: 'No content found'
|
|
280
|
-
})
|
|
281
|
-
})
|
|
282
|
-
});
|
|
278
|
+
return null;
|
|
283
279
|
}
|
|
284
280
|
return /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Grid.Root, {
|
|
285
281
|
gap: 4,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AssetsGrid.js","sources":["../../../../../../admin/src/future/pages/Assets/components/AssetsGrid.tsx"],"sourcesContent":["import {\n Box,\n Card,\n CardBody,\n CardHeader,\n Flex,\n Grid,\n IconButton,\n Typography,\n} from '@strapi/design-system';\nimport { Folder as FolderIcon, More } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { styled, css } from 'styled-components';\n\nimport { ASSET_TYPES } from '../../../../enums';\nimport { prefixFileUrlWithBackendUrl } from '../../../utils/files';\nimport { getAssetIcon } from '../../../utils/getAssetIcon';\nimport { getTranslationKey } from '../../../utils/translations';\nimport { useFolderNavigation } from '../hooks/useFolderNavigation';\n\nimport { useAssetsDndOptional } from './Dnd/AssetsDndProvider';\nimport { useFileDraggable, useFolderDraggableDroppable } from './Dnd/useAssetDnd';\n\nimport type { File } from '../../../../../../shared/contracts/files';\nimport type { Folder } from '../../../../../../shared/contracts/folders';\n\n/* -------------------------------------------------------------------------------------------------\n * AssetsGrid\n * -----------------------------------------------------------------------------------------------*/\n\nconst StyledCard = styled(Card)<{ $isDragging?: boolean; $isMovePending?: boolean }>`\n border: 1px solid ${({ theme }) => theme.colors.neutral200};\n border-radius: 8px;\n overflow: hidden;\n cursor: ${({ $isMovePending }) => ($isMovePending ? 'wait' : 'pointer')};\n opacity: ${({ $isDragging }) => ($isDragging ? 0.4 : 1)};\n pointer-events: ${({ $isMovePending }) => ($isMovePending ? 'none' : 'auto')};\n\n &:hover {\n background: ${({ theme }) => theme.colors.primary100};\n }\n\n &:focus-visible {\n outline: 2px solid ${({ theme }) => theme.colors.primary600};\n outline-offset: 2px;\n }\n`;\n\n/* -------------------------------------------------------------------------------------------------\n * FolderCard\n * -----------------------------------------------------------------------------------------------*/\n\nconst FoldersRow = styled(Box)`\n grid-column: 1 / -1;\n`;\n\nconst StyledFolderCard = styled(Flex)<{\n $isDragging?: boolean;\n $isMovePending?: boolean;\n $isValidDropTarget?: boolean;\n $isInvalidDropTarget?: boolean;\n}>`\n width: 100%;\n padding: ${({ theme }) => `${theme.spaces[2]} ${theme.spaces[3]}`}; // 8px 12px\n align-items: center;\n gap: ${({ theme }) => theme.spaces[2]}; // 8px\n border: 1px solid ${({ theme }) => theme.colors.neutral200};\n border-radius: ${({ theme }) => theme.borderRadius};\n background: ${({ theme }) => theme.colors.neutral0};\n cursor: ${({ $isMovePending, $isInvalidDropTarget }) => {\n if ($isMovePending) {\n return 'wait';\n }\n\n return $isInvalidDropTarget ? 'not-allowed' : 'pointer';\n }};\n opacity: ${({ $isDragging }) => ($isDragging ? 0.4 : 1)};\n pointer-events: ${({ $isMovePending }) => ($isMovePending ? 'none' : 'auto')};\n transition: background 0.2s;\n\n ${({ $isValidDropTarget, theme }) =>\n $isValidDropTarget &&\n css`\n background: ${theme.colors.primary100};\n border: 1px dashed ${theme.colors.primary600};\n `}\n\n &:hover {\n background: ${({ theme }) => theme.colors.primary100};\n }\n\n &:focus-visible {\n outline: 2px solid ${({ theme }) => theme.colors.primary600};\n outline-offset: 2px;\n }\n`;\n\nconst FolderIconContainer = styled(Flex)`\n flex-shrink: 0;\n color: ${({ theme }) => theme.colors.neutral600};\n`;\n\nconst FolderName = styled(Typography)`\n flex: 1;\n min-width: 0;\n`;\n\ninterface FolderCardProps {\n folder: Folder;\n}\n\nconst FolderCard = ({ folder }: FolderCardProps) => {\n const { formatMessage } = useIntl();\n const { navigateToFolder } = useFolderNavigation();\n const { isMovePending } = useAssetsDndOptional() ?? { isMovePending: false };\n const {\n draggable: { attributes, listeners, setNodeRef: setDragRef, isDragging },\n droppable: { setNodeRef: setDropRef },\n showValidDropHighlight,\n showInvalidDropCursor,\n } = useFolderDraggableDroppable(folder);\n\n const setNodeRef = (node: HTMLElement | null) => {\n setDragRef(node);\n setDropRef(node);\n };\n\n const handleKeyDown = (e: React.KeyboardEvent) => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n navigateToFolder(folder);\n }\n };\n\n return (\n <StyledFolderCard\n ref={setNodeRef}\n {...attributes}\n {...listeners}\n $isDragging={isDragging}\n $isMovePending={isMovePending}\n $isValidDropTarget={showValidDropHighlight}\n $isInvalidDropTarget={showInvalidDropCursor}\n onClick={() => navigateToFolder(folder)}\n onKeyDown={handleKeyDown}\n role=\"listitem\"\n tabIndex={0}\n >\n <FolderIconContainer>\n <FolderIcon width={20} height={20} />\n </FolderIconContainer>\n <FolderName textColor=\"neutral800\" ellipsis>\n {folder.name}\n </FolderName>\n <IconButton\n label={formatMessage({\n id: getTranslationKey('control-card.more-actions'),\n defaultMessage: 'More actions',\n })}\n variant=\"ghost\"\n onClick={(e: React.MouseEvent) => e.stopPropagation()}\n >\n <More />\n </IconButton>\n </StyledFolderCard>\n );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * AssetPreview\n * -----------------------------------------------------------------------------------------------*/\n\nconst PreviewContainer = styled(Box)`\n position: relative;\n width: 100%;\n padding-bottom: 62.5%;\n height: 0;\n overflow: hidden;\n background: repeating-conic-gradient(\n ${({ theme }) => theme.colors.neutral100} 0% 25%,\n transparent 0% 50%\n )\n 50% / 20px 20px;\n`;\n\nconst StyledImage = styled.img`\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n object-fit: cover;\n`;\n\nconst IconPreview = styled(Flex)`\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n color: ${({ theme }) => theme.colors.neutral500};\n background: ${({ theme }) => theme.colors.neutral100};\n`;\n\ninterface AssetPreviewProps {\n asset: File;\n}\n\nconst AssetPreview = ({ asset }: AssetPreviewProps) => {\n const { alternativeText, ext, formats, mime, url } = asset;\n\n if (mime?.includes(ASSET_TYPES.Image)) {\n const mediaURL =\n prefixFileUrlWithBackendUrl(formats?.thumbnail?.url) ?? prefixFileUrlWithBackendUrl(url);\n\n if (mediaURL) {\n return (\n <PreviewContainer>\n <StyledImage\n src={mediaURL}\n alt={alternativeText || ''}\n draggable={false}\n onDragStart={(e) => e.preventDefault()}\n />\n </PreviewContainer>\n );\n }\n }\n\n const DocIcon = getAssetIcon(mime, ext);\n\n return (\n <PreviewContainer>\n <IconPreview justifyContent=\"center\" alignItems=\"center\">\n <DocIcon width={48} height={48} />\n </IconPreview>\n </PreviewContainer>\n );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * AssetCard\n * -----------------------------------------------------------------------------------------------*/\n\nconst StyledCardHeader = styled(CardHeader)`\n border-bottom: 1px solid ${({ theme }) => theme.colors.neutral200};\n`;\n\nconst CardFooter = styled(Flex)`\n min-width: 0;\n width: 100%;\n`;\n\nconst FileTypeIcon = styled(Flex)`\n color: ${({ theme }) => theme.colors.neutral600};\n flex-shrink: 0;\n`;\n\nconst FileName = styled(Typography)`\n flex: 1;\n min-width: 0;\n`;\n\ninterface AssetCardProps {\n asset: File;\n onAssetItemClick: (assetId: number) => void;\n}\n\nconst AssetCard = ({ asset, onAssetItemClick }: AssetCardProps) => {\n const { formatMessage } = useIntl();\n const TypeIcon = getAssetIcon(asset.mime, asset.ext);\n const { isMovePending } = useAssetsDndOptional() ?? { isMovePending: false };\n const { attributes, listeners, setNodeRef, isDragging } = useFileDraggable(asset);\n\n const handleKeyDown = (e: React.KeyboardEvent) => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n onAssetItemClick(asset.id);\n }\n };\n\n return (\n <StyledCard\n ref={setNodeRef}\n {...attributes}\n {...listeners}\n $isDragging={isDragging}\n $isMovePending={isMovePending}\n tabIndex={0}\n role=\"listitem\"\n onDragStart={(e) => e.preventDefault()}\n onClick={() => onAssetItemClick(asset.id)}\n onKeyDown={handleKeyDown}\n >\n <StyledCardHeader>\n <AssetPreview asset={asset} />\n </StyledCardHeader>\n <CardBody>\n <CardFooter alignItems=\"center\" gap={2}>\n <FileTypeIcon>\n <TypeIcon width={20} height={20} />\n </FileTypeIcon>\n <FileName textColor=\"primary800\" ellipsis>\n {asset.name}\n </FileName>\n <IconButton\n label={formatMessage({\n id: getTranslationKey('control-card.more-actions'),\n defaultMessage: 'More actions',\n })}\n variant=\"ghost\"\n onClick={(e: React.MouseEvent) => e.stopPropagation()}\n >\n <More />\n </IconButton>\n </CardFooter>\n </CardBody>\n </StyledCard>\n );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * AssetsGrid\n * -----------------------------------------------------------------------------------------------*/\n\ninterface AssetsGridProps {\n assets: File[];\n folders?: Folder[];\n onAssetItemClick: (assetId: number) => void;\n}\n\nexport const AssetsGrid = ({ assets, folders = [], onAssetItemClick }: AssetsGridProps) => {\n const { formatMessage } = useIntl();\n\n const totalItems = folders.length + assets.length;\n\n if (totalItems === 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\n return (\n <Grid.Root gap={4} role=\"list\" data-testid=\"assets-grid\">\n {folders.length > 0 && (\n <FoldersRow>\n <Grid.Root gap={4}>\n {folders.map((folder) => (\n <Grid.Item col={3} m={4} s={6} xs={12} key={`folder-${folder.id}`}>\n <FolderCard folder={folder} />\n </Grid.Item>\n ))}\n </Grid.Root>\n </FoldersRow>\n )}\n {assets.map((asset) => (\n <Grid.Item\n col={3}\n m={4}\n s={6}\n xs={12}\n key={asset.id}\n direction=\"column\"\n alignItems=\"stretch\"\n >\n <AssetCard asset={asset} onAssetItemClick={onAssetItemClick} />\n </Grid.Item>\n ))}\n </Grid.Root>\n );\n};\n"],"names":["StyledCard","styled","Card","theme","colors","neutral200","$isMovePending","$isDragging","primary100","primary600","FoldersRow","Box","StyledFolderCard","Flex","spaces","borderRadius","neutral0","$isInvalidDropTarget","$isValidDropTarget","css","FolderIconContainer","neutral600","FolderName","Typography","FolderCard","folder","formatMessage","useIntl","navigateToFolder","useFolderNavigation","isMovePending","useAssetsDndOptional","draggable","attributes","listeners","setNodeRef","setDragRef","isDragging","droppable","setDropRef","showValidDropHighlight","showInvalidDropCursor","useFolderDraggableDroppable","node","handleKeyDown","e","key","preventDefault","_jsxs","ref","onClick","onKeyDown","role","tabIndex","_jsx","FolderIcon","width","height","textColor","ellipsis","name","IconButton","label","id","getTranslationKey","defaultMessage","variant","stopPropagation","More","PreviewContainer","neutral100","StyledImage","img","IconPreview","neutral500","AssetPreview","asset","alternativeText","ext","formats","mime","url","includes","ASSET_TYPES","Image","mediaURL","prefixFileUrlWithBackendUrl","thumbnail","src","alt","onDragStart","DocIcon","getAssetIcon","justifyContent","alignItems","StyledCardHeader","CardHeader","CardFooter","FileTypeIcon","FileName","AssetCard","onAssetItemClick","TypeIcon","useFileDraggable","CardBody","gap","AssetsGrid","assets","folders","totalItems","length","padding","Grid","Root","data-testid","map","Item","col","m","s","xs","direction"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"AssetsGrid.js","sources":["../../../../../../admin/src/future/pages/Assets/components/AssetsGrid.tsx"],"sourcesContent":["import {\n Box,\n Card,\n CardBody,\n CardHeader,\n Flex,\n Grid,\n IconButton,\n Typography,\n} from '@strapi/design-system';\nimport { Folder as FolderIcon, More } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { styled, css } from 'styled-components';\n\nimport { ASSET_TYPES } from '../../../../enums';\nimport { prefixFileUrlWithBackendUrl } from '../../../utils/files';\nimport { getAssetIcon } from '../../../utils/getAssetIcon';\nimport { getTranslationKey } from '../../../utils/translations';\nimport { useFolderNavigation } from '../hooks/useFolderNavigation';\n\nimport { useAssetsDndOptional } from './Dnd/AssetsDndProvider';\nimport { useFileDraggable, useFolderDraggableDroppable } from './Dnd/useAssetDnd';\n\nimport type { File } from '../../../../../../shared/contracts/files';\nimport type { Folder } from '../../../../../../shared/contracts/folders';\n\n/* -------------------------------------------------------------------------------------------------\n * AssetsGrid\n * -----------------------------------------------------------------------------------------------*/\n\nconst StyledCard = styled(Card)<{ $isDragging?: boolean; $isMovePending?: boolean }>`\n border: 1px solid ${({ theme }) => theme.colors.neutral200};\n border-radius: 8px;\n overflow: hidden;\n cursor: ${({ $isMovePending }) => ($isMovePending ? 'wait' : 'pointer')};\n opacity: ${({ $isDragging }) => ($isDragging ? 0.4 : 1)};\n pointer-events: ${({ $isMovePending }) => ($isMovePending ? 'none' : 'auto')};\n\n &:hover {\n background: ${({ theme }) => theme.colors.primary100};\n }\n\n &:focus-visible {\n outline: 2px solid ${({ theme }) => theme.colors.primary600};\n outline-offset: 2px;\n }\n`;\n\n/* -------------------------------------------------------------------------------------------------\n * FolderCard\n * -----------------------------------------------------------------------------------------------*/\n\nconst FoldersRow = styled(Box)`\n grid-column: 1 / -1;\n`;\n\nconst StyledFolderCard = styled(Flex)<{\n $isDragging?: boolean;\n $isMovePending?: boolean;\n $isValidDropTarget?: boolean;\n $isInvalidDropTarget?: boolean;\n}>`\n width: 100%;\n padding: ${({ theme }) => `${theme.spaces[2]} ${theme.spaces[3]}`}; // 8px 12px\n align-items: center;\n gap: ${({ theme }) => theme.spaces[2]}; // 8px\n border: 1px solid ${({ theme }) => theme.colors.neutral200};\n border-radius: ${({ theme }) => theme.borderRadius};\n background: ${({ theme }) => theme.colors.neutral0};\n cursor: ${({ $isMovePending, $isInvalidDropTarget }) => {\n if ($isMovePending) {\n return 'wait';\n }\n\n return $isInvalidDropTarget ? 'not-allowed' : 'pointer';\n }};\n opacity: ${({ $isDragging }) => ($isDragging ? 0.4 : 1)};\n pointer-events: ${({ $isMovePending }) => ($isMovePending ? 'none' : 'auto')};\n transition: background 0.2s;\n\n ${({ $isValidDropTarget, theme }) =>\n $isValidDropTarget &&\n css`\n background: ${theme.colors.primary100};\n border: 1px dashed ${theme.colors.primary600};\n `}\n\n &:hover {\n background: ${({ theme }) => theme.colors.primary100};\n }\n\n &:focus-visible {\n outline: 2px solid ${({ theme }) => theme.colors.primary600};\n outline-offset: 2px;\n }\n`;\n\nconst FolderIconContainer = styled(Flex)`\n flex-shrink: 0;\n color: ${({ theme }) => theme.colors.neutral600};\n`;\n\nconst FolderName = styled(Typography)`\n flex: 1;\n min-width: 0;\n`;\n\ninterface FolderCardProps {\n folder: Folder;\n}\n\nconst FolderCard = ({ folder }: FolderCardProps) => {\n const { formatMessage } = useIntl();\n const { navigateToFolder } = useFolderNavigation();\n const { isMovePending } = useAssetsDndOptional() ?? { isMovePending: false };\n const {\n draggable: { attributes, listeners, setNodeRef: setDragRef, isDragging },\n droppable: { setNodeRef: setDropRef },\n showValidDropHighlight,\n showInvalidDropCursor,\n } = useFolderDraggableDroppable(folder);\n\n const setNodeRef = (node: HTMLElement | null) => {\n setDragRef(node);\n setDropRef(node);\n };\n\n const handleKeyDown = (e: React.KeyboardEvent) => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n navigateToFolder(folder);\n }\n };\n\n return (\n <StyledFolderCard\n ref={setNodeRef}\n {...attributes}\n {...listeners}\n $isDragging={isDragging}\n $isMovePending={isMovePending}\n $isValidDropTarget={showValidDropHighlight}\n $isInvalidDropTarget={showInvalidDropCursor}\n onClick={() => navigateToFolder(folder)}\n onKeyDown={handleKeyDown}\n role=\"listitem\"\n tabIndex={0}\n >\n <FolderIconContainer>\n <FolderIcon width={20} height={20} />\n </FolderIconContainer>\n <FolderName textColor=\"neutral800\" ellipsis>\n {folder.name}\n </FolderName>\n <IconButton\n label={formatMessage({\n id: getTranslationKey('control-card.more-actions'),\n defaultMessage: 'More actions',\n })}\n variant=\"ghost\"\n onClick={(e: React.MouseEvent) => e.stopPropagation()}\n >\n <More />\n </IconButton>\n </StyledFolderCard>\n );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * AssetPreview\n * -----------------------------------------------------------------------------------------------*/\n\nconst PreviewContainer = styled(Box)`\n position: relative;\n width: 100%;\n padding-bottom: 62.5%;\n height: 0;\n overflow: hidden;\n background: repeating-conic-gradient(\n ${({ theme }) => theme.colors.neutral100} 0% 25%,\n transparent 0% 50%\n )\n 50% / 20px 20px;\n`;\n\nconst StyledImage = styled.img`\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n object-fit: cover;\n`;\n\nconst IconPreview = styled(Flex)`\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n color: ${({ theme }) => theme.colors.neutral500};\n background: ${({ theme }) => theme.colors.neutral100};\n`;\n\ninterface AssetPreviewProps {\n asset: File;\n}\n\nconst AssetPreview = ({ asset }: AssetPreviewProps) => {\n const { alternativeText, ext, formats, mime, url, isLocal, isUrlSigned } = asset;\n\n if (mime?.includes(ASSET_TYPES.Image)) {\n const mediaURL =\n prefixFileUrlWithBackendUrl(formats?.thumbnail?.url) ?? prefixFileUrlWithBackendUrl(url);\n\n if (mediaURL) {\n return (\n <PreviewContainer>\n <StyledImage\n src={mediaURL}\n alt={alternativeText || ''}\n // Only signed remote URLs need crossOrigin (cache collision with\n // the preview). Public/unsigned remote thumbnails must render\n // without a bucket CORS rule. See #26581.\n crossOrigin={!isLocal && isUrlSigned ? 'anonymous' : undefined}\n draggable={false}\n onDragStart={(e) => e.preventDefault()}\n />\n </PreviewContainer>\n );\n }\n }\n\n const DocIcon = getAssetIcon(mime, ext);\n\n return (\n <PreviewContainer>\n <IconPreview justifyContent=\"center\" alignItems=\"center\">\n <DocIcon width={48} height={48} />\n </IconPreview>\n </PreviewContainer>\n );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * AssetCard\n * -----------------------------------------------------------------------------------------------*/\n\nconst StyledCardHeader = styled(CardHeader)`\n border-bottom: 1px solid ${({ theme }) => theme.colors.neutral200};\n`;\n\nconst CardFooter = styled(Flex)`\n min-width: 0;\n width: 100%;\n`;\n\nconst FileTypeIcon = styled(Flex)`\n color: ${({ theme }) => theme.colors.neutral600};\n flex-shrink: 0;\n`;\n\nconst FileName = styled(Typography)`\n flex: 1;\n min-width: 0;\n`;\n\ninterface AssetCardProps {\n asset: File;\n onAssetItemClick: (assetId: number) => void;\n}\n\nconst AssetCard = ({ asset, onAssetItemClick }: AssetCardProps) => {\n const { formatMessage } = useIntl();\n const TypeIcon = getAssetIcon(asset.mime, asset.ext);\n const { isMovePending } = useAssetsDndOptional() ?? { isMovePending: false };\n const { attributes, listeners, setNodeRef, isDragging } = useFileDraggable(asset);\n\n const handleKeyDown = (e: React.KeyboardEvent) => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n onAssetItemClick(asset.id);\n }\n };\n\n return (\n <StyledCard\n ref={setNodeRef}\n {...attributes}\n {...listeners}\n $isDragging={isDragging}\n $isMovePending={isMovePending}\n tabIndex={0}\n role=\"listitem\"\n onDragStart={(e) => e.preventDefault()}\n onClick={() => onAssetItemClick(asset.id)}\n onKeyDown={handleKeyDown}\n >\n <StyledCardHeader>\n <AssetPreview asset={asset} />\n </StyledCardHeader>\n <CardBody>\n <CardFooter alignItems=\"center\" gap={2}>\n <FileTypeIcon>\n <TypeIcon width={20} height={20} />\n </FileTypeIcon>\n <FileName textColor=\"primary800\" ellipsis>\n {asset.name}\n </FileName>\n <IconButton\n label={formatMessage({\n id: getTranslationKey('control-card.more-actions'),\n defaultMessage: 'More actions',\n })}\n variant=\"ghost\"\n onClick={(e: React.MouseEvent) => e.stopPropagation()}\n >\n <More />\n </IconButton>\n </CardFooter>\n </CardBody>\n </StyledCard>\n );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * AssetsGrid\n * -----------------------------------------------------------------------------------------------*/\n\ninterface AssetsGridProps {\n assets: File[];\n folders?: Folder[];\n onAssetItemClick: (assetId: number) => void;\n}\n\nexport const AssetsGrid = ({ assets, folders = [], onAssetItemClick }: AssetsGridProps) => {\n const totalItems = folders.length + assets.length;\n\n // The empty state is owned by the page (`AssetsView` renders `EmptyState`) — an\n // empty grid renders nothing at all.\n if (totalItems === 0) {\n return null;\n }\n\n return (\n <Grid.Root gap={4} role=\"list\" data-testid=\"assets-grid\">\n {folders.length > 0 && (\n <FoldersRow>\n <Grid.Root gap={4}>\n {folders.map((folder) => (\n <Grid.Item col={3} m={4} s={6} xs={12} key={`folder-${folder.id}`}>\n <FolderCard folder={folder} />\n </Grid.Item>\n ))}\n </Grid.Root>\n </FoldersRow>\n )}\n {assets.map((asset) => (\n <Grid.Item\n col={3}\n m={4}\n s={6}\n xs={12}\n key={asset.id}\n direction=\"column\"\n alignItems=\"stretch\"\n >\n <AssetCard asset={asset} onAssetItemClick={onAssetItemClick} />\n </Grid.Item>\n ))}\n </Grid.Root>\n );\n};\n"],"names":["StyledCard","styled","Card","theme","colors","neutral200","$isMovePending","$isDragging","primary100","primary600","FoldersRow","Box","StyledFolderCard","Flex","spaces","borderRadius","neutral0","$isInvalidDropTarget","$isValidDropTarget","css","FolderIconContainer","neutral600","FolderName","Typography","FolderCard","folder","formatMessage","useIntl","navigateToFolder","useFolderNavigation","isMovePending","useAssetsDndOptional","draggable","attributes","listeners","setNodeRef","setDragRef","isDragging","droppable","setDropRef","showValidDropHighlight","showInvalidDropCursor","useFolderDraggableDroppable","node","handleKeyDown","e","key","preventDefault","_jsxs","ref","onClick","onKeyDown","role","tabIndex","_jsx","FolderIcon","width","height","textColor","ellipsis","name","IconButton","label","id","getTranslationKey","defaultMessage","variant","stopPropagation","More","PreviewContainer","neutral100","StyledImage","img","IconPreview","neutral500","AssetPreview","asset","alternativeText","ext","formats","mime","url","isLocal","isUrlSigned","includes","ASSET_TYPES","Image","mediaURL","prefixFileUrlWithBackendUrl","thumbnail","src","alt","crossOrigin","undefined","onDragStart","DocIcon","getAssetIcon","justifyContent","alignItems","StyledCardHeader","CardHeader","CardFooter","FileTypeIcon","FileName","AssetCard","onAssetItemClick","TypeIcon","useFileDraggable","CardBody","gap","AssetsGrid","assets","folders","totalItems","length","Grid","Root","data-testid","map","Item","col","m","s","xs","direction"],"mappings":"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"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
1
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { Grid, Box, IconButton, CardBody, Flex, Typography, Card, CardHeader } from '@strapi/design-system';
|
|
3
3
|
import { Folder, More } from '@strapi/icons';
|
|
4
4
|
import { useIntl } from 'react-intl';
|
|
5
5
|
import { styled, css } from 'styled-components';
|
|
@@ -160,7 +160,7 @@ const IconPreview = styled(Flex)`
|
|
|
160
160
|
background: ${({ theme })=>theme.colors.neutral100};
|
|
161
161
|
`;
|
|
162
162
|
const AssetPreview = ({ asset })=>{
|
|
163
|
-
const { alternativeText, ext, formats, mime, url } = asset;
|
|
163
|
+
const { alternativeText, ext, formats, mime, url, isLocal, isUrlSigned } = asset;
|
|
164
164
|
if (mime?.includes(ASSET_TYPES.Image)) {
|
|
165
165
|
const mediaURL = prefixFileUrlWithBackendUrl(formats?.thumbnail?.url) ?? prefixFileUrlWithBackendUrl(url);
|
|
166
166
|
if (mediaURL) {
|
|
@@ -168,6 +168,10 @@ const AssetPreview = ({ asset })=>{
|
|
|
168
168
|
children: /*#__PURE__*/ jsx(StyledImage, {
|
|
169
169
|
src: mediaURL,
|
|
170
170
|
alt: alternativeText || '',
|
|
171
|
+
// Only signed remote URLs need crossOrigin (cache collision with
|
|
172
|
+
// the preview). Public/unsigned remote thumbnails must render
|
|
173
|
+
// without a bucket CORS rule. See #26581.
|
|
174
|
+
crossOrigin: !isLocal && isUrlSigned ? 'anonymous' : undefined,
|
|
171
175
|
draggable: false,
|
|
172
176
|
onDragStart: (e)=>e.preventDefault()
|
|
173
177
|
})
|
|
@@ -265,19 +269,11 @@ const AssetCard = ({ asset, onAssetItemClick })=>{
|
|
|
265
269
|
});
|
|
266
270
|
};
|
|
267
271
|
const AssetsGrid = ({ assets, folders = [], onAssetItemClick })=>{
|
|
268
|
-
const { formatMessage } = useIntl();
|
|
269
272
|
const totalItems = folders.length + assets.length;
|
|
273
|
+
// The empty state is owned by the page (`AssetsView` renders `EmptyState`) — an
|
|
274
|
+
// empty grid renders nothing at all.
|
|
270
275
|
if (totalItems === 0) {
|
|
271
|
-
return
|
|
272
|
-
padding: 8,
|
|
273
|
-
children: /*#__PURE__*/ jsx(Typography, {
|
|
274
|
-
textColor: "neutral600",
|
|
275
|
-
children: formatMessage({
|
|
276
|
-
id: 'app.components.EmptyStateLayout.content-document',
|
|
277
|
-
defaultMessage: 'No content found'
|
|
278
|
-
})
|
|
279
|
-
})
|
|
280
|
-
});
|
|
276
|
+
return null;
|
|
281
277
|
}
|
|
282
278
|
return /*#__PURE__*/ jsxs(Grid.Root, {
|
|
283
279
|
gap: 4,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AssetsGrid.mjs","sources":["../../../../../../admin/src/future/pages/Assets/components/AssetsGrid.tsx"],"sourcesContent":["import {\n Box,\n Card,\n CardBody,\n CardHeader,\n Flex,\n Grid,\n IconButton,\n Typography,\n} from '@strapi/design-system';\nimport { Folder as FolderIcon, More } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { styled, css } from 'styled-components';\n\nimport { ASSET_TYPES } from '../../../../enums';\nimport { prefixFileUrlWithBackendUrl } from '../../../utils/files';\nimport { getAssetIcon } from '../../../utils/getAssetIcon';\nimport { getTranslationKey } from '../../../utils/translations';\nimport { useFolderNavigation } from '../hooks/useFolderNavigation';\n\nimport { useAssetsDndOptional } from './Dnd/AssetsDndProvider';\nimport { useFileDraggable, useFolderDraggableDroppable } from './Dnd/useAssetDnd';\n\nimport type { File } from '../../../../../../shared/contracts/files';\nimport type { Folder } from '../../../../../../shared/contracts/folders';\n\n/* -------------------------------------------------------------------------------------------------\n * AssetsGrid\n * -----------------------------------------------------------------------------------------------*/\n\nconst StyledCard = styled(Card)<{ $isDragging?: boolean; $isMovePending?: boolean }>`\n border: 1px solid ${({ theme }) => theme.colors.neutral200};\n border-radius: 8px;\n overflow: hidden;\n cursor: ${({ $isMovePending }) => ($isMovePending ? 'wait' : 'pointer')};\n opacity: ${({ $isDragging }) => ($isDragging ? 0.4 : 1)};\n pointer-events: ${({ $isMovePending }) => ($isMovePending ? 'none' : 'auto')};\n\n &:hover {\n background: ${({ theme }) => theme.colors.primary100};\n }\n\n &:focus-visible {\n outline: 2px solid ${({ theme }) => theme.colors.primary600};\n outline-offset: 2px;\n }\n`;\n\n/* -------------------------------------------------------------------------------------------------\n * FolderCard\n * -----------------------------------------------------------------------------------------------*/\n\nconst FoldersRow = styled(Box)`\n grid-column: 1 / -1;\n`;\n\nconst StyledFolderCard = styled(Flex)<{\n $isDragging?: boolean;\n $isMovePending?: boolean;\n $isValidDropTarget?: boolean;\n $isInvalidDropTarget?: boolean;\n}>`\n width: 100%;\n padding: ${({ theme }) => `${theme.spaces[2]} ${theme.spaces[3]}`}; // 8px 12px\n align-items: center;\n gap: ${({ theme }) => theme.spaces[2]}; // 8px\n border: 1px solid ${({ theme }) => theme.colors.neutral200};\n border-radius: ${({ theme }) => theme.borderRadius};\n background: ${({ theme }) => theme.colors.neutral0};\n cursor: ${({ $isMovePending, $isInvalidDropTarget }) => {\n if ($isMovePending) {\n return 'wait';\n }\n\n return $isInvalidDropTarget ? 'not-allowed' : 'pointer';\n }};\n opacity: ${({ $isDragging }) => ($isDragging ? 0.4 : 1)};\n pointer-events: ${({ $isMovePending }) => ($isMovePending ? 'none' : 'auto')};\n transition: background 0.2s;\n\n ${({ $isValidDropTarget, theme }) =>\n $isValidDropTarget &&\n css`\n background: ${theme.colors.primary100};\n border: 1px dashed ${theme.colors.primary600};\n `}\n\n &:hover {\n background: ${({ theme }) => theme.colors.primary100};\n }\n\n &:focus-visible {\n outline: 2px solid ${({ theme }) => theme.colors.primary600};\n outline-offset: 2px;\n }\n`;\n\nconst FolderIconContainer = styled(Flex)`\n flex-shrink: 0;\n color: ${({ theme }) => theme.colors.neutral600};\n`;\n\nconst FolderName = styled(Typography)`\n flex: 1;\n min-width: 0;\n`;\n\ninterface FolderCardProps {\n folder: Folder;\n}\n\nconst FolderCard = ({ folder }: FolderCardProps) => {\n const { formatMessage } = useIntl();\n const { navigateToFolder } = useFolderNavigation();\n const { isMovePending } = useAssetsDndOptional() ?? { isMovePending: false };\n const {\n draggable: { attributes, listeners, setNodeRef: setDragRef, isDragging },\n droppable: { setNodeRef: setDropRef },\n showValidDropHighlight,\n showInvalidDropCursor,\n } = useFolderDraggableDroppable(folder);\n\n const setNodeRef = (node: HTMLElement | null) => {\n setDragRef(node);\n setDropRef(node);\n };\n\n const handleKeyDown = (e: React.KeyboardEvent) => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n navigateToFolder(folder);\n }\n };\n\n return (\n <StyledFolderCard\n ref={setNodeRef}\n {...attributes}\n {...listeners}\n $isDragging={isDragging}\n $isMovePending={isMovePending}\n $isValidDropTarget={showValidDropHighlight}\n $isInvalidDropTarget={showInvalidDropCursor}\n onClick={() => navigateToFolder(folder)}\n onKeyDown={handleKeyDown}\n role=\"listitem\"\n tabIndex={0}\n >\n <FolderIconContainer>\n <FolderIcon width={20} height={20} />\n </FolderIconContainer>\n <FolderName textColor=\"neutral800\" ellipsis>\n {folder.name}\n </FolderName>\n <IconButton\n label={formatMessage({\n id: getTranslationKey('control-card.more-actions'),\n defaultMessage: 'More actions',\n })}\n variant=\"ghost\"\n onClick={(e: React.MouseEvent) => e.stopPropagation()}\n >\n <More />\n </IconButton>\n </StyledFolderCard>\n );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * AssetPreview\n * -----------------------------------------------------------------------------------------------*/\n\nconst PreviewContainer = styled(Box)`\n position: relative;\n width: 100%;\n padding-bottom: 62.5%;\n height: 0;\n overflow: hidden;\n background: repeating-conic-gradient(\n ${({ theme }) => theme.colors.neutral100} 0% 25%,\n transparent 0% 50%\n )\n 50% / 20px 20px;\n`;\n\nconst StyledImage = styled.img`\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n object-fit: cover;\n`;\n\nconst IconPreview = styled(Flex)`\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n color: ${({ theme }) => theme.colors.neutral500};\n background: ${({ theme }) => theme.colors.neutral100};\n`;\n\ninterface AssetPreviewProps {\n asset: File;\n}\n\nconst AssetPreview = ({ asset }: AssetPreviewProps) => {\n const { alternativeText, ext, formats, mime, url } = asset;\n\n if (mime?.includes(ASSET_TYPES.Image)) {\n const mediaURL =\n prefixFileUrlWithBackendUrl(formats?.thumbnail?.url) ?? prefixFileUrlWithBackendUrl(url);\n\n if (mediaURL) {\n return (\n <PreviewContainer>\n <StyledImage\n src={mediaURL}\n alt={alternativeText || ''}\n draggable={false}\n onDragStart={(e) => e.preventDefault()}\n />\n </PreviewContainer>\n );\n }\n }\n\n const DocIcon = getAssetIcon(mime, ext);\n\n return (\n <PreviewContainer>\n <IconPreview justifyContent=\"center\" alignItems=\"center\">\n <DocIcon width={48} height={48} />\n </IconPreview>\n </PreviewContainer>\n );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * AssetCard\n * -----------------------------------------------------------------------------------------------*/\n\nconst StyledCardHeader = styled(CardHeader)`\n border-bottom: 1px solid ${({ theme }) => theme.colors.neutral200};\n`;\n\nconst CardFooter = styled(Flex)`\n min-width: 0;\n width: 100%;\n`;\n\nconst FileTypeIcon = styled(Flex)`\n color: ${({ theme }) => theme.colors.neutral600};\n flex-shrink: 0;\n`;\n\nconst FileName = styled(Typography)`\n flex: 1;\n min-width: 0;\n`;\n\ninterface AssetCardProps {\n asset: File;\n onAssetItemClick: (assetId: number) => void;\n}\n\nconst AssetCard = ({ asset, onAssetItemClick }: AssetCardProps) => {\n const { formatMessage } = useIntl();\n const TypeIcon = getAssetIcon(asset.mime, asset.ext);\n const { isMovePending } = useAssetsDndOptional() ?? { isMovePending: false };\n const { attributes, listeners, setNodeRef, isDragging } = useFileDraggable(asset);\n\n const handleKeyDown = (e: React.KeyboardEvent) => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n onAssetItemClick(asset.id);\n }\n };\n\n return (\n <StyledCard\n ref={setNodeRef}\n {...attributes}\n {...listeners}\n $isDragging={isDragging}\n $isMovePending={isMovePending}\n tabIndex={0}\n role=\"listitem\"\n onDragStart={(e) => e.preventDefault()}\n onClick={() => onAssetItemClick(asset.id)}\n onKeyDown={handleKeyDown}\n >\n <StyledCardHeader>\n <AssetPreview asset={asset} />\n </StyledCardHeader>\n <CardBody>\n <CardFooter alignItems=\"center\" gap={2}>\n <FileTypeIcon>\n <TypeIcon width={20} height={20} />\n </FileTypeIcon>\n <FileName textColor=\"primary800\" ellipsis>\n {asset.name}\n </FileName>\n <IconButton\n label={formatMessage({\n id: getTranslationKey('control-card.more-actions'),\n defaultMessage: 'More actions',\n })}\n variant=\"ghost\"\n onClick={(e: React.MouseEvent) => e.stopPropagation()}\n >\n <More />\n </IconButton>\n </CardFooter>\n </CardBody>\n </StyledCard>\n );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * AssetsGrid\n * -----------------------------------------------------------------------------------------------*/\n\ninterface AssetsGridProps {\n assets: File[];\n folders?: Folder[];\n onAssetItemClick: (assetId: number) => void;\n}\n\nexport const AssetsGrid = ({ assets, folders = [], onAssetItemClick }: AssetsGridProps) => {\n const { formatMessage } = useIntl();\n\n const totalItems = folders.length + assets.length;\n\n if (totalItems === 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\n return (\n <Grid.Root gap={4} role=\"list\" data-testid=\"assets-grid\">\n {folders.length > 0 && (\n <FoldersRow>\n <Grid.Root gap={4}>\n {folders.map((folder) => (\n <Grid.Item col={3} m={4} s={6} xs={12} key={`folder-${folder.id}`}>\n <FolderCard folder={folder} />\n </Grid.Item>\n ))}\n </Grid.Root>\n </FoldersRow>\n )}\n {assets.map((asset) => (\n <Grid.Item\n col={3}\n m={4}\n s={6}\n xs={12}\n key={asset.id}\n direction=\"column\"\n alignItems=\"stretch\"\n >\n <AssetCard asset={asset} onAssetItemClick={onAssetItemClick} />\n </Grid.Item>\n ))}\n </Grid.Root>\n );\n};\n"],"names":["StyledCard","styled","Card","theme","colors","neutral200","$isMovePending","$isDragging","primary100","primary600","FoldersRow","Box","StyledFolderCard","Flex","spaces","borderRadius","neutral0","$isInvalidDropTarget","$isValidDropTarget","css","FolderIconContainer","neutral600","FolderName","Typography","FolderCard","folder","formatMessage","useIntl","navigateToFolder","useFolderNavigation","isMovePending","useAssetsDndOptional","draggable","attributes","listeners","setNodeRef","setDragRef","isDragging","droppable","setDropRef","showValidDropHighlight","showInvalidDropCursor","useFolderDraggableDroppable","node","handleKeyDown","e","key","preventDefault","_jsxs","ref","onClick","onKeyDown","role","tabIndex","_jsx","FolderIcon","width","height","textColor","ellipsis","name","IconButton","label","id","getTranslationKey","defaultMessage","variant","stopPropagation","More","PreviewContainer","neutral100","StyledImage","img","IconPreview","neutral500","AssetPreview","asset","alternativeText","ext","formats","mime","url","includes","ASSET_TYPES","Image","mediaURL","prefixFileUrlWithBackendUrl","thumbnail","src","alt","onDragStart","DocIcon","getAssetIcon","justifyContent","alignItems","StyledCardHeader","CardHeader","CardFooter","FileTypeIcon","FileName","AssetCard","onAssetItemClick","TypeIcon","useFileDraggable","CardBody","gap","AssetsGrid","assets","folders","totalItems","length","padding","Grid","Root","data-testid","map","Item","col","m","s","xs","direction"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"AssetsGrid.mjs","sources":["../../../../../../admin/src/future/pages/Assets/components/AssetsGrid.tsx"],"sourcesContent":["import {\n Box,\n Card,\n CardBody,\n CardHeader,\n Flex,\n Grid,\n IconButton,\n Typography,\n} from '@strapi/design-system';\nimport { Folder as FolderIcon, More } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { styled, css } from 'styled-components';\n\nimport { ASSET_TYPES } from '../../../../enums';\nimport { prefixFileUrlWithBackendUrl } from '../../../utils/files';\nimport { getAssetIcon } from '../../../utils/getAssetIcon';\nimport { getTranslationKey } from '../../../utils/translations';\nimport { useFolderNavigation } from '../hooks/useFolderNavigation';\n\nimport { useAssetsDndOptional } from './Dnd/AssetsDndProvider';\nimport { useFileDraggable, useFolderDraggableDroppable } from './Dnd/useAssetDnd';\n\nimport type { File } from '../../../../../../shared/contracts/files';\nimport type { Folder } from '../../../../../../shared/contracts/folders';\n\n/* -------------------------------------------------------------------------------------------------\n * AssetsGrid\n * -----------------------------------------------------------------------------------------------*/\n\nconst StyledCard = styled(Card)<{ $isDragging?: boolean; $isMovePending?: boolean }>`\n border: 1px solid ${({ theme }) => theme.colors.neutral200};\n border-radius: 8px;\n overflow: hidden;\n cursor: ${({ $isMovePending }) => ($isMovePending ? 'wait' : 'pointer')};\n opacity: ${({ $isDragging }) => ($isDragging ? 0.4 : 1)};\n pointer-events: ${({ $isMovePending }) => ($isMovePending ? 'none' : 'auto')};\n\n &:hover {\n background: ${({ theme }) => theme.colors.primary100};\n }\n\n &:focus-visible {\n outline: 2px solid ${({ theme }) => theme.colors.primary600};\n outline-offset: 2px;\n }\n`;\n\n/* -------------------------------------------------------------------------------------------------\n * FolderCard\n * -----------------------------------------------------------------------------------------------*/\n\nconst FoldersRow = styled(Box)`\n grid-column: 1 / -1;\n`;\n\nconst StyledFolderCard = styled(Flex)<{\n $isDragging?: boolean;\n $isMovePending?: boolean;\n $isValidDropTarget?: boolean;\n $isInvalidDropTarget?: boolean;\n}>`\n width: 100%;\n padding: ${({ theme }) => `${theme.spaces[2]} ${theme.spaces[3]}`}; // 8px 12px\n align-items: center;\n gap: ${({ theme }) => theme.spaces[2]}; // 8px\n border: 1px solid ${({ theme }) => theme.colors.neutral200};\n border-radius: ${({ theme }) => theme.borderRadius};\n background: ${({ theme }) => theme.colors.neutral0};\n cursor: ${({ $isMovePending, $isInvalidDropTarget }) => {\n if ($isMovePending) {\n return 'wait';\n }\n\n return $isInvalidDropTarget ? 'not-allowed' : 'pointer';\n }};\n opacity: ${({ $isDragging }) => ($isDragging ? 0.4 : 1)};\n pointer-events: ${({ $isMovePending }) => ($isMovePending ? 'none' : 'auto')};\n transition: background 0.2s;\n\n ${({ $isValidDropTarget, theme }) =>\n $isValidDropTarget &&\n css`\n background: ${theme.colors.primary100};\n border: 1px dashed ${theme.colors.primary600};\n `}\n\n &:hover {\n background: ${({ theme }) => theme.colors.primary100};\n }\n\n &:focus-visible {\n outline: 2px solid ${({ theme }) => theme.colors.primary600};\n outline-offset: 2px;\n }\n`;\n\nconst FolderIconContainer = styled(Flex)`\n flex-shrink: 0;\n color: ${({ theme }) => theme.colors.neutral600};\n`;\n\nconst FolderName = styled(Typography)`\n flex: 1;\n min-width: 0;\n`;\n\ninterface FolderCardProps {\n folder: Folder;\n}\n\nconst FolderCard = ({ folder }: FolderCardProps) => {\n const { formatMessage } = useIntl();\n const { navigateToFolder } = useFolderNavigation();\n const { isMovePending } = useAssetsDndOptional() ?? { isMovePending: false };\n const {\n draggable: { attributes, listeners, setNodeRef: setDragRef, isDragging },\n droppable: { setNodeRef: setDropRef },\n showValidDropHighlight,\n showInvalidDropCursor,\n } = useFolderDraggableDroppable(folder);\n\n const setNodeRef = (node: HTMLElement | null) => {\n setDragRef(node);\n setDropRef(node);\n };\n\n const handleKeyDown = (e: React.KeyboardEvent) => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n navigateToFolder(folder);\n }\n };\n\n return (\n <StyledFolderCard\n ref={setNodeRef}\n {...attributes}\n {...listeners}\n $isDragging={isDragging}\n $isMovePending={isMovePending}\n $isValidDropTarget={showValidDropHighlight}\n $isInvalidDropTarget={showInvalidDropCursor}\n onClick={() => navigateToFolder(folder)}\n onKeyDown={handleKeyDown}\n role=\"listitem\"\n tabIndex={0}\n >\n <FolderIconContainer>\n <FolderIcon width={20} height={20} />\n </FolderIconContainer>\n <FolderName textColor=\"neutral800\" ellipsis>\n {folder.name}\n </FolderName>\n <IconButton\n label={formatMessage({\n id: getTranslationKey('control-card.more-actions'),\n defaultMessage: 'More actions',\n })}\n variant=\"ghost\"\n onClick={(e: React.MouseEvent) => e.stopPropagation()}\n >\n <More />\n </IconButton>\n </StyledFolderCard>\n );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * AssetPreview\n * -----------------------------------------------------------------------------------------------*/\n\nconst PreviewContainer = styled(Box)`\n position: relative;\n width: 100%;\n padding-bottom: 62.5%;\n height: 0;\n overflow: hidden;\n background: repeating-conic-gradient(\n ${({ theme }) => theme.colors.neutral100} 0% 25%,\n transparent 0% 50%\n )\n 50% / 20px 20px;\n`;\n\nconst StyledImage = styled.img`\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n object-fit: cover;\n`;\n\nconst IconPreview = styled(Flex)`\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n color: ${({ theme }) => theme.colors.neutral500};\n background: ${({ theme }) => theme.colors.neutral100};\n`;\n\ninterface AssetPreviewProps {\n asset: File;\n}\n\nconst AssetPreview = ({ asset }: AssetPreviewProps) => {\n const { alternativeText, ext, formats, mime, url, isLocal, isUrlSigned } = asset;\n\n if (mime?.includes(ASSET_TYPES.Image)) {\n const mediaURL =\n prefixFileUrlWithBackendUrl(formats?.thumbnail?.url) ?? prefixFileUrlWithBackendUrl(url);\n\n if (mediaURL) {\n return (\n <PreviewContainer>\n <StyledImage\n src={mediaURL}\n alt={alternativeText || ''}\n // Only signed remote URLs need crossOrigin (cache collision with\n // the preview). Public/unsigned remote thumbnails must render\n // without a bucket CORS rule. See #26581.\n crossOrigin={!isLocal && isUrlSigned ? 'anonymous' : undefined}\n draggable={false}\n onDragStart={(e) => e.preventDefault()}\n />\n </PreviewContainer>\n );\n }\n }\n\n const DocIcon = getAssetIcon(mime, ext);\n\n return (\n <PreviewContainer>\n <IconPreview justifyContent=\"center\" alignItems=\"center\">\n <DocIcon width={48} height={48} />\n </IconPreview>\n </PreviewContainer>\n );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * AssetCard\n * -----------------------------------------------------------------------------------------------*/\n\nconst StyledCardHeader = styled(CardHeader)`\n border-bottom: 1px solid ${({ theme }) => theme.colors.neutral200};\n`;\n\nconst CardFooter = styled(Flex)`\n min-width: 0;\n width: 100%;\n`;\n\nconst FileTypeIcon = styled(Flex)`\n color: ${({ theme }) => theme.colors.neutral600};\n flex-shrink: 0;\n`;\n\nconst FileName = styled(Typography)`\n flex: 1;\n min-width: 0;\n`;\n\ninterface AssetCardProps {\n asset: File;\n onAssetItemClick: (assetId: number) => void;\n}\n\nconst AssetCard = ({ asset, onAssetItemClick }: AssetCardProps) => {\n const { formatMessage } = useIntl();\n const TypeIcon = getAssetIcon(asset.mime, asset.ext);\n const { isMovePending } = useAssetsDndOptional() ?? { isMovePending: false };\n const { attributes, listeners, setNodeRef, isDragging } = useFileDraggable(asset);\n\n const handleKeyDown = (e: React.KeyboardEvent) => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n onAssetItemClick(asset.id);\n }\n };\n\n return (\n <StyledCard\n ref={setNodeRef}\n {...attributes}\n {...listeners}\n $isDragging={isDragging}\n $isMovePending={isMovePending}\n tabIndex={0}\n role=\"listitem\"\n onDragStart={(e) => e.preventDefault()}\n onClick={() => onAssetItemClick(asset.id)}\n onKeyDown={handleKeyDown}\n >\n <StyledCardHeader>\n <AssetPreview asset={asset} />\n </StyledCardHeader>\n <CardBody>\n <CardFooter alignItems=\"center\" gap={2}>\n <FileTypeIcon>\n <TypeIcon width={20} height={20} />\n </FileTypeIcon>\n <FileName textColor=\"primary800\" ellipsis>\n {asset.name}\n </FileName>\n <IconButton\n label={formatMessage({\n id: getTranslationKey('control-card.more-actions'),\n defaultMessage: 'More actions',\n })}\n variant=\"ghost\"\n onClick={(e: React.MouseEvent) => e.stopPropagation()}\n >\n <More />\n </IconButton>\n </CardFooter>\n </CardBody>\n </StyledCard>\n );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * AssetsGrid\n * -----------------------------------------------------------------------------------------------*/\n\ninterface AssetsGridProps {\n assets: File[];\n folders?: Folder[];\n onAssetItemClick: (assetId: number) => void;\n}\n\nexport const AssetsGrid = ({ assets, folders = [], onAssetItemClick }: AssetsGridProps) => {\n const totalItems = folders.length + assets.length;\n\n // The empty state is owned by the page (`AssetsView` renders `EmptyState`) — an\n // empty grid renders nothing at all.\n if (totalItems === 0) {\n return null;\n }\n\n return (\n <Grid.Root gap={4} role=\"list\" data-testid=\"assets-grid\">\n {folders.length > 0 && (\n <FoldersRow>\n <Grid.Root gap={4}>\n {folders.map((folder) => (\n <Grid.Item col={3} m={4} s={6} xs={12} key={`folder-${folder.id}`}>\n <FolderCard folder={folder} />\n </Grid.Item>\n ))}\n </Grid.Root>\n </FoldersRow>\n )}\n {assets.map((asset) => (\n <Grid.Item\n col={3}\n m={4}\n s={6}\n xs={12}\n key={asset.id}\n direction=\"column\"\n alignItems=\"stretch\"\n >\n <AssetCard asset={asset} onAssetItemClick={onAssetItemClick} />\n </Grid.Item>\n ))}\n </Grid.Root>\n );\n};\n"],"names":["StyledCard","styled","Card","theme","colors","neutral200","$isMovePending","$isDragging","primary100","primary600","FoldersRow","Box","StyledFolderCard","Flex","spaces","borderRadius","neutral0","$isInvalidDropTarget","$isValidDropTarget","css","FolderIconContainer","neutral600","FolderName","Typography","FolderCard","folder","formatMessage","useIntl","navigateToFolder","useFolderNavigation","isMovePending","useAssetsDndOptional","draggable","attributes","listeners","setNodeRef","setDragRef","isDragging","droppable","setDropRef","showValidDropHighlight","showInvalidDropCursor","useFolderDraggableDroppable","node","handleKeyDown","e","key","preventDefault","_jsxs","ref","onClick","onKeyDown","role","tabIndex","_jsx","FolderIcon","width","height","textColor","ellipsis","name","IconButton","label","id","getTranslationKey","defaultMessage","variant","stopPropagation","More","PreviewContainer","neutral100","StyledImage","img","IconPreview","neutral500","AssetPreview","asset","alternativeText","ext","formats","mime","url","isLocal","isUrlSigned","includes","ASSET_TYPES","Image","mediaURL","prefixFileUrlWithBackendUrl","thumbnail","src","alt","crossOrigin","undefined","onDragStart","DocIcon","getAssetIcon","justifyContent","alignItems","StyledCardHeader","CardHeader","CardFooter","FileTypeIcon","FileName","AssetCard","onAssetItemClick","TypeIcon","useFileDraggable","CardBody","gap","AssetsGrid","assets","folders","totalItems","length","Grid","Root","data-testid","map","Item","col","m","s","xs","direction"],"mappings":"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"}
|
|
@@ -71,10 +71,6 @@ const StyledTr = styledComponents.styled.tr`
|
|
|
71
71
|
}
|
|
72
72
|
}
|
|
73
73
|
`;
|
|
74
|
-
const StyledBodyTd = styledComponents.styled(designSystem.RawTd)`
|
|
75
|
-
padding: ${({ theme })=>theme.spaces[4]};
|
|
76
|
-
border-bottom: 1px solid ${({ theme })=>theme.colors.neutral150};
|
|
77
|
-
`;
|
|
78
74
|
const AssetPreviewCell = ({ asset })=>{
|
|
79
75
|
const { ext, mime } = asset;
|
|
80
76
|
const DocIcon = getAssetIcon.getAssetIcon(mime, ext);
|
|
@@ -299,6 +295,11 @@ const AssetsTable = ({ assets, folders = [], onAssetItemClick })=>{
|
|
|
299
295
|
const { formatMessage } = reactIntl.useIntl();
|
|
300
296
|
const visibleHeaders = isMobile ? constants.TABLE_HEADERS.filter((h)=>h.name === 'name' || h.name === 'actions') : constants.TABLE_HEADERS;
|
|
301
297
|
const totalRows = folders.length + assets.length;
|
|
298
|
+
// The empty state is owned by the page (`AssetsView` renders `EmptyState`) — an
|
|
299
|
+
// empty table renders nothing at all, not headers over an empty body.
|
|
300
|
+
if (totalRows === 0) {
|
|
301
|
+
return null;
|
|
302
|
+
}
|
|
302
303
|
return /*#__PURE__*/ jsxRuntime.jsxs(StyledTable, {
|
|
303
304
|
colCount: visibleHeaders.length,
|
|
304
305
|
rowCount: totalRows + 1,
|
|
@@ -328,29 +329,16 @@ const AssetsTable = ({ assets, folders = [], onAssetItemClick })=>{
|
|
|
328
329
|
})
|
|
329
330
|
})
|
|
330
331
|
}),
|
|
331
|
-
/*#__PURE__*/ jsxRuntime.
|
|
332
|
-
children:
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
|
|
341
|
-
})
|
|
342
|
-
})
|
|
343
|
-
}) : /*#__PURE__*/ jsxRuntime.jsxs(jsxRuntime.Fragment, {
|
|
344
|
-
children: [
|
|
345
|
-
folders.map((folder)=>/*#__PURE__*/ jsxRuntime.jsx(FolderRow, {
|
|
346
|
-
folder: folder
|
|
347
|
-
}, `folder-${folder.id}`)),
|
|
348
|
-
assets.map((asset)=>/*#__PURE__*/ jsxRuntime.jsx(AssetRow, {
|
|
349
|
-
asset: asset,
|
|
350
|
-
onAssetItemClick: onAssetItemClick
|
|
351
|
-
}, asset.id))
|
|
352
|
-
]
|
|
353
|
-
})
|
|
332
|
+
/*#__PURE__*/ jsxRuntime.jsxs(designSystem.RawTbody, {
|
|
333
|
+
children: [
|
|
334
|
+
folders.map((folder)=>/*#__PURE__*/ jsxRuntime.jsx(FolderRow, {
|
|
335
|
+
folder: folder
|
|
336
|
+
}, `folder-${folder.id}`)),
|
|
337
|
+
assets.map((asset)=>/*#__PURE__*/ jsxRuntime.jsx(AssetRow, {
|
|
338
|
+
asset: asset,
|
|
339
|
+
onAssetItemClick: onAssetItemClick
|
|
340
|
+
}, asset.id))
|
|
341
|
+
]
|
|
354
342
|
})
|
|
355
343
|
]
|
|
356
344
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AssetsTable.js","sources":["../../../../../../admin/src/future/pages/Assets/components/AssetsTable.tsx"],"sourcesContent":["import { useIsMobile } from '@strapi/admin/strapi-admin';\nimport {\n Flex,\n IconButton,\n RawTable,\n RawTbody,\n RawTd,\n RawTh,\n RawThead,\n RawTr,\n Typography,\n VisuallyHidden,\n} from '@strapi/design-system';\nimport { Folder as FolderIcon, More } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { styled, css } from 'styled-components';\n\nimport { formatBytes } from '../../../utils/files';\nimport { getAssetIcon } from '../../../utils/getAssetIcon';\nimport { getTranslationKey } from '../../../utils/translations';\nimport { TABLE_HEADERS } from '../constants';\nimport { useFolderNavigation } from '../hooks/useFolderNavigation';\n\nimport { useAssetsDndOptional } from './Dnd/AssetsDndProvider';\nimport { useFileDraggable, useFolderDraggableDroppable } from './Dnd/useAssetDnd';\n\nimport type { File } from '../../../../../../shared/contracts/files';\nimport type { Folder } from '../../../../../../shared/contracts/folders';\n\nconst StyledTable = styled(RawTable)`\n width: 100%;\n border-collapse: separate;\n border-spacing: 0;\n border: 1px solid ${({ theme }) => theme.colors.neutral150};\n border-radius: 4px;\n overflow: hidden;\n`;\n\nconst StyledThead = styled(RawThead)`\n background: ${({ theme }) => theme.colors.neutral100};\n\n tr {\n border-bottom: 1px solid ${({ theme }) => theme.colors.neutral150};\n }\n`;\n\nconst StyledTh = styled(RawTh)`\n height: 40px;\n padding: 0 ${({ theme }) => theme.spaces[4]};\n text-align: left;\n`;\n\nconst StyledTd = styled(RawTd)`\n padding: 0 ${({ theme }) => theme.spaces[4]};\n border-bottom: 1px solid ${({ theme }) => theme.colors.neutral150};\n`;\n\nconst StyledTr = styled.tr<{\n $isDragging?: boolean;\n $isMovePending?: boolean;\n $isValidDropTarget?: boolean;\n $isInvalidDropTarget?: boolean;\n}>`\n height: 48px;\n background: ${({ theme }) => theme.colors.neutral0};\n cursor: ${({ $isMovePending, $isInvalidDropTarget }) => {\n if ($isMovePending) {\n return 'wait';\n }\n\n return $isInvalidDropTarget ? 'not-allowed' : 'pointer';\n }};\n opacity: ${({ $isDragging }) => ($isDragging ? 0.4 : 1)};\n pointer-events: ${({ $isMovePending }) => ($isMovePending ? 'none' : 'auto')};\n\n ${({ $isValidDropTarget, theme }) =>\n $isValidDropTarget &&\n css`\n background: ${theme.colors.primary100};\n outline: 1px dashed ${theme.colors.primary600};\n outline-offset: -1px;\n `}\n\n &:hover {\n background: ${({ theme }) => theme.colors.primary100};\n }\n\n &:focus-visible {\n outline: 2px solid ${({ theme }) => theme.colors.primary600};\n outline-offset: -2px;\n }\n\n &:last-child {\n ${StyledTd} {\n border-bottom: 0;\n }\n }\n`;\n\nconst StyledBodyTd = styled(RawTd)`\n padding: ${({ theme }) => theme.spaces[4]};\n border-bottom: 1px solid ${({ theme }) => theme.colors.neutral150};\n`;\n\ninterface AssetPreviewCellProps {\n asset: File;\n}\n\nconst AssetPreviewCell = ({ asset }: AssetPreviewCellProps) => {\n const { ext, mime } = asset;\n\n const DocIcon = getAssetIcon(mime, ext);\n\n return (\n <Flex\n justifyContent=\"center\"\n alignItems=\"center\"\n borderRadius=\"4px\"\n color=\"neutral500\"\n width=\"3.2rem\"\n height=\"3.2rem\"\n shrink={0}\n >\n <DocIcon width={20} height={20} />\n </Flex>\n );\n};\n\ninterface AssetRowProps {\n asset: File;\n onAssetItemClick: (assetId: number) => void;\n}\n\nconst AssetRow = ({ asset, onAssetItemClick }: AssetRowProps) => {\n const isMobile = useIsMobile();\n const { formatDate, formatMessage } = useIntl();\n const { isMovePending } = useAssetsDndOptional() ?? { isMovePending: false };\n const { attributes, listeners, setNodeRef, isDragging } = useFileDraggable(asset);\n\n const handleKeyDown = (e: React.KeyboardEvent) => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n onAssetItemClick(asset.id);\n }\n };\n\n return (\n <StyledTr\n ref={setNodeRef}\n {...attributes}\n {...listeners}\n $isDragging={isDragging}\n $isMovePending={isMovePending}\n tabIndex={0}\n role=\"row\"\n onDragStart={(e) => e.preventDefault()}\n onClick={() => onAssetItemClick(asset.id)}\n onKeyDown={handleKeyDown}\n >\n <StyledTd>\n <Flex gap={3} alignItems=\"center\">\n <AssetPreviewCell asset={asset} />\n <Flex direction=\"column\" alignItems=\"flex-start\">\n <Typography textColor=\"neutral800\" fontWeight=\"semiBold\" ellipsis>\n {asset.name}\n </Typography>\n {isMobile && (\n <Typography textColor=\"neutral600\" variant=\"pi\">\n {asset.size ? formatBytes(asset.size, 1) : '-'}\n </Typography>\n )}\n </Flex>\n </Flex>\n </StyledTd>\n {!isMobile && (\n <>\n <StyledTd>\n <Typography textColor=\"neutral600\">\n {asset.createdAt ? formatDate(new Date(asset.createdAt), { dateStyle: 'long' }) : '-'}\n </Typography>\n </StyledTd>\n <StyledTd>\n <Typography textColor=\"neutral600\">\n {asset.updatedAt ? formatDate(new Date(asset.updatedAt), { dateStyle: 'long' }) : '-'}\n </Typography>\n </StyledTd>\n <StyledTd>\n <Typography textColor=\"neutral600\">\n {asset.size ? formatBytes(asset.size, 1) : '-'}\n </Typography>\n </StyledTd>\n </>\n )}\n <StyledTd>\n <Flex justifyContent=\"flex-end\">\n <IconButton\n label={formatMessage({\n id: getTranslationKey('control-card.more-actions'),\n defaultMessage: 'More actions',\n })}\n variant=\"ghost\"\n onClick={(e: React.MouseEvent) => e.stopPropagation()}\n >\n <More />\n </IconButton>\n </Flex>\n </StyledTd>\n </StyledTr>\n );\n};\n\nconst FolderTr = styled(StyledTr)`\n &:hover {\n background: ${({ theme }) => theme.colors.primary100};\n }\n`;\n\ninterface FolderRowProps {\n folder: Folder;\n}\n\nconst FolderRow = ({ folder }: FolderRowProps) => {\n const isMobile = useIsMobile();\n const { formatDate, formatMessage } = useIntl();\n const { navigateToFolder } = useFolderNavigation();\n const { isMovePending } = useAssetsDndOptional() ?? { isMovePending: false };\n const {\n draggable: { attributes, listeners, setNodeRef: setDragRef, isDragging },\n droppable: { setNodeRef: setDropRef },\n showValidDropHighlight,\n showInvalidDropCursor,\n } = useFolderDraggableDroppable(folder);\n\n const handleKeyDown = (e: React.KeyboardEvent) => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n navigateToFolder(folder);\n }\n };\n\n return (\n <FolderTr\n ref={(node) => {\n setDragRef(node);\n setDropRef(node);\n }}\n {...attributes}\n {...listeners}\n $isDragging={isDragging}\n $isMovePending={isMovePending}\n $isValidDropTarget={showValidDropHighlight}\n $isInvalidDropTarget={showInvalidDropCursor}\n tabIndex={0}\n role=\"row\"\n onDragStart={(e) => e.preventDefault()}\n onClick={() => navigateToFolder(folder)}\n onKeyDown={handleKeyDown}\n >\n <StyledTd>\n <Flex gap={3} alignItems=\"center\">\n <Flex\n justifyContent=\"center\"\n alignItems=\"center\"\n borderRadius=\"4px\"\n color=\"neutral600\"\n width=\"3.2rem\"\n height=\"3.2rem\"\n shrink={0}\n >\n <FolderIcon width={20} height={20} />\n </Flex>\n <Typography textColor=\"neutral800\" fontWeight=\"semiBold\" ellipsis>\n {folder.name}\n </Typography>\n </Flex>\n </StyledTd>\n {!isMobile && (\n <>\n <StyledTd>\n <Typography textColor=\"neutral600\">\n {folder.createdAt\n ? formatDate(new Date(folder.createdAt), { dateStyle: 'long' })\n : '-'}\n </Typography>\n </StyledTd>\n <StyledTd>\n <Typography textColor=\"neutral600\">\n {folder.updatedAt\n ? formatDate(new Date(folder.updatedAt), { dateStyle: 'long' })\n : '-'}\n </Typography>\n </StyledTd>\n <StyledTd>\n <Typography textColor=\"neutral600\">-</Typography>\n </StyledTd>\n </>\n )}\n <StyledTd>\n <Flex justifyContent=\"flex-end\">\n <IconButton\n label={formatMessage({\n id: getTranslationKey('control-card.more-actions'),\n defaultMessage: 'More actions',\n })}\n variant=\"ghost\"\n onClick={(e: React.MouseEvent) => e.stopPropagation()}\n >\n <More />\n </IconButton>\n </Flex>\n </StyledTd>\n </FolderTr>\n );\n};\n\ninterface AssetsTableProps {\n assets: File[];\n folders?: Folder[];\n onAssetItemClick: (assetId: number) => void;\n}\n\nexport const AssetsTable = ({ assets, folders = [], onAssetItemClick }: AssetsTableProps) => {\n const isMobile = useIsMobile();\n const { formatMessage } = useIntl();\n\n const visibleHeaders = isMobile\n ? TABLE_HEADERS.filter((h) => h.name === 'name' || h.name === 'actions')\n : TABLE_HEADERS;\n\n const totalRows = folders.length + assets.length;\n\n return (\n <StyledTable colCount={visibleHeaders.length} rowCount={totalRows + 1}>\n <StyledThead>\n <RawTr>\n {visibleHeaders.map((header) => {\n const tableHeaderLabel = formatMessage(header.label);\n const isVisuallyHidden = 'isVisuallyHidden' in header && header.isVisuallyHidden;\n\n if (isVisuallyHidden) {\n return (\n <StyledTh key={header.name}>\n <VisuallyHidden>\n {formatMessage({\n id: getTranslationKey('table.header.actions'),\n defaultMessage: 'actions',\n })}\n </VisuallyHidden>\n </StyledTh>\n );\n }\n\n return (\n <StyledTh key={header.name}>\n <Typography textColor=\"neutral600\" variant=\"sigma\">\n {tableHeaderLabel}\n </Typography>\n </StyledTh>\n );\n })}\n </RawTr>\n </StyledThead>\n <RawTbody>\n {totalRows === 0 ? (\n <RawTr>\n <StyledBodyTd colSpan={visibleHeaders.length}>\n <Typography textColor=\"neutral600\">\n {formatMessage({\n id: 'app.components.EmptyStateLayout.content-document',\n defaultMessage: 'No content found',\n })}\n </Typography>\n </StyledBodyTd>\n </RawTr>\n ) : (\n <>\n {folders.map((folder) => (\n <FolderRow key={`folder-${folder.id}`} folder={folder} />\n ))}\n {assets.map((asset) => (\n <AssetRow key={asset.id} asset={asset} onAssetItemClick={onAssetItemClick} />\n ))}\n </>\n )}\n </RawTbody>\n </StyledTable>\n );\n};\n"],"names":["StyledTable","styled","RawTable","theme","colors","neutral150","StyledThead","RawThead","neutral100","StyledTh","RawTh","spaces","StyledTd","RawTd","StyledTr","tr","neutral0","$isMovePending","$isInvalidDropTarget","$isDragging","$isValidDropTarget","css","primary100","primary600","StyledBodyTd","AssetPreviewCell","asset","ext","mime","DocIcon","getAssetIcon","_jsx","Flex","justifyContent","alignItems","borderRadius","color","width","height","shrink","AssetRow","onAssetItemClick","isMobile","useIsMobile","formatDate","formatMessage","useIntl","isMovePending","useAssetsDndOptional","attributes","listeners","setNodeRef","isDragging","useFileDraggable","handleKeyDown","e","key","preventDefault","id","_jsxs","ref","tabIndex","role","onDragStart","onClick","onKeyDown","gap","direction","Typography","textColor","fontWeight","ellipsis","name","variant","size","formatBytes","_Fragment","createdAt","Date","dateStyle","updatedAt","IconButton","label","getTranslationKey","defaultMessage","stopPropagation","More","FolderTr","FolderRow","folder","navigateToFolder","useFolderNavigation","draggable","setDragRef","droppable","setDropRef","showValidDropHighlight","showInvalidDropCursor","useFolderDraggableDroppable","node","FolderIcon","AssetsTable","assets","folders","visibleHeaders","TABLE_HEADERS","filter","h","totalRows","length","colCount","rowCount","RawTr","map","header","tableHeaderLabel","isVisuallyHidden","VisuallyHidden","RawTbody","colSpan"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"AssetsTable.js","sources":["../../../../../../admin/src/future/pages/Assets/components/AssetsTable.tsx"],"sourcesContent":["import { useIsMobile } from '@strapi/admin/strapi-admin';\nimport {\n Flex,\n IconButton,\n RawTable,\n RawTbody,\n RawTd,\n RawTh,\n RawThead,\n RawTr,\n Typography,\n VisuallyHidden,\n} from '@strapi/design-system';\nimport { Folder as FolderIcon, More } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { styled, css } from 'styled-components';\n\nimport { formatBytes } from '../../../utils/files';\nimport { getAssetIcon } from '../../../utils/getAssetIcon';\nimport { getTranslationKey } from '../../../utils/translations';\nimport { TABLE_HEADERS } from '../constants';\nimport { useFolderNavigation } from '../hooks/useFolderNavigation';\n\nimport { useAssetsDndOptional } from './Dnd/AssetsDndProvider';\nimport { useFileDraggable, useFolderDraggableDroppable } from './Dnd/useAssetDnd';\n\nimport type { File } from '../../../../../../shared/contracts/files';\nimport type { Folder } from '../../../../../../shared/contracts/folders';\n\nconst StyledTable = styled(RawTable)`\n width: 100%;\n border-collapse: separate;\n border-spacing: 0;\n border: 1px solid ${({ theme }) => theme.colors.neutral150};\n border-radius: 4px;\n overflow: hidden;\n`;\n\nconst StyledThead = styled(RawThead)`\n background: ${({ theme }) => theme.colors.neutral100};\n\n tr {\n border-bottom: 1px solid ${({ theme }) => theme.colors.neutral150};\n }\n`;\n\nconst StyledTh = styled(RawTh)`\n height: 40px;\n padding: 0 ${({ theme }) => theme.spaces[4]};\n text-align: left;\n`;\n\nconst StyledTd = styled(RawTd)`\n padding: 0 ${({ theme }) => theme.spaces[4]};\n border-bottom: 1px solid ${({ theme }) => theme.colors.neutral150};\n`;\n\nconst StyledTr = styled.tr<{\n $isDragging?: boolean;\n $isMovePending?: boolean;\n $isValidDropTarget?: boolean;\n $isInvalidDropTarget?: boolean;\n}>`\n height: 48px;\n background: ${({ theme }) => theme.colors.neutral0};\n cursor: ${({ $isMovePending, $isInvalidDropTarget }) => {\n if ($isMovePending) {\n return 'wait';\n }\n\n return $isInvalidDropTarget ? 'not-allowed' : 'pointer';\n }};\n opacity: ${({ $isDragging }) => ($isDragging ? 0.4 : 1)};\n pointer-events: ${({ $isMovePending }) => ($isMovePending ? 'none' : 'auto')};\n\n ${({ $isValidDropTarget, theme }) =>\n $isValidDropTarget &&\n css`\n background: ${theme.colors.primary100};\n outline: 1px dashed ${theme.colors.primary600};\n outline-offset: -1px;\n `}\n\n &:hover {\n background: ${({ theme }) => theme.colors.primary100};\n }\n\n &:focus-visible {\n outline: 2px solid ${({ theme }) => theme.colors.primary600};\n outline-offset: -2px;\n }\n\n &:last-child {\n ${StyledTd} {\n border-bottom: 0;\n }\n }\n`;\n\ninterface AssetPreviewCellProps {\n asset: File;\n}\n\nconst AssetPreviewCell = ({ asset }: AssetPreviewCellProps) => {\n const { ext, mime } = asset;\n\n const DocIcon = getAssetIcon(mime, ext);\n\n return (\n <Flex\n justifyContent=\"center\"\n alignItems=\"center\"\n borderRadius=\"4px\"\n color=\"neutral500\"\n width=\"3.2rem\"\n height=\"3.2rem\"\n shrink={0}\n >\n <DocIcon width={20} height={20} />\n </Flex>\n );\n};\n\ninterface AssetRowProps {\n asset: File;\n onAssetItemClick: (assetId: number) => void;\n}\n\nconst AssetRow = ({ asset, onAssetItemClick }: AssetRowProps) => {\n const isMobile = useIsMobile();\n const { formatDate, formatMessage } = useIntl();\n const { isMovePending } = useAssetsDndOptional() ?? { isMovePending: false };\n const { attributes, listeners, setNodeRef, isDragging } = useFileDraggable(asset);\n\n const handleKeyDown = (e: React.KeyboardEvent) => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n onAssetItemClick(asset.id);\n }\n };\n\n return (\n <StyledTr\n ref={setNodeRef}\n {...attributes}\n {...listeners}\n $isDragging={isDragging}\n $isMovePending={isMovePending}\n tabIndex={0}\n role=\"row\"\n onDragStart={(e) => e.preventDefault()}\n onClick={() => onAssetItemClick(asset.id)}\n onKeyDown={handleKeyDown}\n >\n <StyledTd>\n <Flex gap={3} alignItems=\"center\">\n <AssetPreviewCell asset={asset} />\n <Flex direction=\"column\" alignItems=\"flex-start\">\n <Typography textColor=\"neutral800\" fontWeight=\"semiBold\" ellipsis>\n {asset.name}\n </Typography>\n {isMobile && (\n <Typography textColor=\"neutral600\" variant=\"pi\">\n {asset.size ? formatBytes(asset.size, 1) : '-'}\n </Typography>\n )}\n </Flex>\n </Flex>\n </StyledTd>\n {!isMobile && (\n <>\n <StyledTd>\n <Typography textColor=\"neutral600\">\n {asset.createdAt ? formatDate(new Date(asset.createdAt), { dateStyle: 'long' }) : '-'}\n </Typography>\n </StyledTd>\n <StyledTd>\n <Typography textColor=\"neutral600\">\n {asset.updatedAt ? formatDate(new Date(asset.updatedAt), { dateStyle: 'long' }) : '-'}\n </Typography>\n </StyledTd>\n <StyledTd>\n <Typography textColor=\"neutral600\">\n {asset.size ? formatBytes(asset.size, 1) : '-'}\n </Typography>\n </StyledTd>\n </>\n )}\n <StyledTd>\n <Flex justifyContent=\"flex-end\">\n <IconButton\n label={formatMessage({\n id: getTranslationKey('control-card.more-actions'),\n defaultMessage: 'More actions',\n })}\n variant=\"ghost\"\n onClick={(e: React.MouseEvent) => e.stopPropagation()}\n >\n <More />\n </IconButton>\n </Flex>\n </StyledTd>\n </StyledTr>\n );\n};\n\nconst FolderTr = styled(StyledTr)`\n &:hover {\n background: ${({ theme }) => theme.colors.primary100};\n }\n`;\n\ninterface FolderRowProps {\n folder: Folder;\n}\n\nconst FolderRow = ({ folder }: FolderRowProps) => {\n const isMobile = useIsMobile();\n const { formatDate, formatMessage } = useIntl();\n const { navigateToFolder } = useFolderNavigation();\n const { isMovePending } = useAssetsDndOptional() ?? { isMovePending: false };\n const {\n draggable: { attributes, listeners, setNodeRef: setDragRef, isDragging },\n droppable: { setNodeRef: setDropRef },\n showValidDropHighlight,\n showInvalidDropCursor,\n } = useFolderDraggableDroppable(folder);\n\n const handleKeyDown = (e: React.KeyboardEvent) => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n navigateToFolder(folder);\n }\n };\n\n return (\n <FolderTr\n ref={(node) => {\n setDragRef(node);\n setDropRef(node);\n }}\n {...attributes}\n {...listeners}\n $isDragging={isDragging}\n $isMovePending={isMovePending}\n $isValidDropTarget={showValidDropHighlight}\n $isInvalidDropTarget={showInvalidDropCursor}\n tabIndex={0}\n role=\"row\"\n onDragStart={(e) => e.preventDefault()}\n onClick={() => navigateToFolder(folder)}\n onKeyDown={handleKeyDown}\n >\n <StyledTd>\n <Flex gap={3} alignItems=\"center\">\n <Flex\n justifyContent=\"center\"\n alignItems=\"center\"\n borderRadius=\"4px\"\n color=\"neutral600\"\n width=\"3.2rem\"\n height=\"3.2rem\"\n shrink={0}\n >\n <FolderIcon width={20} height={20} />\n </Flex>\n <Typography textColor=\"neutral800\" fontWeight=\"semiBold\" ellipsis>\n {folder.name}\n </Typography>\n </Flex>\n </StyledTd>\n {!isMobile && (\n <>\n <StyledTd>\n <Typography textColor=\"neutral600\">\n {folder.createdAt\n ? formatDate(new Date(folder.createdAt), { dateStyle: 'long' })\n : '-'}\n </Typography>\n </StyledTd>\n <StyledTd>\n <Typography textColor=\"neutral600\">\n {folder.updatedAt\n ? formatDate(new Date(folder.updatedAt), { dateStyle: 'long' })\n : '-'}\n </Typography>\n </StyledTd>\n <StyledTd>\n <Typography textColor=\"neutral600\">-</Typography>\n </StyledTd>\n </>\n )}\n <StyledTd>\n <Flex justifyContent=\"flex-end\">\n <IconButton\n label={formatMessage({\n id: getTranslationKey('control-card.more-actions'),\n defaultMessage: 'More actions',\n })}\n variant=\"ghost\"\n onClick={(e: React.MouseEvent) => e.stopPropagation()}\n >\n <More />\n </IconButton>\n </Flex>\n </StyledTd>\n </FolderTr>\n );\n};\n\ninterface AssetsTableProps {\n assets: File[];\n folders?: Folder[];\n onAssetItemClick: (assetId: number) => void;\n}\n\nexport const AssetsTable = ({ assets, folders = [], onAssetItemClick }: AssetsTableProps) => {\n const isMobile = useIsMobile();\n const { formatMessage } = useIntl();\n\n const visibleHeaders = isMobile\n ? TABLE_HEADERS.filter((h) => h.name === 'name' || h.name === 'actions')\n : TABLE_HEADERS;\n\n const totalRows = folders.length + assets.length;\n\n // The empty state is owned by the page (`AssetsView` renders `EmptyState`) — an\n // empty table renders nothing at all, not headers over an empty body.\n if (totalRows === 0) {\n return null;\n }\n\n return (\n <StyledTable colCount={visibleHeaders.length} rowCount={totalRows + 1}>\n <StyledThead>\n <RawTr>\n {visibleHeaders.map((header) => {\n const tableHeaderLabel = formatMessage(header.label);\n const isVisuallyHidden = 'isVisuallyHidden' in header && header.isVisuallyHidden;\n\n if (isVisuallyHidden) {\n return (\n <StyledTh key={header.name}>\n <VisuallyHidden>\n {formatMessage({\n id: getTranslationKey('table.header.actions'),\n defaultMessage: 'actions',\n })}\n </VisuallyHidden>\n </StyledTh>\n );\n }\n\n return (\n <StyledTh key={header.name}>\n <Typography textColor=\"neutral600\" variant=\"sigma\">\n {tableHeaderLabel}\n </Typography>\n </StyledTh>\n );\n })}\n </RawTr>\n </StyledThead>\n <RawTbody>\n {folders.map((folder) => (\n <FolderRow key={`folder-${folder.id}`} folder={folder} />\n ))}\n {assets.map((asset) => (\n <AssetRow key={asset.id} asset={asset} onAssetItemClick={onAssetItemClick} />\n ))}\n </RawTbody>\n </StyledTable>\n );\n};\n"],"names":["StyledTable","styled","RawTable","theme","colors","neutral150","StyledThead","RawThead","neutral100","StyledTh","RawTh","spaces","StyledTd","RawTd","StyledTr","tr","neutral0","$isMovePending","$isInvalidDropTarget","$isDragging","$isValidDropTarget","css","primary100","primary600","AssetPreviewCell","asset","ext","mime","DocIcon","getAssetIcon","_jsx","Flex","justifyContent","alignItems","borderRadius","color","width","height","shrink","AssetRow","onAssetItemClick","isMobile","useIsMobile","formatDate","formatMessage","useIntl","isMovePending","useAssetsDndOptional","attributes","listeners","setNodeRef","isDragging","useFileDraggable","handleKeyDown","e","key","preventDefault","id","_jsxs","ref","tabIndex","role","onDragStart","onClick","onKeyDown","gap","direction","Typography","textColor","fontWeight","ellipsis","name","variant","size","formatBytes","_Fragment","createdAt","Date","dateStyle","updatedAt","IconButton","label","getTranslationKey","defaultMessage","stopPropagation","More","FolderTr","FolderRow","folder","navigateToFolder","useFolderNavigation","draggable","setDragRef","droppable","setDropRef","showValidDropHighlight","showInvalidDropCursor","useFolderDraggableDroppable","node","FolderIcon","AssetsTable","assets","folders","visibleHeaders","TABLE_HEADERS","filter","h","totalRows","length","colCount","rowCount","RawTr","map","header","tableHeaderLabel","isVisuallyHidden","VisuallyHidden","RawTbody"],"mappings":"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"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
|
|
2
2
|
import { useIsMobile } from '@strapi/admin/strapi-admin';
|
|
3
|
-
import { RawTr, VisuallyHidden, Typography, RawTbody, RawTable, RawThead, RawTh,
|
|
3
|
+
import { RawTr, VisuallyHidden, Typography, RawTbody, RawTable, RawThead, RawTh, Flex, IconButton, RawTd } from '@strapi/design-system';
|
|
4
4
|
import { Folder, More } from '@strapi/icons';
|
|
5
5
|
import { useIntl } from 'react-intl';
|
|
6
6
|
import { styled, css } from 'styled-components';
|
|
@@ -69,10 +69,6 @@ const StyledTr = styled.tr`
|
|
|
69
69
|
}
|
|
70
70
|
}
|
|
71
71
|
`;
|
|
72
|
-
const StyledBodyTd = styled(RawTd)`
|
|
73
|
-
padding: ${({ theme })=>theme.spaces[4]};
|
|
74
|
-
border-bottom: 1px solid ${({ theme })=>theme.colors.neutral150};
|
|
75
|
-
`;
|
|
76
72
|
const AssetPreviewCell = ({ asset })=>{
|
|
77
73
|
const { ext, mime } = asset;
|
|
78
74
|
const DocIcon = getAssetIcon(mime, ext);
|
|
@@ -297,6 +293,11 @@ const AssetsTable = ({ assets, folders = [], onAssetItemClick })=>{
|
|
|
297
293
|
const { formatMessage } = useIntl();
|
|
298
294
|
const visibleHeaders = isMobile ? TABLE_HEADERS.filter((h)=>h.name === 'name' || h.name === 'actions') : TABLE_HEADERS;
|
|
299
295
|
const totalRows = folders.length + assets.length;
|
|
296
|
+
// The empty state is owned by the page (`AssetsView` renders `EmptyState`) — an
|
|
297
|
+
// empty table renders nothing at all, not headers over an empty body.
|
|
298
|
+
if (totalRows === 0) {
|
|
299
|
+
return null;
|
|
300
|
+
}
|
|
300
301
|
return /*#__PURE__*/ jsxs(StyledTable, {
|
|
301
302
|
colCount: visibleHeaders.length,
|
|
302
303
|
rowCount: totalRows + 1,
|
|
@@ -326,29 +327,16 @@ const AssetsTable = ({ assets, folders = [], onAssetItemClick })=>{
|
|
|
326
327
|
})
|
|
327
328
|
})
|
|
328
329
|
}),
|
|
329
|
-
/*#__PURE__*/
|
|
330
|
-
children:
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
})
|
|
340
|
-
})
|
|
341
|
-
}) : /*#__PURE__*/ jsxs(Fragment, {
|
|
342
|
-
children: [
|
|
343
|
-
folders.map((folder)=>/*#__PURE__*/ jsx(FolderRow, {
|
|
344
|
-
folder: folder
|
|
345
|
-
}, `folder-${folder.id}`)),
|
|
346
|
-
assets.map((asset)=>/*#__PURE__*/ jsx(AssetRow, {
|
|
347
|
-
asset: asset,
|
|
348
|
-
onAssetItemClick: onAssetItemClick
|
|
349
|
-
}, asset.id))
|
|
350
|
-
]
|
|
351
|
-
})
|
|
330
|
+
/*#__PURE__*/ jsxs(RawTbody, {
|
|
331
|
+
children: [
|
|
332
|
+
folders.map((folder)=>/*#__PURE__*/ jsx(FolderRow, {
|
|
333
|
+
folder: folder
|
|
334
|
+
}, `folder-${folder.id}`)),
|
|
335
|
+
assets.map((asset)=>/*#__PURE__*/ jsx(AssetRow, {
|
|
336
|
+
asset: asset,
|
|
337
|
+
onAssetItemClick: onAssetItemClick
|
|
338
|
+
}, asset.id))
|
|
339
|
+
]
|
|
352
340
|
})
|
|
353
341
|
]
|
|
354
342
|
});
|