@aws-amplify/ui-react-storage 3.15.0 → 3.17.0

package/dist/esm/components/StorageBrowser/views/LocationDetailView/getLocationDetailViewTableData/getFolderRowContent.mjs

@@ -1,32 +1,43 @@
 import { LOCATION_DETAIL_VIEW_HEADERS } from './constants.mjs';
 
-const getFolderRowContent = ({ itemSubPath, rowId, onNavigate, }) => LOCATION_DETAIL_VIEW_HEADERS.map((columnKey) => {
-    const key = `${columnKey}-${rowId}`;
-    switch (columnKey) {
-        case 'checkbox': {
-            return { key, type: 'text', content: { text: '' } };
+const getFolderRowContent = ({ itemSubPath, rowId, isSelected, selectFolderLabel, onNavigate, onSelect, }) => {
+    return LOCATION_DETAIL_VIEW_HEADERS.map((columnKey) => {
+        const key = `${columnKey}-${rowId}`;
+        switch (columnKey) {
+            case 'checkbox': {
+                return {
+                    key,
+                    type: 'checkbox',
+                    content: {
+                        checked: isSelected,
+                        id: key,
+                        label: `${selectFolderLabel} ${itemSubPath}`,
+                        onSelect,
+                    },
+                };
+            }
+            case 'name': {
+                return {
+                    key,
+                    type: 'button',
+                    content: {
+                        icon: 'folder',
+                        ariaLabel: itemSubPath,
+                        label: itemSubPath,
+                        onClick: onNavigate,
+                    },
+                };
+            }
+            case 'type': {
+                return { key, type: 'text', content: { text: 'Folder' } };
+            }
+            case 'last-modified':
+            case 'size':
+            case 'download': {
+                return { key, type: 'text', content: { text: '' } };
+            }
         }
-        case 'name': {
-            return {
-                key,
-                type: 'button',
-                content: {
-                    icon: 'folder',
-                    ariaLabel: itemSubPath,
-                    label: itemSubPath,
-                    onClick: onNavigate,
-                },
-            };
-        }
-        case 'type': {
-            return { key, type: 'text', content: { text: 'Folder' } };
-        }
-        case 'last-modified':
-        case 'size':
-        case 'download': {
-            return { key, type: 'text', content: { text: '' } };
-        }
-    }
-});
+    });
+};
 
 export { getFolderRowContent };

package/dist/esm/components/StorageBrowser/views/LocationDetailView/getLocationDetailViewTableData/getLocationDetailViewTableData.mjs

@@ -9,7 +9,7 @@ import { getFileRowContent } from './getFileRowContent.mjs';
 import { getFolderRowContent } from './getFolderRowContent.mjs';
 import { getHeaders } from './getHeaders.mjs';
 
-const getLocationDetailViewTableData = ({ filePreviewEnabled, activeFile, onSelectActiveFile, areAllFilesSelected, displayText, location, fileDataItems, hasFiles, pageItems, selectFileLabel, selectAllFilesLabel, getDateDisplayValue, onDownload, onNavigate, onSelect, onSelectAll, }) => {
+const getLocationDetailViewTableData = ({ filePreviewEnabled, activeFile, onSelectActiveFile, areAllFilesSelected, displayText, location, fileDataItems, dataItems, hasFiles, pageItems, selectFileLabel, selectAllFilesLabel, getDateDisplayValue, onDownload, onNavigate, onSelect, onSelectAll, }) => {
     const { tableColumnLastModifiedHeader, tableColumnNameHeader, tableColumnSizeHeader, tableColumnTypeHeader, } = displayText;
     const headers = getHeaders({
         areAllFilesSelected,
@@ -67,6 +67,10 @@ const getLocationDetailViewTableData = ({ filePreviewEnabled, activeFile, onSele
                     }
                     onNavigate({ ...current, id }, itemLocationPath);
                 };
+                const isSelected = dataItems?.some((item) => item.id === id) ?? false;
+                const onFolderSelect = () => {
+                    onSelect(isSelected, locationItem);
+                };
                 return {
                     key: id,
                     active: false,
@@ -74,6 +78,9 @@ const getLocationDetailViewTableData = ({ filePreviewEnabled, activeFile, onSele
                         itemSubPath,
                         rowId: id,
                         onNavigate: onFolderNavigate,
+                        selectFolderLabel: selectFileLabel,
+                        isSelected,
+                        onSelect: onFolderSelect,
                     }),
                 };
             }

package/dist/esm/components/StorageBrowser/views/LocationDetailView/useLocationDetailView.mjs

@@ -7,6 +7,10 @@ import 'jszip';
 import 'aws-amplify/storage';
 import { useActionConfigs } from '../../actions/configs/context.mjs';
 import '../../actions/configs/defaults.mjs';
+import '@aws-amplify/ui-react-core/elements';
+import '../../credentials/context.mjs';
+import '../../configuration/context.mjs';
+import { usePaginationConfig } from '../../configuration/paginationContext.mjs';
 import { useFileItems } from '../../fileItems/context.mjs';
 import { useLocationItems } from '../../locationItems/context.mjs';
 import { useStore } from '../../store/context.mjs';
@@ -16,30 +20,29 @@ import { useList } from '../../useAction/useList.mjs';
 import { useSearch } from '../hooks/useSearch.mjs';
 import { useFilePreview } from '../hooks/useFilePreview/useFilePreview.mjs';
 
-const DEFAULT_PAGE_SIZE = 100;
-const DEFAULT_LIST_OPTIONS = {
-    delimiter: '/',
-    pageSize: DEFAULT_PAGE_SIZE,
-};
 const getDownloadErrorMessageFromFailedDownloadTask = (task) => {
     if (!task)
         return;
     return `Failed to download ${task.data.fileKey ?? task.data.key} due to error: ${task.message}.`;
 };
 const useLocationDetailView = (options) => {
-    const { initialValues, onExit, onNavigate } = options ?? {};
-    const listOptionsRef = React__default.useRef({
-        ...DEFAULT_LIST_OPTIONS,
+    const { pageSize: configPageSize } = usePaginationConfig();
+    const { initialValues = {}, onExit, onNavigate, pageSize: propPageSize, } = options ?? {};
+    const pageSize = propPageSize ?? configPageSize;
+    const listOptions = React__default.useMemo(() => ({
         ...initialValues,
-    });
-    const listOptions = listOptionsRef.current;
+        delimiter: '/',
+        pageSize,
+    }), 
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [pageSize, initialValues.delimiter, initialValues.pageSize]);
     const [{ location, actionType }, storeDispatch] = useStore();
     const [locationItems, locationItemsDispatch] = useLocationItems();
     const fileItemsDispatch = useFileItems()[1];
     const [activeFile, setActiveFile] = React__default.useState();
     const { current, key } = location;
     const { permissions, prefix } = current ?? {};
-    const { fileDataItems } = locationItems;
+    const { dataItems, fileDataItems } = locationItems;
     const hasInvalidPrefix = isUndefined(prefix);
     const [{ task }, handleDownload] = useAction('download');
     const [{ value, isLoading, hasError, message }, handleList] = useList('locationItems');
@@ -166,13 +169,13 @@ const useLocationDetailView = (options) => {
                     actionType: type,
                     icon,
                     isDisabled: isFunction(disable)
-                        ? disable(fileDataItems)
+                        ? disable(dataItems)
                         : disable ?? false,
                     isHidden: isFunction(hide) ? hide(permissions) : hide,
                     label,
                 };
             });
-    }, [actionConfigs, fileDataItems, permissions]);
+    }, [actionConfigs, dataItems, permissions]);
     return {
         actionItems,
         actionType,
@@ -183,6 +186,7 @@ const useLocationDetailView = (options) => {
         page: currentPage,
         pageItems,
         location,
+        dataItems,
         fileDataItems,
         hasError,
         hasDownloadError: task?.status === 'FAILED',
@@ -238,16 +242,16 @@ const useLocationDetailView = (options) => {
             storeDispatch({ type: 'RESET_ACTION_TYPE' });
             locationItemsDispatch({ type: 'RESET_LOCATION_ITEMS' });
         },
-        onSelect: (isSelected, fileItem) => {
+        onSelect: (isSelected, item) => {
             locationItemsDispatch(isSelected
-                ? { type: 'REMOVE_LOCATION_ITEM', id: fileItem.id }
-                : { type: 'SET_LOCATION_ITEMS', items: [fileItem] });
+                ? { type: 'REMOVE_LOCATION_ITEM', id: item.id }
+                : { type: 'SET_LOCATION_ITEMS', items: [item] });
         },
         onToggleSelectAll: () => {
-            const fileItems = pageItems.filter((item) => item.type === 'FILE');
-            locationItemsDispatch(fileItems.length === fileDataItems?.length
+            const selectableItems = pageItems;
+            locationItemsDispatch(selectableItems.length === dataItems?.length
                 ? { type: 'RESET_LOCATION_ITEMS' }
-                : { type: 'SET_LOCATION_ITEMS', items: fileItems });
+                : { type: 'SET_LOCATION_ITEMS', items: selectableItems });
         },
         onSearch: () => {
             setActiveFile(undefined);
@@ -266,4 +270,4 @@ const useLocationDetailView = (options) => {
     };
 };
 
-export { DEFAULT_LIST_OPTIONS, useLocationDetailView };
+export { useLocationDetailView };

package/dist/esm/components/StorageBrowser/views/LocationsView/LocationsView.mjs

@@ -11,10 +11,7 @@ import '@aws-amplify/ui-react-core/elements';
 import '../../credentials/context.mjs';
 import '@aws-amplify/storage/internals';
 import '../../configuration/context.mjs';
-import 'aws-amplify';
-import 'jszip';
-import 'aws-amplify/storage';
-import '../../actions/configs/context.mjs';
+import '../../configuration/paginationContext.mjs';
 import '../../actions/configs/defaults.mjs';
 import '../../displayText/context.mjs';
 import '../../filePreview/context.mjs';

package/dist/esm/components/StorageBrowser/views/LocationsView/LocationsViewProvider.mjs

@@ -11,10 +11,7 @@ import '@aws-amplify/ui-react-core/elements';
 import '../../credentials/context.mjs';
 import '@aws-amplify/storage/internals';
 import '../../configuration/context.mjs';
-import 'aws-amplify';
-import 'jszip';
-import 'aws-amplify/storage';
-import '../../actions/configs/context.mjs';
+import '../../configuration/paginationContext.mjs';
 import '../../actions/configs/defaults.mjs';
 import { useDisplayText } from '../../displayText/context.mjs';
 import '../../filePreview/context.mjs';

package/dist/esm/components/StorageBrowser/views/LocationsView/useLocationsView.mjs

@@ -6,6 +6,10 @@ import 'jszip';
 import 'aws-amplify/storage';
 import '../../actions/configs/context.mjs';
 import '../../actions/configs/defaults.mjs';
+import '@aws-amplify/ui-react-core/elements';
+import '../../credentials/context.mjs';
+import '../../configuration/context.mjs';
+import { usePaginationConfig } from '../../configuration/paginationContext.mjs';
 import { useStore } from '../../store/context.mjs';
 import '../../useAction/context.mjs';
 import { useAction } from '../../useAction/useAction.mjs';
@@ -16,12 +20,8 @@ import { useSearch } from '../hooks/useSearch.mjs';
 const DEFAULT_EXCLUDE = {
     exactPermissions: ['delete', 'write'],
 };
-const DEFAULT_PAGE_SIZE = 100;
-const DEFAULT_LIST_OPTIONS = {
-    exclude: DEFAULT_EXCLUDE,
-    pageSize: DEFAULT_PAGE_SIZE,
-};
 const useLocationsView = (options) => {
+    const { pageSize: configPageSize } = usePaginationConfig();
     const handleDownload = useAction('download')[1];
     const [state, handleList] = useList('locations');
     const dispatchStoreAction = useStore()[1];
@@ -29,12 +29,15 @@ const useLocationsView = (options) => {
     const { items, nextToken, hasExhaustedSearch = false } = value;
     const hasNextToken = !!nextToken;
     const onNavigate = options?.onNavigate;
+    const pageSize = options?.pageSize ?? configPageSize;
     const initialValues = options?.initialValues ?? {};
-    const listOptionsRef = React__default.useRef({
-        ...DEFAULT_LIST_OPTIONS,
+    const listOptions = React__default.useMemo(() => ({
         ...initialValues,
-    });
-    const listOptions = listOptionsRef.current;
+        exclude: DEFAULT_EXCLUDE,
+        pageSize,
+    }), 
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [pageSize, initialValues.pageSize]);
     // initial load
     React__default.useEffect(() => {
         handleList({ options: { ...listOptions, refresh: true } });
@@ -108,4 +111,4 @@ const useLocationsView = (options) => {
     };
 };
 
-export { DEFAULT_LIST_OPTIONS, useLocationsView };
+export { useLocationsView };

package/dist/esm/components/StorageBrowser/views/context/actionViews.mjs

@@ -1,23 +1,27 @@
 import React__default from 'react';
 import { UploadView } from '../LocationActionView/UploadView/UploadView.mjs';
-import '../../fileItems/context.mjs';
-import '@aws-amplify/ui';
-import '../../store/context.mjs';
-import '../../useAction/context.mjs';
 import '@aws-amplify/ui-react-core/elements';
 import '../../credentials/context.mjs';
 import '@aws-amplify/storage/internals';
 import '../../configuration/context.mjs';
+import '../../configuration/paginationContext.mjs';
+import '../../fileItems/context.mjs';
+import '@aws-amplify/ui';
+import '../../store/context.mjs';
+import '../../useAction/context.mjs';
 import '@aws-amplify/ui-react-core';
-import 'aws-amplify';
-import 'jszip';
-import 'aws-amplify/storage';
-import '../../actions/configs/context.mjs';
 import '../../actions/configs/defaults.mjs';
 import { CreateFolderView } from '../LocationActionView/CreateFolderView/CreateFolderView.mjs';
 import { CopyView } from '../LocationActionView/CopyView/CopyView.mjs';
 import '../../locationItems/context.mjs';
 import { DeleteView } from '../LocationActionView/DeleteView/DeleteView.mjs';
+import '../../displayText/context.mjs';
+import '@aws-amplify/ui-react';
+import '../../components/elements/definitions.mjs';
+import '../../components/elements/IconElement.mjs';
+import 'aws-amplify';
+import 'jszip';
+import 'aws-amplify/storage';
 import { DownloadView } from '../LocationActionView/DownloadView/DownloadView.mjs';
 
 const DEFAULT_ACTION_VIEWS = {

package/dist/esm/components/StorageBrowser/views/context/primaryViews.mjs

@@ -8,19 +8,24 @@ import '@aws-amplify/ui-react-core/elements';
 import '../../credentials/context.mjs';
 import '@aws-amplify/storage/internals';
 import '../../configuration/context.mjs';
+import '../../configuration/paginationContext.mjs';
 import '@aws-amplify/ui-react-core';
-import 'aws-amplify';
-import 'jszip';
-import 'aws-amplify/storage';
-import '../../actions/configs/context.mjs';
 import '../../actions/configs/defaults.mjs';
 import '../LocationActionView/CreateFolderView/CreateFolderView.mjs';
 import '../LocationActionView/DeleteView/DeleteView.mjs';
+import '../../displayText/context.mjs';
+import '@aws-amplify/ui-react';
+import '../../components/elements/definitions.mjs';
+import '../../components/elements/IconElement.mjs';
+import 'aws-amplify';
+import 'jszip';
+import 'aws-amplify/storage';
 import '../LocationActionView/DownloadView/DownloadView.mjs';
 import { LocationActionView } from '../LocationActionView/LocationActionView.mjs';
 import '../LocationActionView/UploadView/UploadView.mjs';
 import '../../fileItems/context.mjs';
 import { LocationDetailView } from '../LocationDetailView/LocationDetailView.mjs';
+import '../../actions/configs/context.mjs';
 import '../../filePreview/context.mjs';
 import { LocationsView } from '../LocationsView/LocationsView.mjs';
 

package/dist/esm/components/StorageBrowser/views/hooks/usePaginate.mjs

@@ -1,8 +1,7 @@
 import React__default from 'react';
 import { isFunction } from '@aws-amplify/ui';
 
-const DEFAULT_PAGE_SIZE = 100;
-const usePaginate = ({ items, onPaginate, page = 1, pageSize = DEFAULT_PAGE_SIZE, }) => {
+const usePaginate = ({ items, onPaginate, page = 1, pageSize, }) => {
     const [currentPage, setCurrentPage] = React__default.useState(page);
     const visitedRef = React__default.useRef(page);
     const handleReset = React__default.useRef(() => {
@@ -12,19 +11,31 @@ const usePaginate = ({ items, onPaginate, page = 1, pageSize = DEFAULT_PAGE_SIZE
     }).current;
     return React__default.useMemo(() => {
         const hasItems = Array.isArray(items);
+        const totalItems = hasItems ? items.length : 0;
+        const totalPages = Math.max(1, Math.ceil(totalItems / pageSize));
+        // Auto-adjust current page if it's beyond available pages
+        // For server-side pagination, don't auto-adjust if onPaginate callback is provided
+        let adjustedCurrentPage = currentPage;
+        if (currentPage > totalPages && !isFunction(onPaginate)) {
+            adjustedCurrentPage = totalPages;
+            setCurrentPage(adjustedCurrentPage);
+        }
         const highestPageVisited = visitedRef.current;
-        const isFirstPage = currentPage === 1;
-        const start = isFirstPage ? 0 : (currentPage - 1) * pageSize;
-        const end = isFirstPage ? pageSize : currentPage * pageSize;
+        const isFirstPage = adjustedCurrentPage === 1;
+        const start = isFirstPage ? 0 : (adjustedCurrentPage - 1) * pageSize;
+        const end = isFirstPage ? pageSize : adjustedCurrentPage * pageSize;
         const pageItems = hasItems ? items.slice(start, end) : [];
         return {
-            currentPage,
+            currentPage: adjustedCurrentPage,
             handlePaginate: (page) => {
                 if (page < 1)
                     return;
+                // For server-side pagination, allow going beyond totalPages if onPaginate is provided
+                if (page > totalPages && !isFunction(onPaginate))
+                    return;
                 if (isFunction(onPaginate))
                     onPaginate(page);
-                if (page > currentPage && page > highestPageVisited)
+                if (page > adjustedCurrentPage && page > highestPageVisited)
                     visitedRef.current = page;
                 setCurrentPage(page);
             },

package/dist/esm/components/StorageBrowser/views/utils/tableResolvers/constants.mjs

@@ -26,5 +26,14 @@ const FILE_DATA_ITEM_TABLE_KEYS = [
     'status',
     'cancel',
 ];
+const DELETE_TABLE_KEYS = [
+    'name',
+    'folder',
+    'type',
+    'size',
+    'status',
+    'progress',
+    'cancel',
+];
 
-export { FILE_DATA_ITEM_TABLE_KEYS, STATUS_ICONS, STATUS_LABELS };
+export { DELETE_TABLE_KEYS, FILE_DATA_ITEM_TABLE_KEYS, STATUS_ICONS, STATUS_LABELS };

package/dist/esm/components/StorageBrowser/views/utils/tableResolvers/deleteResolvers.mjs

@@ -1,11 +1,95 @@
-import { noop, capitalize } from '@aws-amplify/ui';
+import { capitalize } from '@aws-amplify/ui';
 import '../../../displayText/context.mjs';
 import { isDeleteViewDisplayTextKey } from '../../../displayText/utils.mjs';
-import { STATUS_LABELS } from './constants.mjs';
-import { cancel, size, type, folder, name, getFileDataCellKey } from './utils.mjs';
+import { STATUS_ICONS, STATUS_LABELS } from './constants.mjs';
+import { getFileSize, getFileType, getCellName } from './utils.mjs';
+import '@aws-amplify/storage/internals';
+import { getFileKey } from '../../../actions/handlers/utils.mjs';
+import 'jszip';
+import 'aws-amplify/storage';
+import '../../../actions/configs/context.mjs';
+import '../../../actions/configs/defaults.mjs';
+import { getFolderName } from '../../LocationActionView/DeleteView/utils.mjs';
 
+const getDeleteCellKey = (data) => `${data.key}-${data.item.data.id}`;
+const getCellDataFolder = (data) => {
+    const { type, key } = data;
+    const fileKey = getFileKey(key);
+    const targetKey = data.key;
+    if (type === 'FOLDER') {
+        const pathWithoutTrailingSlash = targetKey.replace(/\/$/, '');
+        const lastSlashIndex = pathWithoutTrailingSlash.lastIndexOf('/');
+        return lastSlashIndex >= 0
+            ? pathWithoutTrailingSlash.slice(0, lastSlashIndex + 1)
+            : '';
+    }
+    return targetKey.slice(0, -fileKey?.length);
+};
+const name = (data) => {
+    const key = getDeleteCellKey(data);
+    const { item } = data;
+    let text;
+    if (item.data.type === 'FOLDER') {
+        text = `${getFolderName(item.data.key)}/`;
+    }
+    else {
+        text = item.data.fileKey ?? getCellName(item.data.key);
+    }
+    const icon = STATUS_ICONS[item.status];
+    return { key, type: 'text', content: { icon, text } };
+};
+const folder = (data) => {
+    const key = getDeleteCellKey(data);
+    const text = getCellDataFolder(data.item.data);
+    return { key, type: 'text', content: { text } };
+};
+const type = (data) => {
+    const key = getDeleteCellKey(data);
+    if (data.item.data.type === 'FOLDER') {
+        return { key, type: 'text', content: { text: 'Folder' } };
+    }
+    const text = getFileType(data.item.data.key);
+    return { key, type: 'text', content: { text } };
+};
+const size = (data) => {
+    const key = getDeleteCellKey(data);
+    const itemData = data.item.data;
+    if (data.item.data.type === 'FOLDER') {
+        return { key, type: 'text', content: { text: '-' } };
+    }
+    const value = 'size' in itemData ? itemData.size : 0;
+    const displayValue = getFileSize(value);
+    return { key, type: 'number', content: { value, displayValue } };
+};
+const getCancelCellContent = (data) => {
+    const { item, props } = data;
+    const { cancel, status } = item;
+    const { isProcessing, onTaskRemove } = props;
+    const isQueued = status === 'QUEUED';
+    const isRemovable = isQueued && !isProcessing;
+    const isCancelable = isProcessing && !!cancel;
+    const itemAriaValue = getCellName(item.data.fileKey ?? item.data.key);
+    const ariaLabel = `${isRemovable ? 'Remove' : 'Cancel'} item: ${itemAriaValue}`;
+    const isDisabled = !isRemovable && !isCancelable;
+    const onClick = !isCancelable && !isRemovable
+        ? undefined
+        : () => {
+            if (isRemovable) {
+                onTaskRemove?.(item);
+                return;
+            }
+            if (isCancelable)
+                cancel();
+        };
+    return { ariaLabel, isDisabled, onClick, icon: 'cancel' };
+};
+const cancel = (data) => {
+    const key = getDeleteCellKey(data);
+    const content = getCancelCellContent(data);
+    return { key, type: 'button', content };
+};
 const status = (data) => {
-    const key = getFileDataCellKey(data);
+    const key = getDeleteCellKey(data);
     const { item: { status }, props: { displayText }, } = data;
     const statusLabelKey = STATUS_LABELS[status];
     const text = isDeleteViewDisplayTextKey(statusLabelKey)
@@ -13,21 +97,47 @@ const status = (data) => {
         : '';
     return { key, type: 'text', content: { text } };
 };
+const progress = (data) => {
+    const key = getDeleteCellKey(data);
+    const { item } = data;
+    const itemIsFile = item.data.type === 'FILE';
+    if (itemIsFile) {
+        const text = item.status === 'COMPLETE' ? 'Deleted' : '-';
+        return { key, type: 'text', content: { text } };
+    }
+    if ((item.status === 'PENDING' ||
+        item.status === 'FAILED' ||
+        item.status === 'CANCELED') &&
+        item.data.totalCount !== undefined) {
+        const countDisplay = item.data.totalCount ?? '?';
+        const text = `${item.successCount ?? 0}/${countDisplay} files`;
+        return { key, type: 'text', content: { text } };
+    }
+    else if (item.status === 'COMPLETE') {
+        if (item.data.totalCount === null) {
+            const text = `${item.successCount ?? 0} files deleted`;
+            return { key, type: 'text', content: { text } };
+        }
+        const text = `${item.data.totalCount} files deleted`;
+        return { key, type: 'text', content: { text } };
+    }
+    else {
+        const text = item.data.totalCount === null
+            ? 'Count failed'
+            : item.data.totalCount !== undefined
+                ? `${item.data.totalCount} files`
+                : 'Calculating...';
+        return { key, type: 'text', content: { text } };
+    }
+};
 const DELETE_CELL_RESOLVERS = {
     name,
     folder,
     type,
     size,
     status,
+    progress,
     cancel,
-    /**
-     * @deprecated
-     *
-     * non-upload view tables do not include "progress" headers but include here to
-     * keep TS happy as "progress" headers were included in display text interfaces
-     * and cannot be removed from the tables without a breaking change
-     */
-    progress: noop,
 };
 const DELETE_TABLE_RESOLVERS = {
     getCell: (data) => DELETE_CELL_RESOLVERS[data.key](data),
@@ -41,4 +151,4 @@ const DELETE_TABLE_RESOLVERS = {
     getRowKey: ({ item }) => item.data.id,
 };
 
-export { DELETE_TABLE_RESOLVERS };
+export { DELETE_TABLE_RESOLVERS, getCancelCellContent };

package/dist/esm/components/StorageBrowser/views/utils/tableResolvers/utils.mjs

@@ -1,8 +1,8 @@
 import { humanFileSize } from '@aws-amplify/ui';
 import { STATUS_ICONS } from './constants.mjs';
 
-const getFileType = (value, fallback = '') => value.lastIndexOf('.') !== -1
-    ? value.slice(value.lastIndexOf('.') + 1)
+const getFileType = (value, fallback = '') => value?.lastIndexOf?.('.') !== -1
+    ? value?.slice(value?.lastIndexOf?.('.') + 1)
     : fallback;
 const getCellName = (value) => 
 // `value.split` always returns an array with at least one entry
@@ -17,7 +17,7 @@ const getFileDataCellFolder = (task) => {
         ? task.data.sourceKey
         : task.data.key;
     const { fileKey } = task.data;
-    return targetKey.slice(0, -fileKey.length);
+    return targetKey.slice(0, -fileKey?.length);
 };
 const getUploadCellProgress = ({ progress, status, }) => {
     // prefer `progress` if available, 1 if status is complete, default 0

package/dist/esm/version.mjs

@@ -1,3 +1,3 @@
-const VERSION = '3.15.0';
+const VERSION = '3.17.0';
 
 export { VERSION };

package/dist/index.js

@@ -9,7 +9,7 @@ var uiReactCore = require('@aws-amplify/ui-react-core');
 var auth = require('aws-amplify/auth');
 var storage = require('aws-amplify/storage');
 var internal = require('@aws-amplify/ui-react/internal');
-var createStorageBrowser = require('./createStorageBrowser-CG-6mXiT.js');
+var createStorageBrowser = require('./createStorageBrowser-De4hcP-u.js');
 require('@aws-amplify/storage/internals');
 require('aws-amplify');
 require('jszip');