@strapi/upload 5.50.1 → 5.51.0

package/dist/admin/future/pages/Assets/AssetsPage.js

@@ -18,6 +18,7 @@ var CreateFolderDialog = require('./components/CreateFolderDialog.js');
 var AssetsDndProvider = require('./components/Dnd/AssetsDndProvider.js');
 var UploadDropZone = require('./components/DropZone/UploadDropZone.js');
 var UploadDropZoneContext = require('./components/DropZone/UploadDropZoneContext.js');
+var EmptyState = require('./components/EmptyState.js');
 var FolderTree = require('./components/FolderTree/FolderTree.js');
 var ImportFromUrlDialog = require('./components/ImportFromUrlDialog.js');
 var constants = require('./constants.js');
@@ -48,7 +49,7 @@ var ToggleGroup__namespace = /*#__PURE__*/_interopNamespace(ToggleGroup);
 const INTERSECTION_OPTIONS = {
     threshold: 0.1
 };
-const AssetsView = ({ view, folderId, onAssetItemClick })=>{
+const AssetsView = ({ view, folderId, onAssetItemClick, onAddAssets })=>{
     const { formatMessage } = reactIntl.useIntl();
     const { assets, isLoading: isLoadingAssets, isFetchingMore, hasNextPage, fetchNextPage, error } = useInfiniteAssets.useInfiniteAssets({
         folder: folderId
@@ -92,15 +93,8 @@ const AssetsView = ({ view, folderId, onAssetItemClick })=>{
         });
     }
     if (folders$1.length === 0 && assets.length === 0) {
-        return /*#__PURE__*/ jsxRuntime.jsx(designSystem.Box, {
-            padding: 8,
-            children: /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
-                textColor: "neutral600",
-                children: formatMessage({
-                    id: 'app.components.EmptyStateLayout.content-document',
-                    defaultMessage: 'No content found'
-                })
-            })
+        return /*#__PURE__*/ jsxRuntime.jsx(EmptyState.EmptyState, {
+            onAddAssets: onAddAssets
         });
     }
     return /*#__PURE__*/ jsxRuntime.jsxs(jsxRuntime.Fragment, {
@@ -397,7 +391,8 @@ const AssetsPage = ()=>{
                                             /*#__PURE__*/ jsxRuntime.jsx(AssetsView, {
                                                 view: view,
                                                 folderId: currentFolderId,
-                                                onAssetItemClick: openDetails
+                                                onAssetItemClick: openDetails,
+                                                onAddAssets: handleFileSelect
                                             })
                                         ]
                                     })

package/dist/admin/future/pages/Assets/AssetsPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"AssetsPage.js","sources":["../../../../../admin/src/future/pages/Assets/AssetsPage.tsx"],"sourcesContent":["import { useRef, useCallback, useState, useEffect, type ChangeEvent } from 'react';\n\nimport * as ToggleGroup from '@radix-ui/react-toggle-group';\nimport { Layouts, useElementOnScreen, usePersistentState } from '@strapi/admin/strapi-admin';\nimport {\n  Box,\n  Flex,\n  Loader,\n  MenuItem,\n  SimpleMenu,\n  Typography,\n  VisuallyHidden,\n} from '@strapi/design-system';\nimport { ChevronDown, Files, Folder, GridFour as GridIcon, Link, List } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\n\nimport { useUploadFromUrlsMutation, useUploadFilesMutation } from '../../services/api';\nimport { useGetFolderQuery, useGetFoldersQuery } from '../../services/folders';\nimport { getTranslationKey } from '../../utils/translations';\n\nimport {\n  AssetDetailsDrawer,\n  useAssetDetailsParam,\n} from './components/AssetDetails/AssetDetailsDrawer';\nimport { AssetsGrid } from './components/AssetsGrid';\nimport { AssetsTable } from './components/AssetsTable';\nimport { CreateFolderDialog } from './components/CreateFolderDialog';\nimport { AssetsDndProvider } from './components/Dnd/AssetsDndProvider';\nimport { DropFilesMessage, DropZoneWithOverlay } from './components/DropZone/UploadDropZone';\nimport { UploadDropZoneProvider } from './components/DropZone/UploadDropZoneContext';\nimport { FolderTree } from './components/FolderTree/FolderTree';\nimport { ImportFromUrlDialog } from './components/ImportFromUrlDialog';\nimport { localStorageKeys, viewOptions } from './constants';\nimport { useFolderInfo } from './hooks/useFolderInfo';\nimport { useFolderNavigation } from './hooks/useFolderNavigation';\nimport { useInfiniteAssets } from './hooks/useInfiniteAssets';\n\nimport type { UploadFileInfo } from '../../../../../shared/contracts/files';\n\nconst INTERSECTION_OPTIONS: IntersectionObserverInit = { threshold: 0.1 };\n\n/* -------------------------------------------------------------------------------------------------\n * AssetsView\n * -----------------------------------------------------------------------------------------------*/\n\ninterface AssetsViewProps {\n  view: number;\n  folderId: number | null;\n  onAssetItemClick: (assetId: number) => void;\n}\n\nconst AssetsView = ({ view, folderId, onAssetItemClick }: AssetsViewProps) => {\n  const { formatMessage } = useIntl();\n  const {\n    assets,\n    isLoading: isLoadingAssets,\n    isFetchingMore,\n    hasNextPage,\n    fetchNextPage,\n    error,\n  } = useInfiniteAssets({ folder: folderId });\n  const { data: folders = [], isLoading: isLoadingFolders } = useGetFoldersQuery({\n    parentId: folderId,\n  });\n\n  const isGridView = view === viewOptions.GRID;\n  const isLoading = isLoadingAssets || isLoadingFolders;\n\n  const loadMoreRef = useElementOnScreen<HTMLDivElement>(\n    useCallback(\n      (isVisible) => {\n        if (isVisible && hasNextPage && !isFetchingMore) {\n          fetchNextPage();\n        }\n      },\n      [hasNextPage, isFetchingMore, fetchNextPage]\n    ),\n    INTERSECTION_OPTIONS\n  );\n\n  if (isLoading) {\n    return (\n      <Flex justifyContent=\"center\" padding={8}>\n        <Loader>{formatMessage({ id: 'app.loading', defaultMessage: 'Loading...' })}</Loader>\n      </Flex>\n    );\n  }\n\n  if (error) {\n    return (\n      <Box padding={8}>\n        <Typography textColor=\"danger600\">\n          {formatMessage({\n            id: getTranslationKey('list.assets.error'),\n            defaultMessage: 'An error occurred while fetching assets.',\n          })}\n        </Typography>\n      </Box>\n    );\n  }\n\n  if (folders.length === 0 && assets.length === 0) {\n    return (\n      <Box padding={8}>\n        <Typography textColor=\"neutral600\">\n          {formatMessage({\n            id: 'app.components.EmptyStateLayout.content-document',\n            defaultMessage: 'No content found',\n          })}\n        </Typography>\n      </Box>\n    );\n  }\n  return (\n    <>\n      {isGridView ? (\n        <AssetsGrid folders={folders} assets={assets} onAssetItemClick={onAssetItemClick} />\n      ) : (\n        <AssetsTable assets={assets} folders={folders} onAssetItemClick={onAssetItemClick} />\n      )}\n      <div ref={loadMoreRef} style={{ height: 1 }} />\n      {isFetchingMore && (\n        <Flex justifyContent=\"center\" padding={4}>\n          <Loader>\n            {formatMessage({\n              id: getTranslationKey('list.assets.loading-more'),\n              defaultMessage: 'Loading more assets...',\n            })}\n          </Loader>\n        </Flex>\n      )}\n    </>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * AssetsPage\n * -----------------------------------------------------------------------------------------------*/\n\nconst StyledToggleGroup = styled(ToggleGroup.Root)`\n  display: flex;\n  border: 1px solid ${({ theme }) => theme.colors.neutral200};\n  border-radius: ${({ theme }) => theme.borderRadius};\n  overflow: hidden;\n`;\n\nconst StyledToggleItem = styled(ToggleGroup.Item)`\n  display: flex;\n  align-items: center;\n  gap: ${({ theme }) => theme.spaces[2]};\n  padding: ${({ theme }) => `${theme.spaces[2]} ${theme.spaces[4]}`};\n  border: none;\n  background: ${({ theme }) => theme.colors.neutral0};\n  color: ${({ theme }) => theme.colors.neutral800};\n  cursor: pointer;\n  font-size: ${({ theme }) => theme.fontSizes[1]};\n  font-weight: ${({ theme }) => theme.fontWeights.semiBold};\n\n  &:hover {\n    background: ${({ theme }) => theme.colors.primary100};\n  }\n\n  &[data-state='on'] {\n    background: ${({ theme }) => theme.colors.neutral150};\n  }\n\n  svg {\n    width: 1.6rem;\n    height: 1.6rem;\n  }\n`;\n\nconst HeaderWrapper = styled(Box)`\n  [data-strapi-header] {\n    background: ${({ theme }) => theme.colors.neutral0};\n\n    h1 {\n      font-size: 1.8rem;\n    }\n  }\n`;\n\nexport const AssetsPage = () => {\n  const { formatMessage } = useIntl();\n  const { openDetails } = useAssetDetailsParam();\n\n  const { currentFolderId, navigateToFolderId, navigateToRoot } = useFolderNavigation();\n  // Deleted or missing folders (404) need a fetch — handled here, not in\n  // `useFolderNavigation` (which only strips malformed ?folder= values).\n  const { error: currentFolderError } = useGetFolderQuery(\n    { id: currentFolderId! },\n    { skip: currentFolderId === null }\n  );\n\n  useEffect(() => {\n    if (currentFolderError?.name === 'NotFoundError') {\n      navigateToRoot();\n    }\n  }, [currentFolderError, navigateToRoot]);\n  const { title, itemCount } = useFolderInfo(currentFolderId);\n  const itemCountLabel = formatMessage(\n    {\n      id: getTranslationKey('header.content.item-count'),\n      defaultMessage: '{count, plural, =1 {# item} other {# items}}',\n    },\n    { count: itemCount }\n  );\n  const pageHeaderTitle = title\n    ? `${title} (${itemCountLabel})`\n    : formatMessage({ id: 'app.loading', defaultMessage: 'Loading...' });\n\n  const [isCreateFolderDialogOpen, setIsCreateFolderDialogOpen] = useState(false);\n\n  // View state\n  const [view, setView] = usePersistentState(localStorageKeys.view, viewOptions.GRID);\n  const isGridView = view === viewOptions.GRID;\n\n  // Dialog state\n  const [isUrlDialogOpen, setIsUrlDialogOpen] = useState(false);\n\n  // Refs\n  const fileInputRef = useRef<HTMLInputElement>(null);\n  const uploadDropZoneRef = useRef<HTMLDivElement>(null);\n\n  // Upload handlers\n  const [uploadFiles] = useUploadFilesMutation();\n  const [uploadFromUrls] = useUploadFromUrlsMutation();\n\n  const uploadFilesToFolder = async (files: globalThis.File[], folderId: number | null) => {\n    if (files.length === 0) return;\n\n    const formData = new FormData();\n    const fileInfoArray: UploadFileInfo[] = [];\n\n    files.forEach((file) => {\n      formData.append('files', file);\n      fileInfoArray.push({\n        name: file.name,\n        caption: null,\n        alternativeText: null,\n        folder: folderId,\n      });\n    });\n\n    formData.append('fileInfo', JSON.stringify(fileInfoArray));\n    try {\n      await uploadFiles({ formData, totalFiles: files.length }).unwrap();\n    } catch (error) {\n      // Error is already dispatched to store from the API queryFn\n    }\n  };\n\n  const handleFileSelect = () => {\n    fileInputRef.current?.click();\n  };\n\n  const handleFileChange = async (e: ChangeEvent<HTMLInputElement>) => {\n    const files = e.target.files;\n    if (files && files.length > 0) {\n      await uploadFilesToFolder(Array.from(files), currentFolderId);\n    }\n    e.target.value = '';\n  };\n\n  const handleDrop = async (files: globalThis.File[]) => {\n    await uploadFilesToFolder(files, currentFolderId);\n  };\n\n  const handleUrlUpload = async (urls: string[]) => {\n    try {\n      await uploadFromUrls({ urls, folderId: currentFolderId }).unwrap();\n    } catch (error) {\n      // Error is already dispatched to store from the API queryFn\n    }\n  };\n\n  return (\n    <>\n      <UploadDropZoneProvider onDrop={handleDrop}>\n        <AssetsDndProvider>\n          <Box ref={uploadDropZoneRef}>\n            <Layouts.Root\n              minHeight=\"100vh\"\n              background=\"neutral0\"\n              sideNav={\n                <FolderTree currentFolderId={currentFolderId} onSelectFolder={navigateToFolderId} />\n              }\n            >\n              <VisuallyHidden>\n                <input type=\"file\" ref={fileInputRef} onChange={handleFileChange} multiple />\n              </VisuallyHidden>\n\n              <HeaderWrapper>\n                <Layouts.Header\n                  title={pageHeaderTitle}\n                  primaryAction={\n                    <SimpleMenu\n                      popoverPlacement=\"bottom-end\"\n                      variant=\"default\"\n                      endIcon={<ChevronDown />}\n                      label={formatMessage({ id: getTranslationKey('new'), defaultMessage: 'New' })}\n                    >\n                      <MenuItem\n                        onSelect={() => setIsCreateFolderDialogOpen(true)}\n                        startIcon={<Folder />}\n                      >\n                        {formatMessage({\n                          id: getTranslationKey('folder.create.title'),\n                          defaultMessage: 'New folder',\n                        })}\n                      </MenuItem>\n                      <MenuItem onSelect={handleFileSelect} startIcon={<Files />}>\n                        {formatMessage({\n                          id: getTranslationKey('import-files'),\n                          defaultMessage: 'Import files',\n                        })}\n                      </MenuItem>\n                      <MenuItem onSelect={() => setIsUrlDialogOpen(true)} startIcon={<Link />}>\n                        {formatMessage({\n                          id: getTranslationKey('import-from-url'),\n                          defaultMessage: 'Import from URL',\n                        })}\n                      </MenuItem>\n                    </SimpleMenu>\n                  }\n                  subtitle={\n                    <Flex justifyContent=\"space-between\" alignItems=\"center\" gap={4} width=\"100%\">\n                      <Flex gap={4} alignItems=\"center\">\n                        TODO: Filters and search\n                      </Flex>\n\n                      <Flex gap={4} alignItems=\"center\">\n                        <Box>TODO: Sort</Box>\n                        <StyledToggleGroup\n                          type=\"single\"\n                          value={isGridView ? 'grid' : 'table'}\n                          onValueChange={(value) =>\n                            value &&\n                            setView(value === 'grid' ? viewOptions.GRID : viewOptions.TABLE)\n                          }\n                          aria-label={formatMessage({\n                            id: getTranslationKey('view.switch.label'),\n                            defaultMessage: 'View options',\n                          })}\n                        >\n                          <StyledToggleItem\n                            value=\"table\"\n                            aria-label={formatMessage({\n                              id: getTranslationKey('view.table'),\n                              defaultMessage: 'Table view',\n                            })}\n                          >\n                            <List />\n                            {formatMessage({\n                              id: getTranslationKey('view.table'),\n                              defaultMessage: 'Table view',\n                            })}\n                          </StyledToggleItem>\n                          <StyledToggleItem\n                            value=\"grid\"\n                            aria-label={formatMessage({\n                              id: getTranslationKey('view.grid'),\n                              defaultMessage: 'Grid view',\n                            })}\n                          >\n                            <GridIcon />\n                            {formatMessage({\n                              id: getTranslationKey('view.grid'),\n                              defaultMessage: 'Grid view',\n                            })}\n                          </StyledToggleItem>\n                        </StyledToggleGroup>\n                      </Flex>\n                    </Flex>\n                  }\n                />\n              </HeaderWrapper>\n\n              <Layouts.Content>\n                <DropZoneWithOverlay>\n                  <DropFilesMessage uploadDropZoneRef={uploadDropZoneRef} folderName={title} />\n                  <AssetsView\n                    view={view}\n                    folderId={currentFolderId}\n                    onAssetItemClick={openDetails}\n                  />\n                </DropZoneWithOverlay>\n              </Layouts.Content>\n            </Layouts.Root>\n          </Box>\n        </AssetsDndProvider>\n      </UploadDropZoneProvider>\n      <CreateFolderDialog\n        open={isCreateFolderDialogOpen}\n        folderName={title}\n        parentFolderId={currentFolderId}\n        onClose={() => setIsCreateFolderDialogOpen(false)}\n      />\n      <ImportFromUrlDialog\n        open={isUrlDialogOpen}\n        onClose={() => setIsUrlDialogOpen(false)}\n        onUpload={handleUrlUpload}\n      />\n      <AssetDetailsDrawer />\n    </>\n  );\n};\n"],"names":["INTERSECTION_OPTIONS","threshold","AssetsView","view","folderId","onAssetItemClick","formatMessage","useIntl","assets","isLoading","isLoadingAssets","isFetchingMore","hasNextPage","fetchNextPage","error","useInfiniteAssets","folder","data","folders","isLoadingFolders","useGetFoldersQuery","parentId","isGridView","viewOptions","GRID","loadMoreRef","useElementOnScreen","useCallback","isVisible","_jsx","Flex","justifyContent","padding","Loader","id","defaultMessage","Box","Typography","textColor","getTranslationKey","length","_jsxs","_Fragment","AssetsGrid","AssetsTable","div","ref","style","height","StyledToggleGroup","styled","ToggleGroup","Root","theme","colors","neutral200","borderRadius","StyledToggleItem","Item","spaces","neutral0","neutral800","fontSizes","fontWeights","semiBold","primary100","neutral150","HeaderWrapper","AssetsPage","openDetails","useAssetDetailsParam","currentFolderId","navigateToFolderId","navigateToRoot","useFolderNavigation","currentFolderError","useGetFolderQuery","skip","useEffect","name","title","itemCount","useFolderInfo","itemCountLabel","count","pageHeaderTitle","isCreateFolderDialogOpen","setIsCreateFolderDialogOpen","useState","setView","usePersistentState","localStorageKeys","isUrlDialogOpen","setIsUrlDialogOpen","fileInputRef","useRef","uploadDropZoneRef","uploadFiles","useUploadFilesMutation","uploadFromUrls","useUploadFromUrlsMutation","uploadFilesToFolder","files","formData","FormData","fileInfoArray","forEach","file","append","push","caption","alternativeText","JSON","stringify","totalFiles","unwrap","handleFileSelect","current","click","handleFileChange","e","target","Array","from","value","handleDrop","handleUrlUpload","urls","UploadDropZoneProvider","onDrop","AssetsDndProvider","Layouts","minHeight","background","sideNav","FolderTree","onSelectFolder","VisuallyHidden","input","type","onChange","multiple","Header","primaryAction","SimpleMenu","popoverPlacement","variant","endIcon","ChevronDown","label","MenuItem","onSelect","startIcon","Folder","Files","Link","subtitle","alignItems","gap","width","onValueChange","TABLE","aria-label","List","GridIcon","Content","DropZoneWithOverlay","DropFilesMessage","folderName","CreateFolderDialog","open","parentFolderId","onClose","ImportFromUrlDialog","onUpload","AssetDetailsDrawer"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwCA,MAAMA,oBAAAA,GAAiD;IAAEC,SAAAA,EAAW;AAAI,CAAA;AAYxE,MAAMC,UAAAA,GAAa,CAAC,EAAEC,IAAI,EAAEC,QAAQ,EAAEC,gBAAgB,EAAmB,GAAA;IACvE,MAAM,EAAEC,aAAa,EAAE,GAAGC,iBAAAA,EAAAA;AAC1B,IAAA,MAAM,EACJC,MAAM,EACNC,SAAAA,EAAWC,eAAe,EAC1BC,cAAc,EACdC,WAAW,EACXC,aAAa,EACbC,KAAK,EACN,GAAGC,mCAAAA,CAAkB;QAAEC,MAAAA,EAAQZ;AAAS,KAAA,CAAA;IACzC,MAAM,EAAEa,MAAMC,SAAAA,GAAU,EAAE,EAAET,SAAAA,EAAWU,gBAAgB,EAAE,GAAGC,0BAAAA,CAAmB;QAC7EC,QAAAA,EAAUjB;AACZ,KAAA,CAAA;IAEA,MAAMkB,UAAAA,GAAanB,IAAAA,KAASoB,qBAAAA,CAAYC,IAAI;AAC5C,IAAA,MAAMf,YAAYC,eAAAA,IAAmBS,gBAAAA;IAErC,MAAMM,WAAAA,GAAcC,8BAAAA,CAClBC,iBAAAA,CACE,CAACC,SAAAA,GAAAA;QACC,IAAIA,SAAAA,IAAahB,WAAAA,IAAe,CAACD,cAAAA,EAAgB;AAC/CE,YAAAA,aAAAA,EAAAA;AACF,QAAA;IACF,CAAA,EACA;AAACD,QAAAA,WAAAA;AAAaD,QAAAA,cAAAA;AAAgBE,QAAAA;KAAc,CAAA,EAE9Cb,oBAAAA,CAAAA;AAGF,IAAA,IAAIS,SAAAA,EAAW;AACb,QAAA,qBACEoB,cAAA,CAACC,iBAAAA,EAAAA;YAAKC,cAAAA,EAAe,QAAA;YAASC,OAAAA,EAAS,CAAA;AACrC,YAAA,QAAA,gBAAAH,cAAA,CAACI,mBAAAA,EAAAA;0BAAQ3B,aAAAA,CAAc;oBAAE4B,EAAAA,EAAI,aAAA;oBAAeC,cAAAA,EAAgB;AAAa,iBAAA;;;AAG/E,IAAA;AAEA,IAAA,IAAIrB,KAAAA,EAAO;AACT,QAAA,qBACEe,cAAA,CAACO,gBAAAA,EAAAA;YAAIJ,OAAAA,EAAS,CAAA;AACZ,YAAA,QAAA,gBAAAH,cAAA,CAACQ,uBAAAA,EAAAA;gBAAWC,SAAAA,EAAU,WAAA;0BACnBhC,aAAAA,CAAc;AACb4B,oBAAAA,EAAAA,EAAIK,8BAAAA,CAAkB,mBAAA,CAAA;oBACtBJ,cAAAA,EAAgB;AAClB,iBAAA;;;AAIR,IAAA;AAEA,IAAA,IAAIjB,UAAQsB,MAAM,KAAK,KAAKhC,MAAAA,CAAOgC,MAAM,KAAK,CAAA,EAAG;AAC/C,QAAA,qBACEX,cAAA,CAACO,gBAAAA,EAAAA;YAAIJ,OAAAA,EAAS,CAAA;AACZ,YAAA,QAAA,gBAAAH,cAAA,CAACQ,uBAAAA,EAAAA;gBAAWC,SAAAA,EAAU,YAAA;0BACnBhC,aAAAA,CAAc;oBACb4B,EAAAA,EAAI,kDAAA;oBACJC,cAAAA,EAAgB;AAClB,iBAAA;;;AAIR,IAAA;IACA,qBACEM,eAAA,CAAAC,mBAAA,EAAA;;AACGpB,YAAAA,UAAAA,iBACCO,cAAA,CAACc,qBAAAA,EAAAA;gBAAWzB,OAAAA,EAASA,SAAAA;gBAASV,MAAAA,EAAQA,MAAAA;gBAAQH,gBAAAA,EAAkBA;+BAEhEwB,cAAA,CAACe,uBAAAA,EAAAA;gBAAYpC,MAAAA,EAAQA,MAAAA;gBAAQU,OAAAA,EAASA,SAAAA;gBAASb,gBAAAA,EAAkBA;;0BAEnEwB,cAAA,CAACgB,KAAAA,EAAAA;gBAAIC,GAAAA,EAAKrB,WAAAA;gBAAasB,KAAAA,EAAO;oBAAEC,MAAAA,EAAQ;AAAE;;AACzCrC,YAAAA,cAAAA,kBACCkB,cAAA,CAACC,iBAAAA,EAAAA;gBAAKC,cAAAA,EAAe,QAAA;gBAASC,OAAAA,EAAS,CAAA;AACrC,gBAAA,QAAA,gBAAAH,cAAA,CAACI,mBAAAA,EAAAA;8BACE3B,aAAAA,CAAc;AACb4B,wBAAAA,EAAAA,EAAIK,8BAAAA,CAAkB,0BAAA,CAAA;wBACtBJ,cAAAA,EAAgB;AAClB,qBAAA;;;;;AAMZ,CAAA;AAEA;;AAEkG,qGAElG,MAAMc,iBAAAA,GAAoBC,uBAAAA,CAAOC,sBAAAA,CAAYC,IAAI,CAAC;;oBAE9B,EAAE,CAAC,EAAEC,KAAK,EAAE,GAAKA,KAAAA,CAAMC,MAAM,CAACC,UAAU,CAAC;AAC5C,iBAAA,EAAE,CAAC,EAAEF,KAAK,EAAE,GAAKA,KAAAA,CAAMG,YAAY,CAAC;;AAErD,CAAC;AAED,MAAMC,gBAAAA,GAAmBP,uBAAAA,CAAOC,sBAAAA,CAAYO,IAAI,CAAC;;;OAG1C,EAAE,CAAC,EAAEL,KAAK,EAAE,GAAKA,KAAAA,CAAMM,MAAM,CAAC,CAAA,CAAE,CAAC;AAC7B,WAAA,EAAE,CAAC,EAAEN,KAAK,EAAE,GAAK,CAAA,EAAGA,MAAMM,MAAM,CAAC,CAAA,CAAE,CAAC,CAAC,EAAEN,KAAAA,CAAMM,MAAM,CAAC,CAAA,CAAE,EAAE,CAAC;;cAEtD,EAAE,CAAC,EAAEN,KAAK,EAAE,GAAKA,KAAAA,CAAMC,MAAM,CAACM,QAAQ,CAAC;SAC5C,EAAE,CAAC,EAAEP,KAAK,EAAE,GAAKA,KAAAA,CAAMC,MAAM,CAACO,UAAU,CAAC;;aAErC,EAAE,CAAC,EAAER,KAAK,EAAE,GAAKA,KAAAA,CAAMS,SAAS,CAAC,CAAA,CAAE,CAAC;eAClC,EAAE,CAAC,EAAET,KAAK,EAAE,GAAKA,KAAAA,CAAMU,WAAW,CAACC,QAAQ,CAAC;;;gBAG3C,EAAE,CAAC,EAAEX,KAAK,EAAE,GAAKA,KAAAA,CAAMC,MAAM,CAACW,UAAU,CAAC;;;;gBAIzC,EAAE,CAAC,EAAEZ,KAAK,EAAE,GAAKA,KAAAA,CAAMC,MAAM,CAACY,UAAU,CAAC;;;;;;;AAOzD,CAAC;AAED,MAAMC,aAAAA,GAAgBjB,uBAAAA,CAAOd,gBAAAA,CAAI;;gBAEjB,EAAE,CAAC,EAAEiB,KAAK,EAAE,GAAKA,KAAAA,CAAMC,MAAM,CAACM,QAAQ,CAAC;;;;;;AAMvD,CAAC;MAEYQ,UAAAA,GAAa,IAAA;IACxB,MAAM,EAAE9D,aAAa,EAAE,GAAGC,iBAAAA,EAAAA;IAC1B,MAAM,EAAE8D,WAAW,EAAE,GAAGC,uCAAAA,EAAAA;AAExB,IAAA,MAAM,EAAEC,eAAe,EAAEC,kBAAkB,EAAEC,cAAc,EAAE,GAAGC,uCAAAA,EAAAA;;;AAGhE,IAAA,MAAM,EAAE5D,KAAAA,EAAO6D,kBAAkB,EAAE,GAAGC,yBAAAA,CACpC;QAAE1C,EAAAA,EAAIqC;KAAiB,EACvB;AAAEM,QAAAA,IAAAA,EAAMN,eAAAA,KAAoB;AAAK,KAAA,CAAA;IAGnCO,eAAAA,CAAU,IAAA;QACR,IAAIH,kBAAAA,EAAoBI,SAAS,eAAA,EAAiB;AAChDN,YAAAA,cAAAA,EAAAA;AACF,QAAA;IACF,CAAA,EAAG;AAACE,QAAAA,kBAAAA;AAAoBF,QAAAA;AAAe,KAAA,CAAA;AACvC,IAAA,MAAM,EAAEO,KAAK,EAAEC,SAAS,EAAE,GAAGC,2BAAAA,CAAcX,eAAAA,CAAAA;AAC3C,IAAA,MAAMY,iBAAiB7E,aAAAA,CACrB;AACE4B,QAAAA,EAAAA,EAAIK,8BAAAA,CAAkB,2BAAA,CAAA;QACtBJ,cAAAA,EAAgB;KAClB,EACA;QAAEiD,KAAAA,EAAOH;AAAU,KAAA,CAAA;IAErB,MAAMI,eAAAA,GAAkBL,KAAAA,GACpB,CAAA,EAAGA,KAAAA,CAAM,EAAE,EAAEG,cAAAA,CAAe,CAAC,CAAC,GAC9B7E,aAAAA,CAAc;QAAE4B,EAAAA,EAAI,aAAA;QAAeC,cAAAA,EAAgB;AAAa,KAAA,CAAA;AAEpE,IAAA,MAAM,CAACmD,wBAAAA,EAA0BC,2BAAAA,CAA4B,GAAGC,cAAAA,CAAS,KAAA,CAAA;;IAGzE,MAAM,CAACrF,MAAMsF,OAAAA,CAAQ,GAAGC,+BAAmBC,0BAAAA,CAAiBxF,IAAI,EAAEoB,qBAAAA,CAAYC,IAAI,CAAA;IAClF,MAAMF,UAAAA,GAAanB,IAAAA,KAASoB,qBAAAA,CAAYC,IAAI;;AAG5C,IAAA,MAAM,CAACoE,eAAAA,EAAiBC,kBAAAA,CAAmB,GAAGL,cAAAA,CAAS,KAAA,CAAA;;AAGvD,IAAA,MAAMM,eAAeC,YAAAA,CAAyB,IAAA,CAAA;AAC9C,IAAA,MAAMC,oBAAoBD,YAAAA,CAAuB,IAAA,CAAA;;IAGjD,MAAM,CAACE,YAAY,GAAGC,0BAAAA,EAAAA;IACtB,MAAM,CAACC,eAAe,GAAGC,6BAAAA,EAAAA;IAEzB,MAAMC,mBAAAA,GAAsB,OAAOC,KAAAA,EAA0BlG,QAAAA,GAAAA;QAC3D,IAAIkG,KAAAA,CAAM9D,MAAM,KAAK,CAAA,EAAG;AAExB,QAAA,MAAM+D,WAAW,IAAIC,QAAAA,EAAAA;AACrB,QAAA,MAAMC,gBAAkC,EAAE;QAE1CH,KAAAA,CAAMI,OAAO,CAAC,CAACC,IAAAA,GAAAA;YACbJ,QAAAA,CAASK,MAAM,CAAC,OAAA,EAASD,IAAAA,CAAAA;AACzBF,YAAAA,aAAAA,CAAcI,IAAI,CAAC;AACjB9B,gBAAAA,IAAAA,EAAM4B,KAAK5B,IAAI;gBACf+B,OAAAA,EAAS,IAAA;gBACTC,eAAAA,EAAiB,IAAA;gBACjB/F,MAAAA,EAAQZ;AACV,aAAA,CAAA;AACF,QAAA,CAAA,CAAA;AAEAmG,QAAAA,QAAAA,CAASK,MAAM,CAAC,UAAA,EAAYI,IAAAA,CAAKC,SAAS,CAACR,aAAAA,CAAAA,CAAAA;QAC3C,IAAI;AACF,YAAA,MAAMR,WAAAA,CAAY;AAAEM,gBAAAA,QAAAA;AAAUW,gBAAAA,UAAAA,EAAYZ,MAAM9D;AAAO,aAAA,CAAA,CAAG2E,MAAM,EAAA;AAClE,QAAA,CAAA,CAAE,OAAOrG,KAAAA,EAAO;;AAEhB,QAAA;AACF,IAAA,CAAA;AAEA,IAAA,MAAMsG,gBAAAA,GAAmB,IAAA;AACvBtB,QAAAA,YAAAA,CAAauB,OAAO,EAAEC,KAAAA,EAAAA;AACxB,IAAA,CAAA;AAEA,IAAA,MAAMC,mBAAmB,OAAOC,CAAAA,GAAAA;AAC9B,QAAA,MAAMlB,KAAAA,GAAQkB,CAAAA,CAAEC,MAAM,CAACnB,KAAK;AAC5B,QAAA,IAAIA,KAAAA,IAASA,KAAAA,CAAM9D,MAAM,GAAG,CAAA,EAAG;AAC7B,YAAA,MAAM6D,mBAAAA,CAAoBqB,KAAAA,CAAMC,IAAI,CAACrB,KAAAA,CAAAA,EAAQ/B,eAAAA,CAAAA;AAC/C,QAAA;QACAiD,CAAAA,CAAEC,MAAM,CAACG,KAAK,GAAG,EAAA;AACnB,IAAA,CAAA;AAEA,IAAA,MAAMC,aAAa,OAAOvB,KAAAA,GAAAA;AACxB,QAAA,MAAMD,oBAAoBC,KAAAA,EAAO/B,eAAAA,CAAAA;AACnC,IAAA,CAAA;AAEA,IAAA,MAAMuD,kBAAkB,OAAOC,IAAAA,GAAAA;QAC7B,IAAI;AACF,YAAA,MAAM5B,cAAAA,CAAe;AAAE4B,gBAAAA,IAAAA;gBAAM3H,QAAAA,EAAUmE;AAAgB,aAAA,CAAA,CAAG4C,MAAM,EAAA;AAClE,QAAA,CAAA,CAAE,OAAOrG,KAAAA,EAAO;;AAEhB,QAAA;AACF,IAAA,CAAA;IAEA,qBACE2B,eAAA,CAAAC,mBAAA,EAAA;;0BACEb,cAAA,CAACmG,4CAAAA,EAAAA;gBAAuBC,MAAAA,EAAQJ,UAAAA;AAC9B,gBAAA,QAAA,gBAAAhG,cAAA,CAACqG,mCAAAA,EAAAA;AACC,oBAAA,QAAA,gBAAArG,cAAA,CAACO,gBAAAA,EAAAA;wBAAIU,GAAAA,EAAKkD,iBAAAA;gDACRvD,eAAA,CAAC0F,oBAAQ/E,IAAI,EAAA;4BACXgF,SAAAA,EAAU,OAAA;4BACVC,UAAAA,EAAW,UAAA;AACXC,4BAAAA,OAAAA,gBACEzG,cAAA,CAAC0G,qBAAAA,EAAAA;gCAAWhE,eAAAA,EAAiBA,eAAAA;gCAAiBiE,cAAAA,EAAgBhE;;;8CAGhE3C,cAAA,CAAC4G,2BAAAA,EAAAA;AACC,oCAAA,QAAA,gBAAA5G,cAAA,CAAC6G,OAAAA,EAAAA;wCAAMC,IAAAA,EAAK,MAAA;wCAAO7F,GAAAA,EAAKgD,YAAAA;wCAAc8C,QAAAA,EAAUrB,gBAAAA;wCAAkBsB,QAAQ,EAAA;;;8CAG5EhH,cAAA,CAACsC,aAAAA,EAAAA;4DACCtC,cAAA,CAACsG,oBAAQW,MAAM,EAAA;wCACb9D,KAAAA,EAAOK,eAAAA;AACP0D,wCAAAA,aAAAA,gBACEtG,eAAA,CAACuG,uBAAAA,EAAAA;4CACCC,gBAAAA,EAAiB,YAAA;4CACjBC,OAAAA,EAAQ,SAAA;AACRC,4CAAAA,OAAAA,gBAAStH,cAAA,CAACuH,iBAAAA,EAAAA,EAAAA,CAAAA;AACVC,4CAAAA,KAAAA,EAAO/I,aAAAA,CAAc;AAAE4B,gDAAAA,EAAAA,EAAIK,8BAAAA,CAAkB,KAAA,CAAA;gDAAQJ,cAAAA,EAAgB;AAAM,6CAAA,CAAA;;8DAE3EN,cAAA,CAACyH,qBAAAA,EAAAA;AACCC,oDAAAA,QAAAA,EAAU,IAAMhE,2BAAAA,CAA4B,IAAA,CAAA;AAC5CiE,oDAAAA,SAAAA,gBAAW3H,cAAA,CAAC4H,YAAAA,EAAAA,EAAAA,CAAAA;8DAEXnJ,aAAAA,CAAc;AACb4B,wDAAAA,EAAAA,EAAIK,8BAAAA,CAAkB,qBAAA,CAAA;wDACtBJ,cAAAA,EAAgB;AAClB,qDAAA;;8DAEFN,cAAA,CAACyH,qBAAAA,EAAAA;oDAASC,QAAAA,EAAUnC,gBAAAA;AAAkBoC,oDAAAA,SAAAA,gBAAW3H,cAAA,CAAC6H,WAAAA,EAAAA,EAAAA,CAAAA;8DAC/CpJ,aAAAA,CAAc;AACb4B,wDAAAA,EAAAA,EAAIK,8BAAAA,CAAkB,cAAA,CAAA;wDACtBJ,cAAAA,EAAgB;AAClB,qDAAA;;8DAEFN,cAAA,CAACyH,qBAAAA,EAAAA;AAASC,oDAAAA,QAAAA,EAAU,IAAM1D,kBAAAA,CAAmB,IAAA,CAAA;AAAO2D,oDAAAA,SAAAA,gBAAW3H,cAAA,CAAC8H,UAAAA,EAAAA,EAAAA,CAAAA;8DAC7DrJ,aAAAA,CAAc;AACb4B,wDAAAA,EAAAA,EAAIK,8BAAAA,CAAkB,iBAAA,CAAA;wDACtBJ,cAAAA,EAAgB;AAClB,qDAAA;;;;AAINyH,wCAAAA,QAAAA,gBACEnH,eAAA,CAACX,iBAAAA,EAAAA;4CAAKC,cAAAA,EAAe,eAAA;4CAAgB8H,UAAAA,EAAW,QAAA;4CAASC,GAAAA,EAAK,CAAA;4CAAGC,KAAAA,EAAM,MAAA;;8DACrElI,cAAA,CAACC,iBAAAA,EAAAA;oDAAKgI,GAAAA,EAAK,CAAA;oDAAGD,UAAAA,EAAW,QAAA;AAAS,oDAAA,QAAA,EAAA;;8DAIlCpH,eAAA,CAACX,iBAAAA,EAAAA;oDAAKgI,GAAAA,EAAK,CAAA;oDAAGD,UAAAA,EAAW,QAAA;;sEACvBhI,cAAA,CAACO,gBAAAA,EAAAA;AAAI,4DAAA,QAAA,EAAA;;sEACLK,eAAA,CAACQ,iBAAAA,EAAAA;4DACC0F,IAAAA,EAAK,QAAA;AACLf,4DAAAA,KAAAA,EAAOtG,aAAa,MAAA,GAAS,OAAA;4DAC7B0I,aAAAA,EAAe,CAACpC,KAAAA,GACdA,KAAAA,IACAnC,OAAAA,CAAQmC,KAAAA,KAAU,SAASrG,qBAAAA,CAAYC,IAAI,GAAGD,qBAAAA,CAAY0I,KAAK,CAAA;AAEjEC,4DAAAA,YAAAA,EAAY5J,aAAAA,CAAc;AACxB4B,gEAAAA,EAAAA,EAAIK,8BAAAA,CAAkB,mBAAA,CAAA;gEACtBJ,cAAAA,EAAgB;AAClB,6DAAA,CAAA;;8EAEAM,eAAA,CAACgB,gBAAAA,EAAAA;oEACCmE,KAAAA,EAAM,OAAA;AACNsC,oEAAAA,YAAAA,EAAY5J,aAAAA,CAAc;AACxB4B,wEAAAA,EAAAA,EAAIK,8BAAAA,CAAkB,YAAA,CAAA;wEACtBJ,cAAAA,EAAgB;AAClB,qEAAA,CAAA;;sFAEAN,cAAA,CAACsI,UAAAA,EAAAA,EAAAA,CAAAA;wEACA7J,aAAAA,CAAc;AACb4B,4EAAAA,EAAAA,EAAIK,8BAAAA,CAAkB,YAAA,CAAA;4EACtBJ,cAAAA,EAAgB;AAClB,yEAAA;;;8EAEFM,eAAA,CAACgB,gBAAAA,EAAAA;oEACCmE,KAAAA,EAAM,MAAA;AACNsC,oEAAAA,YAAAA,EAAY5J,aAAAA,CAAc;AACxB4B,wEAAAA,EAAAA,EAAIK,8BAAAA,CAAkB,WAAA,CAAA;wEACtBJ,cAAAA,EAAgB;AAClB,qEAAA,CAAA;;sFAEAN,cAAA,CAACuI,cAAAA,EAAAA,EAAAA,CAAAA;wEACA9J,aAAAA,CAAc;AACb4B,4EAAAA,EAAAA,EAAIK,8BAAAA,CAAkB,WAAA,CAAA;4EACtBJ,cAAAA,EAAgB;AAClB,yEAAA;;;;;;;;;;;AASd,8CAAAN,cAAA,CAACsG,oBAAQkC,OAAO,EAAA;AACd,oCAAA,QAAA,gBAAA5H,eAAA,CAAC6H,kCAAAA,EAAAA;;0DACCzI,cAAA,CAAC0I,+BAAAA,EAAAA;gDAAiBvE,iBAAAA,EAAmBA,iBAAAA;gDAAmBwE,UAAAA,EAAYxF;;0DACpEnD,cAAA,CAAC3B,UAAAA,EAAAA;gDACCC,IAAAA,EAAMA,IAAAA;gDACNC,QAAAA,EAAUmE,eAAAA;gDACVlE,gBAAAA,EAAkBgE;;;;;;;;;;0BAQhCxC,cAAA,CAAC4I,qCAAAA,EAAAA;gBACCC,IAAAA,EAAMpF,wBAAAA;gBACNkF,UAAAA,EAAYxF,KAAAA;gBACZ2F,cAAAA,EAAgBpG,eAAAA;AAChBqG,gBAAAA,OAAAA,EAAS,IAAMrF,2BAAAA,CAA4B,KAAA;;0BAE7C1D,cAAA,CAACgJ,uCAAAA,EAAAA;gBACCH,IAAAA,EAAM9E,eAAAA;AACNgF,gBAAAA,OAAAA,EAAS,IAAM/E,kBAAAA,CAAmB,KAAA,CAAA;gBAClCiF,QAAAA,EAAUhD;;0BAEZjG,cAAA,CAACkJ,qCAAAA,EAAAA,EAAAA;;;AAGP;;;;"}
+{"version":3,"file":"AssetsPage.js","sources":["../../../../../admin/src/future/pages/Assets/AssetsPage.tsx"],"sourcesContent":["import { useRef, useCallback, useState, useEffect, type ChangeEvent } from 'react';\n\nimport * as ToggleGroup from '@radix-ui/react-toggle-group';\nimport { Layouts, useElementOnScreen, usePersistentState } from '@strapi/admin/strapi-admin';\nimport {\n  Box,\n  Flex,\n  Loader,\n  MenuItem,\n  SimpleMenu,\n  Typography,\n  VisuallyHidden,\n} from '@strapi/design-system';\nimport { ChevronDown, Files, Folder, GridFour as GridIcon, Link, List } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\n\nimport { useUploadFromUrlsMutation, useUploadFilesMutation } from '../../services/api';\nimport { useGetFolderQuery, useGetFoldersQuery } from '../../services/folders';\nimport { getTranslationKey } from '../../utils/translations';\n\nimport {\n  AssetDetailsDrawer,\n  useAssetDetailsParam,\n} from './components/AssetDetails/AssetDetailsDrawer';\nimport { AssetsGrid } from './components/AssetsGrid';\nimport { AssetsTable } from './components/AssetsTable';\nimport { CreateFolderDialog } from './components/CreateFolderDialog';\nimport { AssetsDndProvider } from './components/Dnd/AssetsDndProvider';\nimport { DropFilesMessage, DropZoneWithOverlay } from './components/DropZone/UploadDropZone';\nimport { UploadDropZoneProvider } from './components/DropZone/UploadDropZoneContext';\nimport { EmptyState } from './components/EmptyState';\nimport { FolderTree } from './components/FolderTree/FolderTree';\nimport { ImportFromUrlDialog } from './components/ImportFromUrlDialog';\nimport { localStorageKeys, viewOptions } from './constants';\nimport { useFolderInfo } from './hooks/useFolderInfo';\nimport { useFolderNavigation } from './hooks/useFolderNavigation';\nimport { useInfiniteAssets } from './hooks/useInfiniteAssets';\n\nimport type { UploadFileInfo } from '../../../../../shared/contracts/files';\n\nconst INTERSECTION_OPTIONS: IntersectionObserverInit = { threshold: 0.1 };\n\n/* -------------------------------------------------------------------------------------------------\n * AssetsView\n * -----------------------------------------------------------------------------------------------*/\n\ninterface AssetsViewProps {\n  view: number;\n  folderId: number | null;\n  onAssetItemClick: (assetId: number) => void;\n  onAddAssets: () => void;\n}\n\nconst AssetsView = ({ view, folderId, onAssetItemClick, onAddAssets }: AssetsViewProps) => {\n  const { formatMessage } = useIntl();\n  const {\n    assets,\n    isLoading: isLoadingAssets,\n    isFetchingMore,\n    hasNextPage,\n    fetchNextPage,\n    error,\n  } = useInfiniteAssets({ folder: folderId });\n  const { data: folders = [], isLoading: isLoadingFolders } = useGetFoldersQuery({\n    parentId: folderId,\n  });\n\n  const isGridView = view === viewOptions.GRID;\n  const isLoading = isLoadingAssets || isLoadingFolders;\n\n  const loadMoreRef = useElementOnScreen<HTMLDivElement>(\n    useCallback(\n      (isVisible) => {\n        if (isVisible && hasNextPage && !isFetchingMore) {\n          fetchNextPage();\n        }\n      },\n      [hasNextPage, isFetchingMore, fetchNextPage]\n    ),\n    INTERSECTION_OPTIONS\n  );\n\n  if (isLoading) {\n    return (\n      <Flex justifyContent=\"center\" padding={8}>\n        <Loader>{formatMessage({ id: 'app.loading', defaultMessage: 'Loading...' })}</Loader>\n      </Flex>\n    );\n  }\n\n  if (error) {\n    return (\n      <Box padding={8}>\n        <Typography textColor=\"danger600\">\n          {formatMessage({\n            id: getTranslationKey('list.assets.error'),\n            defaultMessage: 'An error occurred while fetching assets.',\n          })}\n        </Typography>\n      </Box>\n    );\n  }\n\n  if (folders.length === 0 && assets.length === 0) {\n    return <EmptyState onAddAssets={onAddAssets} />;\n  }\n  return (\n    <>\n      {isGridView ? (\n        <AssetsGrid folders={folders} assets={assets} onAssetItemClick={onAssetItemClick} />\n      ) : (\n        <AssetsTable assets={assets} folders={folders} onAssetItemClick={onAssetItemClick} />\n      )}\n      <div ref={loadMoreRef} style={{ height: 1 }} />\n      {isFetchingMore && (\n        <Flex justifyContent=\"center\" padding={4}>\n          <Loader>\n            {formatMessage({\n              id: getTranslationKey('list.assets.loading-more'),\n              defaultMessage: 'Loading more assets...',\n            })}\n          </Loader>\n        </Flex>\n      )}\n    </>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * AssetsPage\n * -----------------------------------------------------------------------------------------------*/\n\nconst StyledToggleGroup = styled(ToggleGroup.Root)`\n  display: flex;\n  border: 1px solid ${({ theme }) => theme.colors.neutral200};\n  border-radius: ${({ theme }) => theme.borderRadius};\n  overflow: hidden;\n`;\n\nconst StyledToggleItem = styled(ToggleGroup.Item)`\n  display: flex;\n  align-items: center;\n  gap: ${({ theme }) => theme.spaces[2]};\n  padding: ${({ theme }) => `${theme.spaces[2]} ${theme.spaces[4]}`};\n  border: none;\n  background: ${({ theme }) => theme.colors.neutral0};\n  color: ${({ theme }) => theme.colors.neutral800};\n  cursor: pointer;\n  font-size: ${({ theme }) => theme.fontSizes[1]};\n  font-weight: ${({ theme }) => theme.fontWeights.semiBold};\n\n  &:hover {\n    background: ${({ theme }) => theme.colors.primary100};\n  }\n\n  &[data-state='on'] {\n    background: ${({ theme }) => theme.colors.neutral150};\n  }\n\n  svg {\n    width: 1.6rem;\n    height: 1.6rem;\n  }\n`;\n\nconst HeaderWrapper = styled(Box)`\n  [data-strapi-header] {\n    background: ${({ theme }) => theme.colors.neutral0};\n\n    h1 {\n      font-size: 1.8rem;\n    }\n  }\n`;\n\nexport const AssetsPage = () => {\n  const { formatMessage } = useIntl();\n  const { openDetails } = useAssetDetailsParam();\n\n  const { currentFolderId, navigateToFolderId, navigateToRoot } = useFolderNavigation();\n  // Deleted or missing folders (404) need a fetch — handled here, not in\n  // `useFolderNavigation` (which only strips malformed ?folder= values).\n  const { error: currentFolderError } = useGetFolderQuery(\n    { id: currentFolderId! },\n    { skip: currentFolderId === null }\n  );\n\n  useEffect(() => {\n    if (currentFolderError?.name === 'NotFoundError') {\n      navigateToRoot();\n    }\n  }, [currentFolderError, navigateToRoot]);\n  const { title, itemCount } = useFolderInfo(currentFolderId);\n  const itemCountLabel = formatMessage(\n    {\n      id: getTranslationKey('header.content.item-count'),\n      defaultMessage: '{count, plural, =1 {# item} other {# items}}',\n    },\n    { count: itemCount }\n  );\n  const pageHeaderTitle = title\n    ? `${title} (${itemCountLabel})`\n    : formatMessage({ id: 'app.loading', defaultMessage: 'Loading...' });\n\n  const [isCreateFolderDialogOpen, setIsCreateFolderDialogOpen] = useState(false);\n\n  // View state\n  const [view, setView] = usePersistentState(localStorageKeys.view, viewOptions.GRID);\n  const isGridView = view === viewOptions.GRID;\n\n  // Dialog state\n  const [isUrlDialogOpen, setIsUrlDialogOpen] = useState(false);\n\n  // Refs\n  const fileInputRef = useRef<HTMLInputElement>(null);\n  const uploadDropZoneRef = useRef<HTMLDivElement>(null);\n\n  // Upload handlers\n  const [uploadFiles] = useUploadFilesMutation();\n  const [uploadFromUrls] = useUploadFromUrlsMutation();\n\n  const uploadFilesToFolder = async (files: globalThis.File[], folderId: number | null) => {\n    if (files.length === 0) return;\n\n    const formData = new FormData();\n    const fileInfoArray: UploadFileInfo[] = [];\n\n    files.forEach((file) => {\n      formData.append('files', file);\n      fileInfoArray.push({\n        name: file.name,\n        caption: null,\n        alternativeText: null,\n        folder: folderId,\n      });\n    });\n\n    formData.append('fileInfo', JSON.stringify(fileInfoArray));\n    try {\n      await uploadFiles({ formData, totalFiles: files.length }).unwrap();\n    } catch (error) {\n      // Error is already dispatched to store from the API queryFn\n    }\n  };\n\n  const handleFileSelect = () => {\n    fileInputRef.current?.click();\n  };\n\n  const handleFileChange = async (e: ChangeEvent<HTMLInputElement>) => {\n    const files = e.target.files;\n    if (files && files.length > 0) {\n      await uploadFilesToFolder(Array.from(files), currentFolderId);\n    }\n    e.target.value = '';\n  };\n\n  const handleDrop = async (files: globalThis.File[]) => {\n    await uploadFilesToFolder(files, currentFolderId);\n  };\n\n  const handleUrlUpload = async (urls: string[]) => {\n    try {\n      await uploadFromUrls({ urls, folderId: currentFolderId }).unwrap();\n    } catch (error) {\n      // Error is already dispatched to store from the API queryFn\n    }\n  };\n\n  return (\n    <>\n      <UploadDropZoneProvider onDrop={handleDrop}>\n        <AssetsDndProvider>\n          <Box ref={uploadDropZoneRef}>\n            <Layouts.Root\n              minHeight=\"100vh\"\n              background=\"neutral0\"\n              sideNav={\n                <FolderTree currentFolderId={currentFolderId} onSelectFolder={navigateToFolderId} />\n              }\n            >\n              <VisuallyHidden>\n                <input type=\"file\" ref={fileInputRef} onChange={handleFileChange} multiple />\n              </VisuallyHidden>\n\n              <HeaderWrapper>\n                <Layouts.Header\n                  title={pageHeaderTitle}\n                  primaryAction={\n                    <SimpleMenu\n                      popoverPlacement=\"bottom-end\"\n                      variant=\"default\"\n                      endIcon={<ChevronDown />}\n                      label={formatMessage({ id: getTranslationKey('new'), defaultMessage: 'New' })}\n                    >\n                      <MenuItem\n                        onSelect={() => setIsCreateFolderDialogOpen(true)}\n                        startIcon={<Folder />}\n                      >\n                        {formatMessage({\n                          id: getTranslationKey('folder.create.title'),\n                          defaultMessage: 'New folder',\n                        })}\n                      </MenuItem>\n                      <MenuItem onSelect={handleFileSelect} startIcon={<Files />}>\n                        {formatMessage({\n                          id: getTranslationKey('import-files'),\n                          defaultMessage: 'Import files',\n                        })}\n                      </MenuItem>\n                      <MenuItem onSelect={() => setIsUrlDialogOpen(true)} startIcon={<Link />}>\n                        {formatMessage({\n                          id: getTranslationKey('import-from-url'),\n                          defaultMessage: 'Import from URL',\n                        })}\n                      </MenuItem>\n                    </SimpleMenu>\n                  }\n                  subtitle={\n                    <Flex justifyContent=\"space-between\" alignItems=\"center\" gap={4} width=\"100%\">\n                      <Flex gap={4} alignItems=\"center\">\n                        TODO: Filters and search\n                      </Flex>\n\n                      <Flex gap={4} alignItems=\"center\">\n                        <Box>TODO: Sort</Box>\n                        <StyledToggleGroup\n                          type=\"single\"\n                          value={isGridView ? 'grid' : 'table'}\n                          onValueChange={(value) =>\n                            value &&\n                            setView(value === 'grid' ? viewOptions.GRID : viewOptions.TABLE)\n                          }\n                          aria-label={formatMessage({\n                            id: getTranslationKey('view.switch.label'),\n                            defaultMessage: 'View options',\n                          })}\n                        >\n                          <StyledToggleItem\n                            value=\"table\"\n                            aria-label={formatMessage({\n                              id: getTranslationKey('view.table'),\n                              defaultMessage: 'Table view',\n                            })}\n                          >\n                            <List />\n                            {formatMessage({\n                              id: getTranslationKey('view.table'),\n                              defaultMessage: 'Table view',\n                            })}\n                          </StyledToggleItem>\n                          <StyledToggleItem\n                            value=\"grid\"\n                            aria-label={formatMessage({\n                              id: getTranslationKey('view.grid'),\n                              defaultMessage: 'Grid view',\n                            })}\n                          >\n                            <GridIcon />\n                            {formatMessage({\n                              id: getTranslationKey('view.grid'),\n                              defaultMessage: 'Grid view',\n                            })}\n                          </StyledToggleItem>\n                        </StyledToggleGroup>\n                      </Flex>\n                    </Flex>\n                  }\n                />\n              </HeaderWrapper>\n\n              <Layouts.Content>\n                <DropZoneWithOverlay>\n                  <DropFilesMessage uploadDropZoneRef={uploadDropZoneRef} folderName={title} />\n                  <AssetsView\n                    view={view}\n                    folderId={currentFolderId}\n                    onAssetItemClick={openDetails}\n                    onAddAssets={handleFileSelect}\n                  />\n                </DropZoneWithOverlay>\n              </Layouts.Content>\n            </Layouts.Root>\n          </Box>\n        </AssetsDndProvider>\n      </UploadDropZoneProvider>\n      <CreateFolderDialog\n        open={isCreateFolderDialogOpen}\n        folderName={title}\n        parentFolderId={currentFolderId}\n        onClose={() => setIsCreateFolderDialogOpen(false)}\n      />\n      <ImportFromUrlDialog\n        open={isUrlDialogOpen}\n        onClose={() => setIsUrlDialogOpen(false)}\n        onUpload={handleUrlUpload}\n      />\n      <AssetDetailsDrawer />\n    </>\n  );\n};\n"],"names":["INTERSECTION_OPTIONS","threshold","AssetsView","view","folderId","onAssetItemClick","onAddAssets","formatMessage","useIntl","assets","isLoading","isLoadingAssets","isFetchingMore","hasNextPage","fetchNextPage","error","useInfiniteAssets","folder","data","folders","isLoadingFolders","useGetFoldersQuery","parentId","isGridView","viewOptions","GRID","loadMoreRef","useElementOnScreen","useCallback","isVisible","_jsx","Flex","justifyContent","padding","Loader","id","defaultMessage","Box","Typography","textColor","getTranslationKey","length","EmptyState","_jsxs","_Fragment","AssetsGrid","AssetsTable","div","ref","style","height","StyledToggleGroup","styled","ToggleGroup","Root","theme","colors","neutral200","borderRadius","StyledToggleItem","Item","spaces","neutral0","neutral800","fontSizes","fontWeights","semiBold","primary100","neutral150","HeaderWrapper","AssetsPage","openDetails","useAssetDetailsParam","currentFolderId","navigateToFolderId","navigateToRoot","useFolderNavigation","currentFolderError","useGetFolderQuery","skip","useEffect","name","title","itemCount","useFolderInfo","itemCountLabel","count","pageHeaderTitle","isCreateFolderDialogOpen","setIsCreateFolderDialogOpen","useState","setView","usePersistentState","localStorageKeys","isUrlDialogOpen","setIsUrlDialogOpen","fileInputRef","useRef","uploadDropZoneRef","uploadFiles","useUploadFilesMutation","uploadFromUrls","useUploadFromUrlsMutation","uploadFilesToFolder","files","formData","FormData","fileInfoArray","forEach","file","append","push","caption","alternativeText","JSON","stringify","totalFiles","unwrap","handleFileSelect","current","click","handleFileChange","e","target","Array","from","value","handleDrop","handleUrlUpload","urls","UploadDropZoneProvider","onDrop","AssetsDndProvider","Layouts","minHeight","background","sideNav","FolderTree","onSelectFolder","VisuallyHidden","input","type","onChange","multiple","Header","primaryAction","SimpleMenu","popoverPlacement","variant","endIcon","ChevronDown","label","MenuItem","onSelect","startIcon","Folder","Files","Link","subtitle","alignItems","gap","width","onValueChange","TABLE","aria-label","List","GridIcon","Content","DropZoneWithOverlay","DropFilesMessage","folderName","CreateFolderDialog","open","parentFolderId","onClose","ImportFromUrlDialog","onUpload","AssetDetailsDrawer"],"mappings":"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"}

package/dist/admin/future/pages/Assets/AssetsPage.mjs

@@ -16,6 +16,7 @@ import { CreateFolderDialog } from './components/CreateFolderDialog.mjs';
 import { AssetsDndProvider } from './components/Dnd/AssetsDndProvider.mjs';
 import { DropZoneWithOverlay, DropFilesMessage } from './components/DropZone/UploadDropZone.mjs';
 import { UploadDropZoneProvider } from './components/DropZone/UploadDropZoneContext.mjs';
+import { EmptyState } from './components/EmptyState.mjs';
 import { FolderTree } from './components/FolderTree/FolderTree.mjs';
 import { ImportFromUrlDialog } from './components/ImportFromUrlDialog.mjs';
 import { localStorageKeys, viewOptions } from './constants.mjs';
@@ -26,7 +27,7 @@ import { useInfiniteAssets } from './hooks/useInfiniteAssets.mjs';
 const INTERSECTION_OPTIONS = {
     threshold: 0.1
 };
-const AssetsView = ({ view, folderId, onAssetItemClick })=>{
+const AssetsView = ({ view, folderId, onAssetItemClick, onAddAssets })=>{
     const { formatMessage } = useIntl();
     const { assets, isLoading: isLoadingAssets, isFetchingMore, hasNextPage, fetchNextPage, error } = useInfiniteAssets({
         folder: folderId
@@ -70,15 +71,8 @@ const AssetsView = ({ view, folderId, onAssetItemClick })=>{
         });
     }
     if (folders.length === 0 && assets.length === 0) {
-        return /*#__PURE__*/ jsx(Box, {
-            padding: 8,
-            children: /*#__PURE__*/ jsx(Typography, {
-                textColor: "neutral600",
-                children: formatMessage({
-                    id: 'app.components.EmptyStateLayout.content-document',
-                    defaultMessage: 'No content found'
-                })
-            })
+        return /*#__PURE__*/ jsx(EmptyState, {
+            onAddAssets: onAddAssets
         });
     }
     return /*#__PURE__*/ jsxs(Fragment, {
@@ -375,7 +369,8 @@ const AssetsPage = ()=>{
                                             /*#__PURE__*/ jsx(AssetsView, {
                                                 view: view,
                                                 folderId: currentFolderId,
-                                                onAssetItemClick: openDetails
+                                                onAssetItemClick: openDetails,
+                                                onAddAssets: handleFileSelect
                                             })
                                         ]
                                     })

package/dist/admin/future/pages/Assets/AssetsPage.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"AssetsPage.mjs","sources":["../../../../../admin/src/future/pages/Assets/AssetsPage.tsx"],"sourcesContent":["import { useRef, useCallback, useState, useEffect, type ChangeEvent } from 'react';\n\nimport * as ToggleGroup from '@radix-ui/react-toggle-group';\nimport { Layouts, useElementOnScreen, usePersistentState } from '@strapi/admin/strapi-admin';\nimport {\n  Box,\n  Flex,\n  Loader,\n  MenuItem,\n  SimpleMenu,\n  Typography,\n  VisuallyHidden,\n} from '@strapi/design-system';\nimport { ChevronDown, Files, Folder, GridFour as GridIcon, Link, List } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\n\nimport { useUploadFromUrlsMutation, useUploadFilesMutation } from '../../services/api';\nimport { useGetFolderQuery, useGetFoldersQuery } from '../../services/folders';\nimport { getTranslationKey } from '../../utils/translations';\n\nimport {\n  AssetDetailsDrawer,\n  useAssetDetailsParam,\n} from './components/AssetDetails/AssetDetailsDrawer';\nimport { AssetsGrid } from './components/AssetsGrid';\nimport { AssetsTable } from './components/AssetsTable';\nimport { CreateFolderDialog } from './components/CreateFolderDialog';\nimport { AssetsDndProvider } from './components/Dnd/AssetsDndProvider';\nimport { DropFilesMessage, DropZoneWithOverlay } from './components/DropZone/UploadDropZone';\nimport { UploadDropZoneProvider } from './components/DropZone/UploadDropZoneContext';\nimport { FolderTree } from './components/FolderTree/FolderTree';\nimport { ImportFromUrlDialog } from './components/ImportFromUrlDialog';\nimport { localStorageKeys, viewOptions } from './constants';\nimport { useFolderInfo } from './hooks/useFolderInfo';\nimport { useFolderNavigation } from './hooks/useFolderNavigation';\nimport { useInfiniteAssets } from './hooks/useInfiniteAssets';\n\nimport type { UploadFileInfo } from '../../../../../shared/contracts/files';\n\nconst INTERSECTION_OPTIONS: IntersectionObserverInit = { threshold: 0.1 };\n\n/* -------------------------------------------------------------------------------------------------\n * AssetsView\n * -----------------------------------------------------------------------------------------------*/\n\ninterface AssetsViewProps {\n  view: number;\n  folderId: number | null;\n  onAssetItemClick: (assetId: number) => void;\n}\n\nconst AssetsView = ({ view, folderId, onAssetItemClick }: AssetsViewProps) => {\n  const { formatMessage } = useIntl();\n  const {\n    assets,\n    isLoading: isLoadingAssets,\n    isFetchingMore,\n    hasNextPage,\n    fetchNextPage,\n    error,\n  } = useInfiniteAssets({ folder: folderId });\n  const { data: folders = [], isLoading: isLoadingFolders } = useGetFoldersQuery({\n    parentId: folderId,\n  });\n\n  const isGridView = view === viewOptions.GRID;\n  const isLoading = isLoadingAssets || isLoadingFolders;\n\n  const loadMoreRef = useElementOnScreen<HTMLDivElement>(\n    useCallback(\n      (isVisible) => {\n        if (isVisible && hasNextPage && !isFetchingMore) {\n          fetchNextPage();\n        }\n      },\n      [hasNextPage, isFetchingMore, fetchNextPage]\n    ),\n    INTERSECTION_OPTIONS\n  );\n\n  if (isLoading) {\n    return (\n      <Flex justifyContent=\"center\" padding={8}>\n        <Loader>{formatMessage({ id: 'app.loading', defaultMessage: 'Loading...' })}</Loader>\n      </Flex>\n    );\n  }\n\n  if (error) {\n    return (\n      <Box padding={8}>\n        <Typography textColor=\"danger600\">\n          {formatMessage({\n            id: getTranslationKey('list.assets.error'),\n            defaultMessage: 'An error occurred while fetching assets.',\n          })}\n        </Typography>\n      </Box>\n    );\n  }\n\n  if (folders.length === 0 && assets.length === 0) {\n    return (\n      <Box padding={8}>\n        <Typography textColor=\"neutral600\">\n          {formatMessage({\n            id: 'app.components.EmptyStateLayout.content-document',\n            defaultMessage: 'No content found',\n          })}\n        </Typography>\n      </Box>\n    );\n  }\n  return (\n    <>\n      {isGridView ? (\n        <AssetsGrid folders={folders} assets={assets} onAssetItemClick={onAssetItemClick} />\n      ) : (\n        <AssetsTable assets={assets} folders={folders} onAssetItemClick={onAssetItemClick} />\n      )}\n      <div ref={loadMoreRef} style={{ height: 1 }} />\n      {isFetchingMore && (\n        <Flex justifyContent=\"center\" padding={4}>\n          <Loader>\n            {formatMessage({\n              id: getTranslationKey('list.assets.loading-more'),\n              defaultMessage: 'Loading more assets...',\n            })}\n          </Loader>\n        </Flex>\n      )}\n    </>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * AssetsPage\n * -----------------------------------------------------------------------------------------------*/\n\nconst StyledToggleGroup = styled(ToggleGroup.Root)`\n  display: flex;\n  border: 1px solid ${({ theme }) => theme.colors.neutral200};\n  border-radius: ${({ theme }) => theme.borderRadius};\n  overflow: hidden;\n`;\n\nconst StyledToggleItem = styled(ToggleGroup.Item)`\n  display: flex;\n  align-items: center;\n  gap: ${({ theme }) => theme.spaces[2]};\n  padding: ${({ theme }) => `${theme.spaces[2]} ${theme.spaces[4]}`};\n  border: none;\n  background: ${({ theme }) => theme.colors.neutral0};\n  color: ${({ theme }) => theme.colors.neutral800};\n  cursor: pointer;\n  font-size: ${({ theme }) => theme.fontSizes[1]};\n  font-weight: ${({ theme }) => theme.fontWeights.semiBold};\n\n  &:hover {\n    background: ${({ theme }) => theme.colors.primary100};\n  }\n\n  &[data-state='on'] {\n    background: ${({ theme }) => theme.colors.neutral150};\n  }\n\n  svg {\n    width: 1.6rem;\n    height: 1.6rem;\n  }\n`;\n\nconst HeaderWrapper = styled(Box)`\n  [data-strapi-header] {\n    background: ${({ theme }) => theme.colors.neutral0};\n\n    h1 {\n      font-size: 1.8rem;\n    }\n  }\n`;\n\nexport const AssetsPage = () => {\n  const { formatMessage } = useIntl();\n  const { openDetails } = useAssetDetailsParam();\n\n  const { currentFolderId, navigateToFolderId, navigateToRoot } = useFolderNavigation();\n  // Deleted or missing folders (404) need a fetch — handled here, not in\n  // `useFolderNavigation` (which only strips malformed ?folder= values).\n  const { error: currentFolderError } = useGetFolderQuery(\n    { id: currentFolderId! },\n    { skip: currentFolderId === null }\n  );\n\n  useEffect(() => {\n    if (currentFolderError?.name === 'NotFoundError') {\n      navigateToRoot();\n    }\n  }, [currentFolderError, navigateToRoot]);\n  const { title, itemCount } = useFolderInfo(currentFolderId);\n  const itemCountLabel = formatMessage(\n    {\n      id: getTranslationKey('header.content.item-count'),\n      defaultMessage: '{count, plural, =1 {# item} other {# items}}',\n    },\n    { count: itemCount }\n  );\n  const pageHeaderTitle = title\n    ? `${title} (${itemCountLabel})`\n    : formatMessage({ id: 'app.loading', defaultMessage: 'Loading...' });\n\n  const [isCreateFolderDialogOpen, setIsCreateFolderDialogOpen] = useState(false);\n\n  // View state\n  const [view, setView] = usePersistentState(localStorageKeys.view, viewOptions.GRID);\n  const isGridView = view === viewOptions.GRID;\n\n  // Dialog state\n  const [isUrlDialogOpen, setIsUrlDialogOpen] = useState(false);\n\n  // Refs\n  const fileInputRef = useRef<HTMLInputElement>(null);\n  const uploadDropZoneRef = useRef<HTMLDivElement>(null);\n\n  // Upload handlers\n  const [uploadFiles] = useUploadFilesMutation();\n  const [uploadFromUrls] = useUploadFromUrlsMutation();\n\n  const uploadFilesToFolder = async (files: globalThis.File[], folderId: number | null) => {\n    if (files.length === 0) return;\n\n    const formData = new FormData();\n    const fileInfoArray: UploadFileInfo[] = [];\n\n    files.forEach((file) => {\n      formData.append('files', file);\n      fileInfoArray.push({\n        name: file.name,\n        caption: null,\n        alternativeText: null,\n        folder: folderId,\n      });\n    });\n\n    formData.append('fileInfo', JSON.stringify(fileInfoArray));\n    try {\n      await uploadFiles({ formData, totalFiles: files.length }).unwrap();\n    } catch (error) {\n      // Error is already dispatched to store from the API queryFn\n    }\n  };\n\n  const handleFileSelect = () => {\n    fileInputRef.current?.click();\n  };\n\n  const handleFileChange = async (e: ChangeEvent<HTMLInputElement>) => {\n    const files = e.target.files;\n    if (files && files.length > 0) {\n      await uploadFilesToFolder(Array.from(files), currentFolderId);\n    }\n    e.target.value = '';\n  };\n\n  const handleDrop = async (files: globalThis.File[]) => {\n    await uploadFilesToFolder(files, currentFolderId);\n  };\n\n  const handleUrlUpload = async (urls: string[]) => {\n    try {\n      await uploadFromUrls({ urls, folderId: currentFolderId }).unwrap();\n    } catch (error) {\n      // Error is already dispatched to store from the API queryFn\n    }\n  };\n\n  return (\n    <>\n      <UploadDropZoneProvider onDrop={handleDrop}>\n        <AssetsDndProvider>\n          <Box ref={uploadDropZoneRef}>\n            <Layouts.Root\n              minHeight=\"100vh\"\n              background=\"neutral0\"\n              sideNav={\n                <FolderTree currentFolderId={currentFolderId} onSelectFolder={navigateToFolderId} />\n              }\n            >\n              <VisuallyHidden>\n                <input type=\"file\" ref={fileInputRef} onChange={handleFileChange} multiple />\n              </VisuallyHidden>\n\n              <HeaderWrapper>\n                <Layouts.Header\n                  title={pageHeaderTitle}\n                  primaryAction={\n                    <SimpleMenu\n                      popoverPlacement=\"bottom-end\"\n                      variant=\"default\"\n                      endIcon={<ChevronDown />}\n                      label={formatMessage({ id: getTranslationKey('new'), defaultMessage: 'New' })}\n                    >\n                      <MenuItem\n                        onSelect={() => setIsCreateFolderDialogOpen(true)}\n                        startIcon={<Folder />}\n                      >\n                        {formatMessage({\n                          id: getTranslationKey('folder.create.title'),\n                          defaultMessage: 'New folder',\n                        })}\n                      </MenuItem>\n                      <MenuItem onSelect={handleFileSelect} startIcon={<Files />}>\n                        {formatMessage({\n                          id: getTranslationKey('import-files'),\n                          defaultMessage: 'Import files',\n                        })}\n                      </MenuItem>\n                      <MenuItem onSelect={() => setIsUrlDialogOpen(true)} startIcon={<Link />}>\n                        {formatMessage({\n                          id: getTranslationKey('import-from-url'),\n                          defaultMessage: 'Import from URL',\n                        })}\n                      </MenuItem>\n                    </SimpleMenu>\n                  }\n                  subtitle={\n                    <Flex justifyContent=\"space-between\" alignItems=\"center\" gap={4} width=\"100%\">\n                      <Flex gap={4} alignItems=\"center\">\n                        TODO: Filters and search\n                      </Flex>\n\n                      <Flex gap={4} alignItems=\"center\">\n                        <Box>TODO: Sort</Box>\n                        <StyledToggleGroup\n                          type=\"single\"\n                          value={isGridView ? 'grid' : 'table'}\n                          onValueChange={(value) =>\n                            value &&\n                            setView(value === 'grid' ? viewOptions.GRID : viewOptions.TABLE)\n                          }\n                          aria-label={formatMessage({\n                            id: getTranslationKey('view.switch.label'),\n                            defaultMessage: 'View options',\n                          })}\n                        >\n                          <StyledToggleItem\n                            value=\"table\"\n                            aria-label={formatMessage({\n                              id: getTranslationKey('view.table'),\n                              defaultMessage: 'Table view',\n                            })}\n                          >\n                            <List />\n                            {formatMessage({\n                              id: getTranslationKey('view.table'),\n                              defaultMessage: 'Table view',\n                            })}\n                          </StyledToggleItem>\n                          <StyledToggleItem\n                            value=\"grid\"\n                            aria-label={formatMessage({\n                              id: getTranslationKey('view.grid'),\n                              defaultMessage: 'Grid view',\n                            })}\n                          >\n                            <GridIcon />\n                            {formatMessage({\n                              id: getTranslationKey('view.grid'),\n                              defaultMessage: 'Grid view',\n                            })}\n                          </StyledToggleItem>\n                        </StyledToggleGroup>\n                      </Flex>\n                    </Flex>\n                  }\n                />\n              </HeaderWrapper>\n\n              <Layouts.Content>\n                <DropZoneWithOverlay>\n                  <DropFilesMessage uploadDropZoneRef={uploadDropZoneRef} folderName={title} />\n                  <AssetsView\n                    view={view}\n                    folderId={currentFolderId}\n                    onAssetItemClick={openDetails}\n                  />\n                </DropZoneWithOverlay>\n              </Layouts.Content>\n            </Layouts.Root>\n          </Box>\n        </AssetsDndProvider>\n      </UploadDropZoneProvider>\n      <CreateFolderDialog\n        open={isCreateFolderDialogOpen}\n        folderName={title}\n        parentFolderId={currentFolderId}\n        onClose={() => setIsCreateFolderDialogOpen(false)}\n      />\n      <ImportFromUrlDialog\n        open={isUrlDialogOpen}\n        onClose={() => setIsUrlDialogOpen(false)}\n        onUpload={handleUrlUpload}\n      />\n      <AssetDetailsDrawer />\n    </>\n  );\n};\n"],"names":["INTERSECTION_OPTIONS","threshold","AssetsView","view","folderId","onAssetItemClick","formatMessage","useIntl","assets","isLoading","isLoadingAssets","isFetchingMore","hasNextPage","fetchNextPage","error","useInfiniteAssets","folder","data","folders","isLoadingFolders","useGetFoldersQuery","parentId","isGridView","viewOptions","GRID","loadMoreRef","useElementOnScreen","useCallback","isVisible","_jsx","Flex","justifyContent","padding","Loader","id","defaultMessage","Box","Typography","textColor","getTranslationKey","length","_jsxs","_Fragment","AssetsGrid","AssetsTable","div","ref","style","height","StyledToggleGroup","styled","ToggleGroup","Root","theme","colors","neutral200","borderRadius","StyledToggleItem","Item","spaces","neutral0","neutral800","fontSizes","fontWeights","semiBold","primary100","neutral150","HeaderWrapper","AssetsPage","openDetails","useAssetDetailsParam","currentFolderId","navigateToFolderId","navigateToRoot","useFolderNavigation","currentFolderError","useGetFolderQuery","skip","useEffect","name","title","itemCount","useFolderInfo","itemCountLabel","count","pageHeaderTitle","isCreateFolderDialogOpen","setIsCreateFolderDialogOpen","useState","setView","usePersistentState","localStorageKeys","isUrlDialogOpen","setIsUrlDialogOpen","fileInputRef","useRef","uploadDropZoneRef","uploadFiles","useUploadFilesMutation","uploadFromUrls","useUploadFromUrlsMutation","uploadFilesToFolder","files","formData","FormData","fileInfoArray","forEach","file","append","push","caption","alternativeText","JSON","stringify","totalFiles","unwrap","handleFileSelect","current","click","handleFileChange","e","target","Array","from","value","handleDrop","handleUrlUpload","urls","UploadDropZoneProvider","onDrop","AssetsDndProvider","Layouts","minHeight","background","sideNav","FolderTree","onSelectFolder","VisuallyHidden","input","type","onChange","multiple","Header","primaryAction","SimpleMenu","popoverPlacement","variant","endIcon","ChevronDown","label","MenuItem","onSelect","startIcon","Folder","Files","Link","subtitle","alignItems","gap","width","onValueChange","TABLE","aria-label","List","GridIcon","Content","DropZoneWithOverlay","DropFilesMessage","folderName","CreateFolderDialog","open","parentFolderId","onClose","ImportFromUrlDialog","onUpload","AssetDetailsDrawer"],"mappings":"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"}
+{"version":3,"file":"AssetsPage.mjs","sources":["../../../../../admin/src/future/pages/Assets/AssetsPage.tsx"],"sourcesContent":["import { useRef, useCallback, useState, useEffect, type ChangeEvent } from 'react';\n\nimport * as ToggleGroup from '@radix-ui/react-toggle-group';\nimport { Layouts, useElementOnScreen, usePersistentState } from '@strapi/admin/strapi-admin';\nimport {\n  Box,\n  Flex,\n  Loader,\n  MenuItem,\n  SimpleMenu,\n  Typography,\n  VisuallyHidden,\n} from '@strapi/design-system';\nimport { ChevronDown, Files, Folder, GridFour as GridIcon, Link, List } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\n\nimport { useUploadFromUrlsMutation, useUploadFilesMutation } from '../../services/api';\nimport { useGetFolderQuery, useGetFoldersQuery } from '../../services/folders';\nimport { getTranslationKey } from '../../utils/translations';\n\nimport {\n  AssetDetailsDrawer,\n  useAssetDetailsParam,\n} from './components/AssetDetails/AssetDetailsDrawer';\nimport { AssetsGrid } from './components/AssetsGrid';\nimport { AssetsTable } from './components/AssetsTable';\nimport { CreateFolderDialog } from './components/CreateFolderDialog';\nimport { AssetsDndProvider } from './components/Dnd/AssetsDndProvider';\nimport { DropFilesMessage, DropZoneWithOverlay } from './components/DropZone/UploadDropZone';\nimport { UploadDropZoneProvider } from './components/DropZone/UploadDropZoneContext';\nimport { EmptyState } from './components/EmptyState';\nimport { FolderTree } from './components/FolderTree/FolderTree';\nimport { ImportFromUrlDialog } from './components/ImportFromUrlDialog';\nimport { localStorageKeys, viewOptions } from './constants';\nimport { useFolderInfo } from './hooks/useFolderInfo';\nimport { useFolderNavigation } from './hooks/useFolderNavigation';\nimport { useInfiniteAssets } from './hooks/useInfiniteAssets';\n\nimport type { UploadFileInfo } from '../../../../../shared/contracts/files';\n\nconst INTERSECTION_OPTIONS: IntersectionObserverInit = { threshold: 0.1 };\n\n/* -------------------------------------------------------------------------------------------------\n * AssetsView\n * -----------------------------------------------------------------------------------------------*/\n\ninterface AssetsViewProps {\n  view: number;\n  folderId: number | null;\n  onAssetItemClick: (assetId: number) => void;\n  onAddAssets: () => void;\n}\n\nconst AssetsView = ({ view, folderId, onAssetItemClick, onAddAssets }: AssetsViewProps) => {\n  const { formatMessage } = useIntl();\n  const {\n    assets,\n    isLoading: isLoadingAssets,\n    isFetchingMore,\n    hasNextPage,\n    fetchNextPage,\n    error,\n  } = useInfiniteAssets({ folder: folderId });\n  const { data: folders = [], isLoading: isLoadingFolders } = useGetFoldersQuery({\n    parentId: folderId,\n  });\n\n  const isGridView = view === viewOptions.GRID;\n  const isLoading = isLoadingAssets || isLoadingFolders;\n\n  const loadMoreRef = useElementOnScreen<HTMLDivElement>(\n    useCallback(\n      (isVisible) => {\n        if (isVisible && hasNextPage && !isFetchingMore) {\n          fetchNextPage();\n        }\n      },\n      [hasNextPage, isFetchingMore, fetchNextPage]\n    ),\n    INTERSECTION_OPTIONS\n  );\n\n  if (isLoading) {\n    return (\n      <Flex justifyContent=\"center\" padding={8}>\n        <Loader>{formatMessage({ id: 'app.loading', defaultMessage: 'Loading...' })}</Loader>\n      </Flex>\n    );\n  }\n\n  if (error) {\n    return (\n      <Box padding={8}>\n        <Typography textColor=\"danger600\">\n          {formatMessage({\n            id: getTranslationKey('list.assets.error'),\n            defaultMessage: 'An error occurred while fetching assets.',\n          })}\n        </Typography>\n      </Box>\n    );\n  }\n\n  if (folders.length === 0 && assets.length === 0) {\n    return <EmptyState onAddAssets={onAddAssets} />;\n  }\n  return (\n    <>\n      {isGridView ? (\n        <AssetsGrid folders={folders} assets={assets} onAssetItemClick={onAssetItemClick} />\n      ) : (\n        <AssetsTable assets={assets} folders={folders} onAssetItemClick={onAssetItemClick} />\n      )}\n      <div ref={loadMoreRef} style={{ height: 1 }} />\n      {isFetchingMore && (\n        <Flex justifyContent=\"center\" padding={4}>\n          <Loader>\n            {formatMessage({\n              id: getTranslationKey('list.assets.loading-more'),\n              defaultMessage: 'Loading more assets...',\n            })}\n          </Loader>\n        </Flex>\n      )}\n    </>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * AssetsPage\n * -----------------------------------------------------------------------------------------------*/\n\nconst StyledToggleGroup = styled(ToggleGroup.Root)`\n  display: flex;\n  border: 1px solid ${({ theme }) => theme.colors.neutral200};\n  border-radius: ${({ theme }) => theme.borderRadius};\n  overflow: hidden;\n`;\n\nconst StyledToggleItem = styled(ToggleGroup.Item)`\n  display: flex;\n  align-items: center;\n  gap: ${({ theme }) => theme.spaces[2]};\n  padding: ${({ theme }) => `${theme.spaces[2]} ${theme.spaces[4]}`};\n  border: none;\n  background: ${({ theme }) => theme.colors.neutral0};\n  color: ${({ theme }) => theme.colors.neutral800};\n  cursor: pointer;\n  font-size: ${({ theme }) => theme.fontSizes[1]};\n  font-weight: ${({ theme }) => theme.fontWeights.semiBold};\n\n  &:hover {\n    background: ${({ theme }) => theme.colors.primary100};\n  }\n\n  &[data-state='on'] {\n    background: ${({ theme }) => theme.colors.neutral150};\n  }\n\n  svg {\n    width: 1.6rem;\n    height: 1.6rem;\n  }\n`;\n\nconst HeaderWrapper = styled(Box)`\n  [data-strapi-header] {\n    background: ${({ theme }) => theme.colors.neutral0};\n\n    h1 {\n      font-size: 1.8rem;\n    }\n  }\n`;\n\nexport const AssetsPage = () => {\n  const { formatMessage } = useIntl();\n  const { openDetails } = useAssetDetailsParam();\n\n  const { currentFolderId, navigateToFolderId, navigateToRoot } = useFolderNavigation();\n  // Deleted or missing folders (404) need a fetch — handled here, not in\n  // `useFolderNavigation` (which only strips malformed ?folder= values).\n  const { error: currentFolderError } = useGetFolderQuery(\n    { id: currentFolderId! },\n    { skip: currentFolderId === null }\n  );\n\n  useEffect(() => {\n    if (currentFolderError?.name === 'NotFoundError') {\n      navigateToRoot();\n    }\n  }, [currentFolderError, navigateToRoot]);\n  const { title, itemCount } = useFolderInfo(currentFolderId);\n  const itemCountLabel = formatMessage(\n    {\n      id: getTranslationKey('header.content.item-count'),\n      defaultMessage: '{count, plural, =1 {# item} other {# items}}',\n    },\n    { count: itemCount }\n  );\n  const pageHeaderTitle = title\n    ? `${title} (${itemCountLabel})`\n    : formatMessage({ id: 'app.loading', defaultMessage: 'Loading...' });\n\n  const [isCreateFolderDialogOpen, setIsCreateFolderDialogOpen] = useState(false);\n\n  // View state\n  const [view, setView] = usePersistentState(localStorageKeys.view, viewOptions.GRID);\n  const isGridView = view === viewOptions.GRID;\n\n  // Dialog state\n  const [isUrlDialogOpen, setIsUrlDialogOpen] = useState(false);\n\n  // Refs\n  const fileInputRef = useRef<HTMLInputElement>(null);\n  const uploadDropZoneRef = useRef<HTMLDivElement>(null);\n\n  // Upload handlers\n  const [uploadFiles] = useUploadFilesMutation();\n  const [uploadFromUrls] = useUploadFromUrlsMutation();\n\n  const uploadFilesToFolder = async (files: globalThis.File[], folderId: number | null) => {\n    if (files.length === 0) return;\n\n    const formData = new FormData();\n    const fileInfoArray: UploadFileInfo[] = [];\n\n    files.forEach((file) => {\n      formData.append('files', file);\n      fileInfoArray.push({\n        name: file.name,\n        caption: null,\n        alternativeText: null,\n        folder: folderId,\n      });\n    });\n\n    formData.append('fileInfo', JSON.stringify(fileInfoArray));\n    try {\n      await uploadFiles({ formData, totalFiles: files.length }).unwrap();\n    } catch (error) {\n      // Error is already dispatched to store from the API queryFn\n    }\n  };\n\n  const handleFileSelect = () => {\n    fileInputRef.current?.click();\n  };\n\n  const handleFileChange = async (e: ChangeEvent<HTMLInputElement>) => {\n    const files = e.target.files;\n    if (files && files.length > 0) {\n      await uploadFilesToFolder(Array.from(files), currentFolderId);\n    }\n    e.target.value = '';\n  };\n\n  const handleDrop = async (files: globalThis.File[]) => {\n    await uploadFilesToFolder(files, currentFolderId);\n  };\n\n  const handleUrlUpload = async (urls: string[]) => {\n    try {\n      await uploadFromUrls({ urls, folderId: currentFolderId }).unwrap();\n    } catch (error) {\n      // Error is already dispatched to store from the API queryFn\n    }\n  };\n\n  return (\n    <>\n      <UploadDropZoneProvider onDrop={handleDrop}>\n        <AssetsDndProvider>\n          <Box ref={uploadDropZoneRef}>\n            <Layouts.Root\n              minHeight=\"100vh\"\n              background=\"neutral0\"\n              sideNav={\n                <FolderTree currentFolderId={currentFolderId} onSelectFolder={navigateToFolderId} />\n              }\n            >\n              <VisuallyHidden>\n                <input type=\"file\" ref={fileInputRef} onChange={handleFileChange} multiple />\n              </VisuallyHidden>\n\n              <HeaderWrapper>\n                <Layouts.Header\n                  title={pageHeaderTitle}\n                  primaryAction={\n                    <SimpleMenu\n                      popoverPlacement=\"bottom-end\"\n                      variant=\"default\"\n                      endIcon={<ChevronDown />}\n                      label={formatMessage({ id: getTranslationKey('new'), defaultMessage: 'New' })}\n                    >\n                      <MenuItem\n                        onSelect={() => setIsCreateFolderDialogOpen(true)}\n                        startIcon={<Folder />}\n                      >\n                        {formatMessage({\n                          id: getTranslationKey('folder.create.title'),\n                          defaultMessage: 'New folder',\n                        })}\n                      </MenuItem>\n                      <MenuItem onSelect={handleFileSelect} startIcon={<Files />}>\n                        {formatMessage({\n                          id: getTranslationKey('import-files'),\n                          defaultMessage: 'Import files',\n                        })}\n                      </MenuItem>\n                      <MenuItem onSelect={() => setIsUrlDialogOpen(true)} startIcon={<Link />}>\n                        {formatMessage({\n                          id: getTranslationKey('import-from-url'),\n                          defaultMessage: 'Import from URL',\n                        })}\n                      </MenuItem>\n                    </SimpleMenu>\n                  }\n                  subtitle={\n                    <Flex justifyContent=\"space-between\" alignItems=\"center\" gap={4} width=\"100%\">\n                      <Flex gap={4} alignItems=\"center\">\n                        TODO: Filters and search\n                      </Flex>\n\n                      <Flex gap={4} alignItems=\"center\">\n                        <Box>TODO: Sort</Box>\n                        <StyledToggleGroup\n                          type=\"single\"\n                          value={isGridView ? 'grid' : 'table'}\n                          onValueChange={(value) =>\n                            value &&\n                            setView(value === 'grid' ? viewOptions.GRID : viewOptions.TABLE)\n                          }\n                          aria-label={formatMessage({\n                            id: getTranslationKey('view.switch.label'),\n                            defaultMessage: 'View options',\n                          })}\n                        >\n                          <StyledToggleItem\n                            value=\"table\"\n                            aria-label={formatMessage({\n                              id: getTranslationKey('view.table'),\n                              defaultMessage: 'Table view',\n                            })}\n                          >\n                            <List />\n                            {formatMessage({\n                              id: getTranslationKey('view.table'),\n                              defaultMessage: 'Table view',\n                            })}\n                          </StyledToggleItem>\n                          <StyledToggleItem\n                            value=\"grid\"\n                            aria-label={formatMessage({\n                              id: getTranslationKey('view.grid'),\n                              defaultMessage: 'Grid view',\n                            })}\n                          >\n                            <GridIcon />\n                            {formatMessage({\n                              id: getTranslationKey('view.grid'),\n                              defaultMessage: 'Grid view',\n                            })}\n                          </StyledToggleItem>\n                        </StyledToggleGroup>\n                      </Flex>\n                    </Flex>\n                  }\n                />\n              </HeaderWrapper>\n\n              <Layouts.Content>\n                <DropZoneWithOverlay>\n                  <DropFilesMessage uploadDropZoneRef={uploadDropZoneRef} folderName={title} />\n                  <AssetsView\n                    view={view}\n                    folderId={currentFolderId}\n                    onAssetItemClick={openDetails}\n                    onAddAssets={handleFileSelect}\n                  />\n                </DropZoneWithOverlay>\n              </Layouts.Content>\n            </Layouts.Root>\n          </Box>\n        </AssetsDndProvider>\n      </UploadDropZoneProvider>\n      <CreateFolderDialog\n        open={isCreateFolderDialogOpen}\n        folderName={title}\n        parentFolderId={currentFolderId}\n        onClose={() => setIsCreateFolderDialogOpen(false)}\n      />\n      <ImportFromUrlDialog\n        open={isUrlDialogOpen}\n        onClose={() => setIsUrlDialogOpen(false)}\n        onUpload={handleUrlUpload}\n      />\n      <AssetDetailsDrawer />\n    </>\n  );\n};\n"],"names":["INTERSECTION_OPTIONS","threshold","AssetsView","view","folderId","onAssetItemClick","onAddAssets","formatMessage","useIntl","assets","isLoading","isLoadingAssets","isFetchingMore","hasNextPage","fetchNextPage","error","useInfiniteAssets","folder","data","folders","isLoadingFolders","useGetFoldersQuery","parentId","isGridView","viewOptions","GRID","loadMoreRef","useElementOnScreen","useCallback","isVisible","_jsx","Flex","justifyContent","padding","Loader","id","defaultMessage","Box","Typography","textColor","getTranslationKey","length","EmptyState","_jsxs","_Fragment","AssetsGrid","AssetsTable","div","ref","style","height","StyledToggleGroup","styled","ToggleGroup","Root","theme","colors","neutral200","borderRadius","StyledToggleItem","Item","spaces","neutral0","neutral800","fontSizes","fontWeights","semiBold","primary100","neutral150","HeaderWrapper","AssetsPage","openDetails","useAssetDetailsParam","currentFolderId","navigateToFolderId","navigateToRoot","useFolderNavigation","currentFolderError","useGetFolderQuery","skip","useEffect","name","title","itemCount","useFolderInfo","itemCountLabel","count","pageHeaderTitle","isCreateFolderDialogOpen","setIsCreateFolderDialogOpen","useState","setView","usePersistentState","localStorageKeys","isUrlDialogOpen","setIsUrlDialogOpen","fileInputRef","useRef","uploadDropZoneRef","uploadFiles","useUploadFilesMutation","uploadFromUrls","useUploadFromUrlsMutation","uploadFilesToFolder","files","formData","FormData","fileInfoArray","forEach","file","append","push","caption","alternativeText","JSON","stringify","totalFiles","unwrap","handleFileSelect","current","click","handleFileChange","e","target","Array","from","value","handleDrop","handleUrlUpload","urls","UploadDropZoneProvider","onDrop","AssetsDndProvider","Layouts","minHeight","background","sideNav","FolderTree","onSelectFolder","VisuallyHidden","input","type","onChange","multiple","Header","primaryAction","SimpleMenu","popoverPlacement","variant","endIcon","ChevronDown","label","MenuItem","onSelect","startIcon","Folder","Files","Link","subtitle","alignItems","gap","width","onValueChange","TABLE","aria-label","List","GridIcon","Content","DropZoneWithOverlay","DropFilesMessage","folderName","CreateFolderDialog","open","parentFolderId","onClose","ImportFromUrlDialog","onUpload","AssetDetailsDrawer"],"mappings":"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"}

package/dist/admin/future/pages/Assets/components/AssetDetails/AssetPreview.js

@@ -112,11 +112,13 @@ const LoaderOverlay = styledComponents.styled(designSystem.Flex)`
 };
 const AssetPreview = ({ asset, actions, isLoading = false })=>{
     const { formatMessage } = reactIntl.useIntl();
-    const { alternativeText, ext, mime, url, updatedAt } = asset;
+    const { alternativeText, ext, mime, url, updatedAt, isUrlSigned, isLocal } = asset;
     // Append the asset's `updatedAt` as a cache-buster so a freshly replaced
     // file (often served at the same URL) shows the new content instead of the
-    // browser-cached old version.
-    const cacheKey = updatedAt ? new Date(updatedAt).getTime() : undefined;
+    // browser-cached old version. Signed URLs are excluded: their query string
+    // is part of the SigV4 signature, so appending a param invalidates the
+    // signature and the request fails with 403. See #26581.
+    const cacheKey = updatedAt && !isUrlSigned ? new Date(updatedAt).getTime() : undefined;
     const appendCacheBuster = (raw)=>{
         if (!raw || cacheKey === undefined) return raw;
         return raw.includes('?') ? `${raw}&v=${cacheKey}` : `${raw}?v=${cacheKey}`;
@@ -163,6 +165,7 @@ const AssetPreview = ({ asset, actions, isLoading = false })=>{
                             ref: imageRef,
                             src: imageUrl,
                             alt: alternativeText || asset.name || '',
+                            crossOrigin: !isLocal && isUrlSigned ? 'anonymous' : undefined,
                             onLoad: ()=>setIsMediaLoaded(true),
                             onError: ()=>setIsMediaLoaded(true)
                         })

package/dist/admin/future/pages/Assets/components/AssetDetails/AssetPreview.js.map

@@ -1 +1 @@
-{"version":3,"file":"AssetPreview.js","sources":["../../../../../../../admin/src/future/pages/Assets/components/AssetDetails/AssetPreview.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { Box, Flex, Loader, Typography } from '@strapi/design-system';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\n\nimport { ASSET_TYPES } from '../../../../../enums';\nimport { prefixFileUrlWithBackendUrl } from '../../../../utils/files';\nimport { getAssetIcon } from '../../../../utils/getAssetIcon';\nimport { getTranslationKey } from '../../../../utils/translations';\n\nimport type {\n  File,\n  AssetWithPopulatedCreatedBy,\n} from '../../../../../../../shared/contracts/files';\n\n/* -------------------------------------------------------------------------------------------------\n * Styled components\n * -----------------------------------------------------------------------------------------------*/\n\nconst PreviewContainer = styled(Box)`\n  position: relative;\n  width: 100%;\n  aspect-ratio: 16 / 9;\n  max-height: 24rem;\n  overflow: hidden;\n  border-radius: ${({ theme }) => theme.borderRadius};\n  padding: ${({ theme }) => theme.spaces[3]};\n  background: repeating-conic-gradient(\n      ${({ theme }) => theme.colors.neutral100} 0% 25%,\n      transparent 0% 50%\n    )\n    50% / 20px 20px;\n`;\n\nconst AssetContainer = styled(Flex)`\n  justify-content: center;\n  position: relative;\n  z-index: 2;\n  width: 100%;\n  height: 100%;\n`;\n\nconst StyledImage = styled.img`\n  max-width: 100%;\n  max-height: 100%;\n  object-fit: contain;\n`;\n\n/**\n * Top-right overlay slot for image actions (crop). Sits above the\n * image (z-index 3 > AssetContainer 2) so the buttons stay clickable.\n */\nconst ActionsOverlay = styled(Flex)`\n  position: absolute;\n  top: ${({ theme }) => theme.spaces[3]};\n  right: ${({ theme }) => theme.spaces[3]};\n  z-index: 3;\n`;\n\nconst StyledVideo = styled.video`\n  max-width: 100%;\n  max-height: 100%;\n  object-fit: contain;\n`;\n\nconst StyledAudio = styled.audio`\n  width: 100%;\n`;\n\nconst StyledPdfIframe = styled.iframe`\n  width: 100%;\n  height: 100%;\n  min-height: 200px;\n  border: none;\n`;\n\nconst IconFallback = styled(Flex)`\n  height: 100%;\n  aspect-ratio: 1;\n  width: auto;\n  max-width: 100%;\n  margin: 0 auto;\n  color: ${({ theme }) => theme.colors.neutral500};\n  background: ${({ theme }) => theme.colors.neutral150};\n`;\n\nconst LoaderOverlay = styled(Flex)`\n  position: absolute;\n  inset: 0;\n  z-index: 1;\n`;\n\n/* -------------------------------------------------------------------------------------------------\n * AssetLoader\n * -----------------------------------------------------------------------------------------------*/\n\nconst AssetLoader = () => {\n  const { formatMessage } = useIntl();\n  return (\n    <LoaderOverlay justifyContent=\"center\" alignItems=\"center\">\n      <Loader>{formatMessage({ id: 'app.loading', defaultMessage: 'Loading...' })}</Loader>\n    </LoaderOverlay>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * AssetPreviewContent\n * -----------------------------------------------------------------------------------------------*/\n\ninterface AssetPreviewProps {\n  asset: File | AssetWithPopulatedCreatedBy;\n  actions?: React.ReactNode;\n  isLoading?: boolean;\n}\n\nexport const AssetPreview = ({ asset, actions, isLoading = false }: AssetPreviewProps) => {\n  const { formatMessage } = useIntl();\n  const { alternativeText, ext, mime, url, updatedAt } = asset;\n  // Append the asset's `updatedAt` as a cache-buster so a freshly replaced\n  // file (often served at the same URL) shows the new content instead of the\n  // browser-cached old version.\n  const cacheKey = updatedAt ? new Date(updatedAt).getTime() : undefined;\n  const appendCacheBuster = (raw: string | undefined) => {\n    if (!raw || cacheKey === undefined) return raw;\n    return raw.includes('?') ? `${raw}&v=${cacheKey}` : `${raw}?v=${cacheKey}`;\n  };\n  const mediaUrl = appendCacheBuster(prefixFileUrlWithBackendUrl(url));\n\n  const [isMediaLoaded, setIsMediaLoaded] = React.useState(false);\n  React.useEffect(() => {\n    setIsMediaLoaded(false);\n  }, [mediaUrl]);\n\n  const imageRef = React.useRef<HTMLImageElement>(null);\n  React.useEffect(() => {\n    const image = imageRef.current;\n    if (!image) return;\n    const recompute = () => {\n      const parent = image.parentElement;\n      if (!parent) return;\n      const c = parent.getBoundingClientRect();\n      // offsetWidth/Height = pre-transform layout box (transforms ignored).\n      const w = image.offsetWidth;\n      const h = image.offsetHeight;\n      if (!w || !h || !c.width || !c.height) return;\n    };\n    recompute();\n    const ro = new ResizeObserver(recompute);\n    ro.observe(image);\n    if (image.parentElement) ro.observe(image.parentElement);\n    return () => ro.disconnect();\n  }, [isMediaLoaded]);\n\n  if (mime?.includes(ASSET_TYPES.Image)) {\n    const imageUrl = appendCacheBuster(prefixFileUrlWithBackendUrl(url));\n\n    if (imageUrl) {\n      return (\n        <PreviewContainer>\n          {(!isMediaLoaded || isLoading) && <AssetLoader />}\n          {actions ? <ActionsOverlay>{actions}</ActionsOverlay> : null}\n          <AssetContainer>\n            <StyledImage\n              ref={imageRef}\n              src={imageUrl}\n              alt={alternativeText || asset.name || ''}\n              onLoad={() => setIsMediaLoaded(true)}\n              onError={() => setIsMediaLoaded(true)}\n            />\n          </AssetContainer>\n        </PreviewContainer>\n      );\n    }\n  }\n\n  if (mime?.includes(ASSET_TYPES.Video) && mediaUrl) {\n    return (\n      <PreviewContainer>\n        {!isMediaLoaded && <AssetLoader />}\n        <AssetContainer>\n          <StyledVideo\n            src={mediaUrl}\n            controls\n            title={asset.name}\n            onLoadedData={() => setIsMediaLoaded(true)}\n            onError={() => setIsMediaLoaded(true)}\n          >\n            {formatMessage({\n              id: getTranslationKey('asset-details.videoNotSupported'),\n              defaultMessage: 'Your browser does not support the video tag.',\n            })}\n          </StyledVideo>\n        </AssetContainer>\n      </PreviewContainer>\n    );\n  }\n\n  if (mime?.includes(ASSET_TYPES.Audio) && mediaUrl) {\n    return (\n      <PreviewContainer>\n        {!isMediaLoaded && <AssetLoader />}\n        <AssetContainer>\n          <Flex\n            width=\"100%\"\n            padding={4}\n            justifyContent=\"center\"\n            alignItems=\"center\"\n            height=\"100%\"\n            minHeight=\"12rem\"\n          >\n            <StyledAudio\n              src={mediaUrl}\n              controls\n              onLoadedData={() => setIsMediaLoaded(true)}\n              onError={() => setIsMediaLoaded(true)}\n            />\n          </Flex>\n        </AssetContainer>\n      </PreviewContainer>\n    );\n  }\n\n  const isPdf =\n    ext?.toLowerCase() === 'pdf' || ext?.toLowerCase() === '.pdf' || mime === 'application/pdf';\n  if (isPdf && mediaUrl) {\n    return (\n      <PreviewContainer>\n        {!isMediaLoaded && <AssetLoader />}\n        <AssetContainer>\n          <StyledPdfIframe\n            src={`${mediaUrl}#toolbar=0`}\n            title={asset.name}\n            onLoad={() => setIsMediaLoaded(true)}\n          />\n        </AssetContainer>\n      </PreviewContainer>\n    );\n  }\n\n  const DocIcon = getAssetIcon(mime, ext);\n  return (\n    <PreviewContainer>\n      <IconFallback\n        justifyContent=\"center\"\n        alignItems=\"center\"\n        gap={1}\n        direction=\"column\"\n        hasRadius\n      >\n        <DocIcon width={24} height={24} />\n        <Typography variant=\"pi\">\n          {formatMessage({\n            id: getTranslationKey('asset-details.noPreview'),\n            defaultMessage: 'No preview available',\n          })}\n        </Typography>\n      </IconFallback>\n    </PreviewContainer>\n  );\n};\n"],"names":["PreviewContainer","styled","Box","theme","borderRadius","spaces","colors","neutral100","AssetContainer","Flex","StyledImage","img","ActionsOverlay","StyledVideo","video","StyledAudio","audio","StyledPdfIframe","iframe","IconFallback","neutral500","neutral150","LoaderOverlay","AssetLoader","formatMessage","useIntl","_jsx","justifyContent","alignItems","Loader","id","defaultMessage","AssetPreview","asset","actions","isLoading","alternativeText","ext","mime","url","updatedAt","cacheKey","Date","getTime","undefined","appendCacheBuster","raw","includes","mediaUrl","prefixFileUrlWithBackendUrl","isMediaLoaded","setIsMediaLoaded","React","useState","useEffect","imageRef","useRef","image","current","recompute","parent","parentElement","c","getBoundingClientRect","w","offsetWidth","h","offsetHeight","width","height","ro","ResizeObserver","observe","disconnect","ASSET_TYPES","Image","imageUrl","_jsxs","ref","src","alt","name","onLoad","onError","Video","controls","title","onLoadedData","getTranslationKey","Audio","padding","minHeight","isPdf","toLowerCase","DocIcon","getAssetIcon","gap","direction","hasRadius","Typography","variant"],"mappings":"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"}
+{"version":3,"file":"AssetPreview.js","sources":["../../../../../../../admin/src/future/pages/Assets/components/AssetDetails/AssetPreview.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { Box, Flex, Loader, Typography } from '@strapi/design-system';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\n\nimport { ASSET_TYPES } from '../../../../../enums';\nimport { prefixFileUrlWithBackendUrl } from '../../../../utils/files';\nimport { getAssetIcon } from '../../../../utils/getAssetIcon';\nimport { getTranslationKey } from '../../../../utils/translations';\n\nimport type {\n  File,\n  AssetWithPopulatedCreatedBy,\n} from '../../../../../../../shared/contracts/files';\n\n/* -------------------------------------------------------------------------------------------------\n * Styled components\n * -----------------------------------------------------------------------------------------------*/\n\nconst PreviewContainer = styled(Box)`\n  position: relative;\n  width: 100%;\n  aspect-ratio: 16 / 9;\n  max-height: 24rem;\n  overflow: hidden;\n  border-radius: ${({ theme }) => theme.borderRadius};\n  padding: ${({ theme }) => theme.spaces[3]};\n  background: repeating-conic-gradient(\n      ${({ theme }) => theme.colors.neutral100} 0% 25%,\n      transparent 0% 50%\n    )\n    50% / 20px 20px;\n`;\n\nconst AssetContainer = styled(Flex)`\n  justify-content: center;\n  position: relative;\n  z-index: 2;\n  width: 100%;\n  height: 100%;\n`;\n\nconst StyledImage = styled.img`\n  max-width: 100%;\n  max-height: 100%;\n  object-fit: contain;\n`;\n\n/**\n * Top-right overlay slot for image actions (crop). Sits above the\n * image (z-index 3 > AssetContainer 2) so the buttons stay clickable.\n */\nconst ActionsOverlay = styled(Flex)`\n  position: absolute;\n  top: ${({ theme }) => theme.spaces[3]};\n  right: ${({ theme }) => theme.spaces[3]};\n  z-index: 3;\n`;\n\nconst StyledVideo = styled.video`\n  max-width: 100%;\n  max-height: 100%;\n  object-fit: contain;\n`;\n\nconst StyledAudio = styled.audio`\n  width: 100%;\n`;\n\nconst StyledPdfIframe = styled.iframe`\n  width: 100%;\n  height: 100%;\n  min-height: 200px;\n  border: none;\n`;\n\nconst IconFallback = styled(Flex)`\n  height: 100%;\n  aspect-ratio: 1;\n  width: auto;\n  max-width: 100%;\n  margin: 0 auto;\n  color: ${({ theme }) => theme.colors.neutral500};\n  background: ${({ theme }) => theme.colors.neutral150};\n`;\n\nconst LoaderOverlay = styled(Flex)`\n  position: absolute;\n  inset: 0;\n  z-index: 1;\n`;\n\n/* -------------------------------------------------------------------------------------------------\n * AssetLoader\n * -----------------------------------------------------------------------------------------------*/\n\nconst AssetLoader = () => {\n  const { formatMessage } = useIntl();\n  return (\n    <LoaderOverlay justifyContent=\"center\" alignItems=\"center\">\n      <Loader>{formatMessage({ id: 'app.loading', defaultMessage: 'Loading...' })}</Loader>\n    </LoaderOverlay>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * AssetPreviewContent\n * -----------------------------------------------------------------------------------------------*/\n\ninterface AssetPreviewProps {\n  asset: File | AssetWithPopulatedCreatedBy;\n  actions?: React.ReactNode;\n  isLoading?: boolean;\n}\n\nexport const AssetPreview = ({ asset, actions, isLoading = false }: AssetPreviewProps) => {\n  const { formatMessage } = useIntl();\n  const { alternativeText, ext, mime, url, updatedAt, isUrlSigned, isLocal } = asset;\n  // Append the asset's `updatedAt` as a cache-buster so a freshly replaced\n  // file (often served at the same URL) shows the new content instead of the\n  // browser-cached old version. Signed URLs are excluded: their query string\n  // is part of the SigV4 signature, so appending a param invalidates the\n  // signature and the request fails with 403. See #26581.\n  const cacheKey = updatedAt && !isUrlSigned ? new Date(updatedAt).getTime() : undefined;\n  const appendCacheBuster = (raw: string | undefined) => {\n    if (!raw || cacheKey === undefined) return raw;\n    return raw.includes('?') ? `${raw}&v=${cacheKey}` : `${raw}?v=${cacheKey}`;\n  };\n  const mediaUrl = appendCacheBuster(prefixFileUrlWithBackendUrl(url));\n\n  const [isMediaLoaded, setIsMediaLoaded] = React.useState(false);\n  React.useEffect(() => {\n    setIsMediaLoaded(false);\n  }, [mediaUrl]);\n\n  const imageRef = React.useRef<HTMLImageElement>(null);\n  React.useEffect(() => {\n    const image = imageRef.current;\n    if (!image) return;\n    const recompute = () => {\n      const parent = image.parentElement;\n      if (!parent) return;\n      const c = parent.getBoundingClientRect();\n      // offsetWidth/Height = pre-transform layout box (transforms ignored).\n      const w = image.offsetWidth;\n      const h = image.offsetHeight;\n      if (!w || !h || !c.width || !c.height) return;\n    };\n    recompute();\n    const ro = new ResizeObserver(recompute);\n    ro.observe(image);\n    if (image.parentElement) ro.observe(image.parentElement);\n    return () => ro.disconnect();\n  }, [isMediaLoaded]);\n\n  if (mime?.includes(ASSET_TYPES.Image)) {\n    const imageUrl = appendCacheBuster(prefixFileUrlWithBackendUrl(url));\n\n    if (imageUrl) {\n      return (\n        <PreviewContainer>\n          {(!isMediaLoaded || isLoading) && <AssetLoader />}\n          {actions ? <ActionsOverlay>{actions}</ActionsOverlay> : null}\n          <AssetContainer>\n            <StyledImage\n              ref={imageRef}\n              src={imageUrl}\n              alt={alternativeText || asset.name || ''}\n              crossOrigin={!isLocal && isUrlSigned ? 'anonymous' : undefined}\n              onLoad={() => setIsMediaLoaded(true)}\n              onError={() => setIsMediaLoaded(true)}\n            />\n          </AssetContainer>\n        </PreviewContainer>\n      );\n    }\n  }\n\n  if (mime?.includes(ASSET_TYPES.Video) && mediaUrl) {\n    return (\n      <PreviewContainer>\n        {!isMediaLoaded && <AssetLoader />}\n        <AssetContainer>\n          <StyledVideo\n            src={mediaUrl}\n            controls\n            title={asset.name}\n            onLoadedData={() => setIsMediaLoaded(true)}\n            onError={() => setIsMediaLoaded(true)}\n          >\n            {formatMessage({\n              id: getTranslationKey('asset-details.videoNotSupported'),\n              defaultMessage: 'Your browser does not support the video tag.',\n            })}\n          </StyledVideo>\n        </AssetContainer>\n      </PreviewContainer>\n    );\n  }\n\n  if (mime?.includes(ASSET_TYPES.Audio) && mediaUrl) {\n    return (\n      <PreviewContainer>\n        {!isMediaLoaded && <AssetLoader />}\n        <AssetContainer>\n          <Flex\n            width=\"100%\"\n            padding={4}\n            justifyContent=\"center\"\n            alignItems=\"center\"\n            height=\"100%\"\n            minHeight=\"12rem\"\n          >\n            <StyledAudio\n              src={mediaUrl}\n              controls\n              onLoadedData={() => setIsMediaLoaded(true)}\n              onError={() => setIsMediaLoaded(true)}\n            />\n          </Flex>\n        </AssetContainer>\n      </PreviewContainer>\n    );\n  }\n\n  const isPdf =\n    ext?.toLowerCase() === 'pdf' || ext?.toLowerCase() === '.pdf' || mime === 'application/pdf';\n  if (isPdf && mediaUrl) {\n    return (\n      <PreviewContainer>\n        {!isMediaLoaded && <AssetLoader />}\n        <AssetContainer>\n          <StyledPdfIframe\n            src={`${mediaUrl}#toolbar=0`}\n            title={asset.name}\n            onLoad={() => setIsMediaLoaded(true)}\n          />\n        </AssetContainer>\n      </PreviewContainer>\n    );\n  }\n\n  const DocIcon = getAssetIcon(mime, ext);\n  return (\n    <PreviewContainer>\n      <IconFallback\n        justifyContent=\"center\"\n        alignItems=\"center\"\n        gap={1}\n        direction=\"column\"\n        hasRadius\n      >\n        <DocIcon width={24} height={24} />\n        <Typography variant=\"pi\">\n          {formatMessage({\n            id: getTranslationKey('asset-details.noPreview'),\n            defaultMessage: 'No preview available',\n          })}\n        </Typography>\n      </IconFallback>\n    </PreviewContainer>\n  );\n};\n"],"names":["PreviewContainer","styled","Box","theme","borderRadius","spaces","colors","neutral100","AssetContainer","Flex","StyledImage","img","ActionsOverlay","StyledVideo","video","StyledAudio","audio","StyledPdfIframe","iframe","IconFallback","neutral500","neutral150","LoaderOverlay","AssetLoader","formatMessage","useIntl","_jsx","justifyContent","alignItems","Loader","id","defaultMessage","AssetPreview","asset","actions","isLoading","alternativeText","ext","mime","url","updatedAt","isUrlSigned","isLocal","cacheKey","Date","getTime","undefined","appendCacheBuster","raw","includes","mediaUrl","prefixFileUrlWithBackendUrl","isMediaLoaded","setIsMediaLoaded","React","useState","useEffect","imageRef","useRef","image","current","recompute","parent","parentElement","c","getBoundingClientRect","w","offsetWidth","h","offsetHeight","width","height","ro","ResizeObserver","observe","disconnect","ASSET_TYPES","Image","imageUrl","_jsxs","ref","src","alt","name","crossOrigin","onLoad","onError","Video","controls","title","onLoadedData","getTranslationKey","Audio","padding","minHeight","isPdf","toLowerCase","DocIcon","getAssetIcon","gap","direction","hasRadius","Typography","variant"],"mappings":"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"}

package/dist/admin/future/pages/Assets/components/AssetDetails/AssetPreview.mjs

@@ -90,11 +90,13 @@ const LoaderOverlay = styled(Flex)`
 };
 const AssetPreview = ({ asset, actions, isLoading = false })=>{
     const { formatMessage } = useIntl();
-    const { alternativeText, ext, mime, url, updatedAt } = asset;
+    const { alternativeText, ext, mime, url, updatedAt, isUrlSigned, isLocal } = asset;
     // Append the asset's `updatedAt` as a cache-buster so a freshly replaced
     // file (often served at the same URL) shows the new content instead of the
-    // browser-cached old version.
-    const cacheKey = updatedAt ? new Date(updatedAt).getTime() : undefined;
+    // browser-cached old version. Signed URLs are excluded: their query string
+    // is part of the SigV4 signature, so appending a param invalidates the
+    // signature and the request fails with 403. See #26581.
+    const cacheKey = updatedAt && !isUrlSigned ? new Date(updatedAt).getTime() : undefined;
     const appendCacheBuster = (raw)=>{
         if (!raw || cacheKey === undefined) return raw;
         return raw.includes('?') ? `${raw}&v=${cacheKey}` : `${raw}?v=${cacheKey}`;
@@ -141,6 +143,7 @@ const AssetPreview = ({ asset, actions, isLoading = false })=>{
                             ref: imageRef,
                             src: imageUrl,
                             alt: alternativeText || asset.name || '',
+                            crossOrigin: !isLocal && isUrlSigned ? 'anonymous' : undefined,
                             onLoad: ()=>setIsMediaLoaded(true),
                             onError: ()=>setIsMediaLoaded(true)
                         })

package/dist/admin/future/pages/Assets/components/AssetDetails/AssetPreview.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"AssetPreview.mjs","sources":["../../../../../../../admin/src/future/pages/Assets/components/AssetDetails/AssetPreview.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { Box, Flex, Loader, Typography } from '@strapi/design-system';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\n\nimport { ASSET_TYPES } from '../../../../../enums';\nimport { prefixFileUrlWithBackendUrl } from '../../../../utils/files';\nimport { getAssetIcon } from '../../../../utils/getAssetIcon';\nimport { getTranslationKey } from '../../../../utils/translations';\n\nimport type {\n  File,\n  AssetWithPopulatedCreatedBy,\n} from '../../../../../../../shared/contracts/files';\n\n/* -------------------------------------------------------------------------------------------------\n * Styled components\n * -----------------------------------------------------------------------------------------------*/\n\nconst PreviewContainer = styled(Box)`\n  position: relative;\n  width: 100%;\n  aspect-ratio: 16 / 9;\n  max-height: 24rem;\n  overflow: hidden;\n  border-radius: ${({ theme }) => theme.borderRadius};\n  padding: ${({ theme }) => theme.spaces[3]};\n  background: repeating-conic-gradient(\n      ${({ theme }) => theme.colors.neutral100} 0% 25%,\n      transparent 0% 50%\n    )\n    50% / 20px 20px;\n`;\n\nconst AssetContainer = styled(Flex)`\n  justify-content: center;\n  position: relative;\n  z-index: 2;\n  width: 100%;\n  height: 100%;\n`;\n\nconst StyledImage = styled.img`\n  max-width: 100%;\n  max-height: 100%;\n  object-fit: contain;\n`;\n\n/**\n * Top-right overlay slot for image actions (crop). Sits above the\n * image (z-index 3 > AssetContainer 2) so the buttons stay clickable.\n */\nconst ActionsOverlay = styled(Flex)`\n  position: absolute;\n  top: ${({ theme }) => theme.spaces[3]};\n  right: ${({ theme }) => theme.spaces[3]};\n  z-index: 3;\n`;\n\nconst StyledVideo = styled.video`\n  max-width: 100%;\n  max-height: 100%;\n  object-fit: contain;\n`;\n\nconst StyledAudio = styled.audio`\n  width: 100%;\n`;\n\nconst StyledPdfIframe = styled.iframe`\n  width: 100%;\n  height: 100%;\n  min-height: 200px;\n  border: none;\n`;\n\nconst IconFallback = styled(Flex)`\n  height: 100%;\n  aspect-ratio: 1;\n  width: auto;\n  max-width: 100%;\n  margin: 0 auto;\n  color: ${({ theme }) => theme.colors.neutral500};\n  background: ${({ theme }) => theme.colors.neutral150};\n`;\n\nconst LoaderOverlay = styled(Flex)`\n  position: absolute;\n  inset: 0;\n  z-index: 1;\n`;\n\n/* -------------------------------------------------------------------------------------------------\n * AssetLoader\n * -----------------------------------------------------------------------------------------------*/\n\nconst AssetLoader = () => {\n  const { formatMessage } = useIntl();\n  return (\n    <LoaderOverlay justifyContent=\"center\" alignItems=\"center\">\n      <Loader>{formatMessage({ id: 'app.loading', defaultMessage: 'Loading...' })}</Loader>\n    </LoaderOverlay>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * AssetPreviewContent\n * -----------------------------------------------------------------------------------------------*/\n\ninterface AssetPreviewProps {\n  asset: File | AssetWithPopulatedCreatedBy;\n  actions?: React.ReactNode;\n  isLoading?: boolean;\n}\n\nexport const AssetPreview = ({ asset, actions, isLoading = false }: AssetPreviewProps) => {\n  const { formatMessage } = useIntl();\n  const { alternativeText, ext, mime, url, updatedAt } = asset;\n  // Append the asset's `updatedAt` as a cache-buster so a freshly replaced\n  // file (often served at the same URL) shows the new content instead of the\n  // browser-cached old version.\n  const cacheKey = updatedAt ? new Date(updatedAt).getTime() : undefined;\n  const appendCacheBuster = (raw: string | undefined) => {\n    if (!raw || cacheKey === undefined) return raw;\n    return raw.includes('?') ? `${raw}&v=${cacheKey}` : `${raw}?v=${cacheKey}`;\n  };\n  const mediaUrl = appendCacheBuster(prefixFileUrlWithBackendUrl(url));\n\n  const [isMediaLoaded, setIsMediaLoaded] = React.useState(false);\n  React.useEffect(() => {\n    setIsMediaLoaded(false);\n  }, [mediaUrl]);\n\n  const imageRef = React.useRef<HTMLImageElement>(null);\n  React.useEffect(() => {\n    const image = imageRef.current;\n    if (!image) return;\n    const recompute = () => {\n      const parent = image.parentElement;\n      if (!parent) return;\n      const c = parent.getBoundingClientRect();\n      // offsetWidth/Height = pre-transform layout box (transforms ignored).\n      const w = image.offsetWidth;\n      const h = image.offsetHeight;\n      if (!w || !h || !c.width || !c.height) return;\n    };\n    recompute();\n    const ro = new ResizeObserver(recompute);\n    ro.observe(image);\n    if (image.parentElement) ro.observe(image.parentElement);\n    return () => ro.disconnect();\n  }, [isMediaLoaded]);\n\n  if (mime?.includes(ASSET_TYPES.Image)) {\n    const imageUrl = appendCacheBuster(prefixFileUrlWithBackendUrl(url));\n\n    if (imageUrl) {\n      return (\n        <PreviewContainer>\n          {(!isMediaLoaded || isLoading) && <AssetLoader />}\n          {actions ? <ActionsOverlay>{actions}</ActionsOverlay> : null}\n          <AssetContainer>\n            <StyledImage\n              ref={imageRef}\n              src={imageUrl}\n              alt={alternativeText || asset.name || ''}\n              onLoad={() => setIsMediaLoaded(true)}\n              onError={() => setIsMediaLoaded(true)}\n            />\n          </AssetContainer>\n        </PreviewContainer>\n      );\n    }\n  }\n\n  if (mime?.includes(ASSET_TYPES.Video) && mediaUrl) {\n    return (\n      <PreviewContainer>\n        {!isMediaLoaded && <AssetLoader />}\n        <AssetContainer>\n          <StyledVideo\n            src={mediaUrl}\n            controls\n            title={asset.name}\n            onLoadedData={() => setIsMediaLoaded(true)}\n            onError={() => setIsMediaLoaded(true)}\n          >\n            {formatMessage({\n              id: getTranslationKey('asset-details.videoNotSupported'),\n              defaultMessage: 'Your browser does not support the video tag.',\n            })}\n          </StyledVideo>\n        </AssetContainer>\n      </PreviewContainer>\n    );\n  }\n\n  if (mime?.includes(ASSET_TYPES.Audio) && mediaUrl) {\n    return (\n      <PreviewContainer>\n        {!isMediaLoaded && <AssetLoader />}\n        <AssetContainer>\n          <Flex\n            width=\"100%\"\n            padding={4}\n            justifyContent=\"center\"\n            alignItems=\"center\"\n            height=\"100%\"\n            minHeight=\"12rem\"\n          >\n            <StyledAudio\n              src={mediaUrl}\n              controls\n              onLoadedData={() => setIsMediaLoaded(true)}\n              onError={() => setIsMediaLoaded(true)}\n            />\n          </Flex>\n        </AssetContainer>\n      </PreviewContainer>\n    );\n  }\n\n  const isPdf =\n    ext?.toLowerCase() === 'pdf' || ext?.toLowerCase() === '.pdf' || mime === 'application/pdf';\n  if (isPdf && mediaUrl) {\n    return (\n      <PreviewContainer>\n        {!isMediaLoaded && <AssetLoader />}\n        <AssetContainer>\n          <StyledPdfIframe\n            src={`${mediaUrl}#toolbar=0`}\n            title={asset.name}\n            onLoad={() => setIsMediaLoaded(true)}\n          />\n        </AssetContainer>\n      </PreviewContainer>\n    );\n  }\n\n  const DocIcon = getAssetIcon(mime, ext);\n  return (\n    <PreviewContainer>\n      <IconFallback\n        justifyContent=\"center\"\n        alignItems=\"center\"\n        gap={1}\n        direction=\"column\"\n        hasRadius\n      >\n        <DocIcon width={24} height={24} />\n        <Typography variant=\"pi\">\n          {formatMessage({\n            id: getTranslationKey('asset-details.noPreview'),\n            defaultMessage: 'No preview available',\n          })}\n        </Typography>\n      </IconFallback>\n    </PreviewContainer>\n  );\n};\n"],"names":["PreviewContainer","styled","Box","theme","borderRadius","spaces","colors","neutral100","AssetContainer","Flex","StyledImage","img","ActionsOverlay","StyledVideo","video","StyledAudio","audio","StyledPdfIframe","iframe","IconFallback","neutral500","neutral150","LoaderOverlay","AssetLoader","formatMessage","useIntl","_jsx","justifyContent","alignItems","Loader","id","defaultMessage","AssetPreview","asset","actions","isLoading","alternativeText","ext","mime","url","updatedAt","cacheKey","Date","getTime","undefined","appendCacheBuster","raw","includes","mediaUrl","prefixFileUrlWithBackendUrl","isMediaLoaded","setIsMediaLoaded","React","useState","useEffect","imageRef","useRef","image","current","recompute","parent","parentElement","c","getBoundingClientRect","w","offsetWidth","h","offsetHeight","width","height","ro","ResizeObserver","observe","disconnect","ASSET_TYPES","Image","imageUrl","_jsxs","ref","src","alt","name","onLoad","onError","Video","controls","title","onLoadedData","getTranslationKey","Audio","padding","minHeight","isPdf","toLowerCase","DocIcon","getAssetIcon","gap","direction","hasRadius","Typography","variant"],"mappings":"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"}
+{"version":3,"file":"AssetPreview.mjs","sources":["../../../../../../../admin/src/future/pages/Assets/components/AssetDetails/AssetPreview.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { Box, Flex, Loader, Typography } from '@strapi/design-system';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\n\nimport { ASSET_TYPES } from '../../../../../enums';\nimport { prefixFileUrlWithBackendUrl } from '../../../../utils/files';\nimport { getAssetIcon } from '../../../../utils/getAssetIcon';\nimport { getTranslationKey } from '../../../../utils/translations';\n\nimport type {\n  File,\n  AssetWithPopulatedCreatedBy,\n} from '../../../../../../../shared/contracts/files';\n\n/* -------------------------------------------------------------------------------------------------\n * Styled components\n * -----------------------------------------------------------------------------------------------*/\n\nconst PreviewContainer = styled(Box)`\n  position: relative;\n  width: 100%;\n  aspect-ratio: 16 / 9;\n  max-height: 24rem;\n  overflow: hidden;\n  border-radius: ${({ theme }) => theme.borderRadius};\n  padding: ${({ theme }) => theme.spaces[3]};\n  background: repeating-conic-gradient(\n      ${({ theme }) => theme.colors.neutral100} 0% 25%,\n      transparent 0% 50%\n    )\n    50% / 20px 20px;\n`;\n\nconst AssetContainer = styled(Flex)`\n  justify-content: center;\n  position: relative;\n  z-index: 2;\n  width: 100%;\n  height: 100%;\n`;\n\nconst StyledImage = styled.img`\n  max-width: 100%;\n  max-height: 100%;\n  object-fit: contain;\n`;\n\n/**\n * Top-right overlay slot for image actions (crop). Sits above the\n * image (z-index 3 > AssetContainer 2) so the buttons stay clickable.\n */\nconst ActionsOverlay = styled(Flex)`\n  position: absolute;\n  top: ${({ theme }) => theme.spaces[3]};\n  right: ${({ theme }) => theme.spaces[3]};\n  z-index: 3;\n`;\n\nconst StyledVideo = styled.video`\n  max-width: 100%;\n  max-height: 100%;\n  object-fit: contain;\n`;\n\nconst StyledAudio = styled.audio`\n  width: 100%;\n`;\n\nconst StyledPdfIframe = styled.iframe`\n  width: 100%;\n  height: 100%;\n  min-height: 200px;\n  border: none;\n`;\n\nconst IconFallback = styled(Flex)`\n  height: 100%;\n  aspect-ratio: 1;\n  width: auto;\n  max-width: 100%;\n  margin: 0 auto;\n  color: ${({ theme }) => theme.colors.neutral500};\n  background: ${({ theme }) => theme.colors.neutral150};\n`;\n\nconst LoaderOverlay = styled(Flex)`\n  position: absolute;\n  inset: 0;\n  z-index: 1;\n`;\n\n/* -------------------------------------------------------------------------------------------------\n * AssetLoader\n * -----------------------------------------------------------------------------------------------*/\n\nconst AssetLoader = () => {\n  const { formatMessage } = useIntl();\n  return (\n    <LoaderOverlay justifyContent=\"center\" alignItems=\"center\">\n      <Loader>{formatMessage({ id: 'app.loading', defaultMessage: 'Loading...' })}</Loader>\n    </LoaderOverlay>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * AssetPreviewContent\n * -----------------------------------------------------------------------------------------------*/\n\ninterface AssetPreviewProps {\n  asset: File | AssetWithPopulatedCreatedBy;\n  actions?: React.ReactNode;\n  isLoading?: boolean;\n}\n\nexport const AssetPreview = ({ asset, actions, isLoading = false }: AssetPreviewProps) => {\n  const { formatMessage } = useIntl();\n  const { alternativeText, ext, mime, url, updatedAt, isUrlSigned, isLocal } = asset;\n  // Append the asset's `updatedAt` as a cache-buster so a freshly replaced\n  // file (often served at the same URL) shows the new content instead of the\n  // browser-cached old version. Signed URLs are excluded: their query string\n  // is part of the SigV4 signature, so appending a param invalidates the\n  // signature and the request fails with 403. See #26581.\n  const cacheKey = updatedAt && !isUrlSigned ? new Date(updatedAt).getTime() : undefined;\n  const appendCacheBuster = (raw: string | undefined) => {\n    if (!raw || cacheKey === undefined) return raw;\n    return raw.includes('?') ? `${raw}&v=${cacheKey}` : `${raw}?v=${cacheKey}`;\n  };\n  const mediaUrl = appendCacheBuster(prefixFileUrlWithBackendUrl(url));\n\n  const [isMediaLoaded, setIsMediaLoaded] = React.useState(false);\n  React.useEffect(() => {\n    setIsMediaLoaded(false);\n  }, [mediaUrl]);\n\n  const imageRef = React.useRef<HTMLImageElement>(null);\n  React.useEffect(() => {\n    const image = imageRef.current;\n    if (!image) return;\n    const recompute = () => {\n      const parent = image.parentElement;\n      if (!parent) return;\n      const c = parent.getBoundingClientRect();\n      // offsetWidth/Height = pre-transform layout box (transforms ignored).\n      const w = image.offsetWidth;\n      const h = image.offsetHeight;\n      if (!w || !h || !c.width || !c.height) return;\n    };\n    recompute();\n    const ro = new ResizeObserver(recompute);\n    ro.observe(image);\n    if (image.parentElement) ro.observe(image.parentElement);\n    return () => ro.disconnect();\n  }, [isMediaLoaded]);\n\n  if (mime?.includes(ASSET_TYPES.Image)) {\n    const imageUrl = appendCacheBuster(prefixFileUrlWithBackendUrl(url));\n\n    if (imageUrl) {\n      return (\n        <PreviewContainer>\n          {(!isMediaLoaded || isLoading) && <AssetLoader />}\n          {actions ? <ActionsOverlay>{actions}</ActionsOverlay> : null}\n          <AssetContainer>\n            <StyledImage\n              ref={imageRef}\n              src={imageUrl}\n              alt={alternativeText || asset.name || ''}\n              crossOrigin={!isLocal && isUrlSigned ? 'anonymous' : undefined}\n              onLoad={() => setIsMediaLoaded(true)}\n              onError={() => setIsMediaLoaded(true)}\n            />\n          </AssetContainer>\n        </PreviewContainer>\n      );\n    }\n  }\n\n  if (mime?.includes(ASSET_TYPES.Video) && mediaUrl) {\n    return (\n      <PreviewContainer>\n        {!isMediaLoaded && <AssetLoader />}\n        <AssetContainer>\n          <StyledVideo\n            src={mediaUrl}\n            controls\n            title={asset.name}\n            onLoadedData={() => setIsMediaLoaded(true)}\n            onError={() => setIsMediaLoaded(true)}\n          >\n            {formatMessage({\n              id: getTranslationKey('asset-details.videoNotSupported'),\n              defaultMessage: 'Your browser does not support the video tag.',\n            })}\n          </StyledVideo>\n        </AssetContainer>\n      </PreviewContainer>\n    );\n  }\n\n  if (mime?.includes(ASSET_TYPES.Audio) && mediaUrl) {\n    return (\n      <PreviewContainer>\n        {!isMediaLoaded && <AssetLoader />}\n        <AssetContainer>\n          <Flex\n            width=\"100%\"\n            padding={4}\n            justifyContent=\"center\"\n            alignItems=\"center\"\n            height=\"100%\"\n            minHeight=\"12rem\"\n          >\n            <StyledAudio\n              src={mediaUrl}\n              controls\n              onLoadedData={() => setIsMediaLoaded(true)}\n              onError={() => setIsMediaLoaded(true)}\n            />\n          </Flex>\n        </AssetContainer>\n      </PreviewContainer>\n    );\n  }\n\n  const isPdf =\n    ext?.toLowerCase() === 'pdf' || ext?.toLowerCase() === '.pdf' || mime === 'application/pdf';\n  if (isPdf && mediaUrl) {\n    return (\n      <PreviewContainer>\n        {!isMediaLoaded && <AssetLoader />}\n        <AssetContainer>\n          <StyledPdfIframe\n            src={`${mediaUrl}#toolbar=0`}\n            title={asset.name}\n            onLoad={() => setIsMediaLoaded(true)}\n          />\n        </AssetContainer>\n      </PreviewContainer>\n    );\n  }\n\n  const DocIcon = getAssetIcon(mime, ext);\n  return (\n    <PreviewContainer>\n      <IconFallback\n        justifyContent=\"center\"\n        alignItems=\"center\"\n        gap={1}\n        direction=\"column\"\n        hasRadius\n      >\n        <DocIcon width={24} height={24} />\n        <Typography variant=\"pi\">\n          {formatMessage({\n            id: getTranslationKey('asset-details.noPreview'),\n            defaultMessage: 'No preview available',\n          })}\n        </Typography>\n      </IconFallback>\n    </PreviewContainer>\n  );\n};\n"],"names":["PreviewContainer","styled","Box","theme","borderRadius","spaces","colors","neutral100","AssetContainer","Flex","StyledImage","img","ActionsOverlay","StyledVideo","video","StyledAudio","audio","StyledPdfIframe","iframe","IconFallback","neutral500","neutral150","LoaderOverlay","AssetLoader","formatMessage","useIntl","_jsx","justifyContent","alignItems","Loader","id","defaultMessage","AssetPreview","asset","actions","isLoading","alternativeText","ext","mime","url","updatedAt","isUrlSigned","isLocal","cacheKey","Date","getTime","undefined","appendCacheBuster","raw","includes","mediaUrl","prefixFileUrlWithBackendUrl","isMediaLoaded","setIsMediaLoaded","React","useState","useEffect","imageRef","useRef","image","current","recompute","parent","parentElement","c","getBoundingClientRect","w","offsetWidth","h","offsetHeight","width","height","ro","ResizeObserver","observe","disconnect","ASSET_TYPES","Image","imageUrl","_jsxs","ref","src","alt","name","crossOrigin","onLoad","onError","Video","controls","title","onLoadedData","getTranslationKey","Audio","padding","minHeight","isPdf","toLowerCase","DocIcon","getAssetIcon","gap","direction","hasRadius","Typography","variant"],"mappings":"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"}