@aws-amplify/ui-react-storage 3.10.3 → 3.12.0

package/dist/esm/components/StorageBrowser/actions/configs/defaults.mjs

@@ -41,12 +41,21 @@ const uploadActionConfig = {
     },
     handler: defaultHandlers.upload,
 };
+const downloadActionConfig = {
+    viewName: 'DownloadView',
+    actionListItem: {
+        disable: (selected) => !selected || selected.length === 0,
+        hide: (permissions) => !permissions.includes('get'),
+        icon: 'download',
+        label: 'Download',
+    },
+    handler: defaultHandlers.download,
+};
 // Action view configs only, does not include `listLocationItems`
 const defaultActionViewConfigs = {
     copy: copyActionConfig,
     createFolder: createFolderActionConfig,
-    // provide `download` handler only; `download` does not have a dedicated view/config
-    download: defaultHandlers.download,
+    download: downloadActionConfig,
     delete: deleteActionConfig,
     upload: uploadActionConfig,
 };
@@ -57,4 +66,4 @@ const defaultActionConfigs = {
     listLocationItems: defaultHandlers.listLocationItems,
 };
 
-export { DEFAULT_ACTION_VIEW_TYPES, copyActionConfig, createFolderActionConfig, defaultActionConfigs, defaultActionViewConfigs, deleteActionConfig, isDefaultActionViewType, uploadActionConfig };
+export { DEFAULT_ACTION_VIEW_TYPES, copyActionConfig, createFolderActionConfig, defaultActionConfigs, defaultActionViewConfigs, deleteActionConfig, downloadActionConfig, isDefaultActionViewType, uploadActionConfig };

package/dist/esm/components/StorageBrowser/actions/handlers/listLocationItems.mjs

@@ -66,7 +66,7 @@ const listLocationItemsHandler = async (input) => {
         nextNextToken = output.nextToken;
         const items = parseResult(output, prefix);
         result.push(...(exclude ? items.filter((item) => item.type !== exclude) : items));
-    } while (nextNextToken && result.length < pageSize);
+    } while (nextNextToken && result.length < _pageSize);
     return { items: result, nextToken: nextNextToken };
 };
 

package/dist/esm/components/StorageBrowser/actions/handlers/listLocations.mjs

@@ -1,6 +1,6 @@
 import { listCallerAccessGrants } from '@aws-amplify/storage/internals';
-import '@aws-amplify/ui';
 import { assertAccountId } from '../../validators/assertAccountId.mjs';
+import '@aws-amplify/ui';
 import { getFilteredLocations } from './utils.mjs';
 
 const DEFAULT_PAGE_SIZE = 1000;

package/dist/esm/components/StorageBrowser/createStorageBrowser/StorageBrowserDefault.mjs

@@ -15,9 +15,10 @@ import '../actions/configs/context.mjs';
 import '../actions/configs/defaults.mjs';
 import '../views/LocationActionView/CreateFolderView/CreateFolderView.mjs';
 import '../views/LocationActionView/DeleteView/DeleteView.mjs';
+import '../views/LocationActionView/DownloadView/DownloadView.mjs';
 import '../views/context/actionViews.mjs';
 import '../views/LocationActionView/UploadView/UploadView.mjs';
-import '../files/context.mjs';
+import '../fileItems/context.mjs';
 import '../views/LocationDetailView/LocationDetailView.mjs';
 import '../views/LocationsView/LocationsView.mjs';
 

package/dist/esm/components/StorageBrowser/createStorageBrowser/createProvider.mjs

@@ -15,7 +15,8 @@ import { componentsDefault } from '../components/defaults.mjs';
 import { createConfigurationProvider } from '../configuration/createConfigurationProvider.mjs';
 import '../configuration/context.mjs';
 import { DisplayTextProvider } from '../displayText/context.mjs';
-import { FilesProvider } from '../files/context.mjs';
+import { FileItemsProvider } from '../fileItems/context.mjs';
+import { defaultValidateFile } from '../fileItems/utils.mjs';
 import { LocationItemsProvider } from '../locationItems/context.mjs';
 import { StoreProvider } from '../store/context.mjs';
 import { ActionHandlersProvider } from '../useAction/context.mjs';
@@ -25,12 +26,13 @@ import { ViewsProvider } from '../views/context/views.mjs';
 import '../views/LocationActionView/CopyView/CopyView.mjs';
 import '../views/LocationActionView/CreateFolderView/CreateFolderView.mjs';
 import '../views/LocationActionView/DeleteView/DeleteView.mjs';
+import '../views/LocationActionView/DownloadView/DownloadView.mjs';
 import '../views/context/actionViews.mjs';
 import '../views/LocationActionView/UploadView/UploadView.mjs';
 import '../views/LocationDetailView/LocationDetailView.mjs';
 import '../views/LocationsView/LocationsView.mjs';
 
-function createProvider({ actions, components, config, }) {
+function createProvider({ actions, components, config, options, }) {
     const { accountId, customEndpoint, registerAuthListener, getLocationCredentials, region, listLocations, } = config;
     const resolvedActions = {
         default: {
@@ -59,6 +61,7 @@ function createProvider({ actions, components, config, }) {
         // override components
         ...components,
     };
+    const { validateFile = defaultValidateFile } = options ?? {};
     /**
      * Provides state, configuration and action values that are shared between
      * the primary View components
@@ -72,7 +75,7 @@ function createProvider({ actions, components, config, }) {
                             React__default.createElement(ViewsProvider, { actions: resolvedActions, views: views },
                                 React__default.createElement(ComponentsProvider, { composables: composables },
                                     React__default.createElement(LocationItemsProvider, null,
-                                        React__default.createElement(FilesProvider, null, children))))))))));
+                                        React__default.createElement(FileItemsProvider, { validateFile: validateFile }, children))))))))));
     }
     return Provider;
 }

package/dist/esm/components/StorageBrowser/createStorageBrowser/createStorageBrowser.mjs

@@ -20,9 +20,10 @@ import '../locationItems/context.mjs';
 import '../store/context.mjs';
 import { CreateFolderView } from '../views/LocationActionView/CreateFolderView/CreateFolderView.mjs';
 import { DeleteView } from '../views/LocationActionView/DeleteView/DeleteView.mjs';
+import { DownloadView } from '../views/LocationActionView/DownloadView/DownloadView.mjs';
 import { LocationActionView } from '../views/LocationActionView/LocationActionView.mjs';
 import { UploadView } from '../views/LocationActionView/UploadView/UploadView.mjs';
-import '../files/context.mjs';
+import '../fileItems/context.mjs';
 import { LocationDetailView } from '../views/LocationDetailView/LocationDetailView.mjs';
 import { LocationsView } from '../views/LocationsView/LocationsView.mjs';
 import { useView } from '../views/useView.mjs';
@@ -61,6 +62,7 @@ function createStorageBrowser(input) {
     StorageBrowser.CopyView = CopyView;
     StorageBrowser.CreateFolderView = CreateFolderView;
     StorageBrowser.DeleteView = DeleteView;
+    StorageBrowser.DownloadView = DownloadView;
     StorageBrowser.UploadView = UploadView;
     StorageBrowser.Provider = Provider;
     StorageBrowser.displayName = 'StorageBrowser';

package/dist/esm/components/StorageBrowser/displayText/context.mjs

@@ -10,7 +10,7 @@ function resolveDisplayText(displayText) {
     if (!displayText)
         return DEFAULT_STORAGE_BROWSER_DISPLAY_TEXT;
     // override
-    const { CopyView, CreateFolderView, DeleteView, LocationDetailView, LocationsView, UploadView, } = displayText;
+    const { CopyView, CreateFolderView, DeleteView, DownloadView, LocationDetailView, LocationsView, UploadView, } = displayText;
     return {
         CopyView: { ...DEFAULT_STORAGE_BROWSER_DISPLAY_TEXT.CopyView, ...CopyView },
         CreateFolderView: {
@@ -21,6 +21,10 @@ function resolveDisplayText(displayText) {
             ...DEFAULT_STORAGE_BROWSER_DISPLAY_TEXT.DeleteView,
             ...DeleteView,
         },
+        DownloadView: {
+            ...DEFAULT_STORAGE_BROWSER_DISPLAY_TEXT.DownloadView,
+            ...DownloadView,
+        },
         LocationDetailView: {
             ...DEFAULT_STORAGE_BROWSER_DISPLAY_TEXT.LocationDetailView,
             ...LocationDetailView,

package/dist/esm/components/StorageBrowser/displayText/libraries/en/default.mjs

@@ -4,11 +4,13 @@ import { DEFAULT_DELETE_VIEW_DISPLAY_TEXT } from './deleteView.mjs';
 import { DEFAULT_LOCATION_DETAIL_VIEW_DISPLAY_TEXT } from './locationDetailView.mjs';
 import { DEFAULT_LOCATIONS_VIEW_DISPLAY_TEXT } from './locationsView.mjs';
 import { DEFAULT_UPLOAD_VIEW_DISPLAY_TEXT } from './uploadView.mjs';
+import { DEFAULT_DOWNLOAD_VIEW_DISPLAY_TEXT } from './downloadView.mjs';
 
 const DEFAULT_STORAGE_BROWSER_DISPLAY_TEXT = {
     CopyView: DEFAULT_COPY_VIEW_DISPLAY_TEXT,
     CreateFolderView: DEFAULT_CREATE_FOLDER_VIEW_DISPLAY_TEXT,
     DeleteView: DEFAULT_DELETE_VIEW_DISPLAY_TEXT,
+    DownloadView: DEFAULT_DOWNLOAD_VIEW_DISPLAY_TEXT,
     LocationDetailView: DEFAULT_LOCATION_DETAIL_VIEW_DISPLAY_TEXT,
     LocationsView: DEFAULT_LOCATIONS_VIEW_DISPLAY_TEXT,
     UploadView: DEFAULT_UPLOAD_VIEW_DISPLAY_TEXT,

package/dist/esm/components/StorageBrowser/displayText/libraries/en/downloadView.mjs

@@ -0,0 +1,23 @@
+import { DEFAULT_ACTION_VIEW_DISPLAY_TEXT } from './shared.mjs';
+
+const DEFAULT_DOWNLOAD_VIEW_DISPLAY_TEXT = {
+    ...DEFAULT_ACTION_VIEW_DISPLAY_TEXT,
+    title: 'Download',
+    actionStartLabel: 'Download',
+    getActionCompleteMessage: (data) => {
+        const { counts } = data ?? {};
+        const { COMPLETE, FAILED, TOTAL } = counts ?? {};
+        if (COMPLETE === TOTAL) {
+            return { content: 'All files downloaded.', type: 'success' };
+        }
+        if (FAILED === TOTAL) {
+            return { content: 'All files failed to download.', type: 'error' };
+        }
+        return {
+            content: `${COMPLETE} files downloaded, ${FAILED} files failed to download.`,
+            type: 'error',
+        };
+    },
+};
+
+export { DEFAULT_DOWNLOAD_VIEW_DISPLAY_TEXT };

package/dist/esm/components/StorageBrowser/displayText/libraries/en/locationDetailView.mjs

@@ -53,6 +53,8 @@ const DEFAULT_LOCATION_DETAIL_VIEW_DISPLAY_TEXT = {
                 return 'Create folder';
             case 'Upload':
                 return 'Upload';
+            case 'Download':
+                return 'Download';
             default:
                 return key;
         }

package/dist/esm/components/StorageBrowser/displayText/libraries/en/uploadView.mjs

@@ -1,6 +1,4 @@
 import { DEFAULT_ACTION_VIEW_DISPLAY_TEXT } from './shared.mjs';
-import '@aws-amplify/ui';
-import { isFileTooBig } from '../../../validators/isFileTooBig.mjs';
 
 const DEFAULT_UPLOAD_VIEW_DISPLAY_TEXT = {
     ...DEFAULT_ACTION_VIEW_DISPLAY_TEXT,
@@ -67,13 +65,12 @@ const DEFAULT_UPLOAD_VIEW_DISPLAY_TEXT = {
         if (!data?.invalidFiles) {
             return undefined;
         }
-        const tooBigFileNames = data.invalidFiles
-            .filter(({ file }) => isFileTooBig(file))
+        const invalidFileNames = data.invalidFiles
             .map(({ file }) => file.name)
             .join(', ');
-        if (tooBigFileNames) {
+        if (invalidFileNames) {
             return {
-                content: `Files larger than 160GB cannot be added to the upload queue: ${tooBigFileNames}`,
+                content: `Files larger than 160GB cannot be added to the upload queue: ${invalidFileNames}`,
                 type: 'warning',
             };
         }

package/dist/esm/components/StorageBrowser/displayText/utils.mjs

@@ -1,7 +1,9 @@
 import { DEFAULT_COPY_VIEW_DISPLAY_TEXT } from './libraries/en/copyView.mjs';
 import { DEFAULT_DELETE_VIEW_DISPLAY_TEXT } from './libraries/en/deleteView.mjs';
+import { DEFAULT_DOWNLOAD_VIEW_DISPLAY_TEXT } from './libraries/en/downloadView.mjs';
 
 const isCopyViewDisplayTextKey = (value) => !!DEFAULT_COPY_VIEW_DISPLAY_TEXT[value];
 const isDeleteViewDisplayTextKey = (value) => !!DEFAULT_DELETE_VIEW_DISPLAY_TEXT[value];
+const isDownloadViewDisplayTextKey = (value) => !!DEFAULT_DOWNLOAD_VIEW_DISPLAY_TEXT[value];
 
-export { isCopyViewDisplayTextKey, isDeleteViewDisplayTextKey };
+export { isCopyViewDisplayTextKey, isDeleteViewDisplayTextKey, isDownloadViewDisplayTextKey };

package/dist/esm/components/StorageBrowser/fileItems/constants.mjs

@@ -0,0 +1,11 @@
+const DEFAULT_STATE = {
+    validItems: undefined,
+    invalidItems: undefined,
+};
+const DEFAULT_RESOLVED_FILES = {
+    validFiles: undefined,
+    invalidFiles: undefined,
+};
+const UPLOAD_FILE_SIZE_LIMIT = 160 * 1000 * 1000 * 1000;
+
+export { DEFAULT_RESOLVED_FILES, DEFAULT_STATE, UPLOAD_FILE_SIZE_LIMIT };

package/dist/esm/components/StorageBrowser/fileItems/context.mjs

@@ -0,0 +1,42 @@
+import React__default from 'react';
+import { noop } from '@aws-amplify/ui';
+import { createContextUtilities } from '@aws-amplify/ui-react-core';
+import { useFileSelect } from '@aws-amplify/ui-react/internal';
+import { DEFAULT_STATE } from './constants.mjs';
+import { fileItemsReducer } from './fileItemsReducer.mjs';
+import { resolveFiles, parseFileSelectParams } from './utils.mjs';
+
+const defaultValue = [DEFAULT_STATE, noop];
+const { FileItemsContext, useFileItems } = createContextUtilities({
+    contextName: 'FileItems',
+    defaultValue,
+});
+function FileItemsProvider({ children, validateFile, }) {
+    const [state, dispatch] = React__default.useReducer(fileItemsReducer, DEFAULT_STATE);
+    const [fileInput, handleFileSelect] = useFileSelect((nextFiles) => {
+        dispatch({
+            type: 'ADD_FILE_ITEMS',
+            ...resolveFiles(nextFiles, validateFile),
+        });
+    });
+    const handleFilesAction = React__default.useCallback((action) => {
+        if (action.type === 'SELECT_FILES') {
+            handleFileSelect(...parseFileSelectParams(action.selectionType));
+        }
+        else if (action.type === 'ADD_FILES') {
+            dispatch({
+                type: 'ADD_FILE_ITEMS',
+                ...resolveFiles(action.files, validateFile),
+            });
+        }
+        else {
+            dispatch(action);
+        }
+    }, [handleFileSelect, validateFile]);
+    const value = React__default.useMemo(() => [state, handleFilesAction], [state, handleFilesAction]);
+    return (React__default.createElement(FileItemsContext.Provider, { value: value },
+        fileInput,
+        children));
+}
+
+export { FileItemsContext, FileItemsProvider, useFileItems };

package/dist/esm/components/StorageBrowser/fileItems/fileItemsReducer.mjs

@@ -0,0 +1,33 @@
+import { DEFAULT_STATE } from './constants.mjs';
+import { processFileItems } from './utils.mjs';
+
+const fileItemsReducer = (state, action) => {
+    switch (action.type) {
+        case 'ADD_FILE_ITEMS': {
+            if (!action.validFiles?.length && !action.invalidFiles?.length) {
+                return state;
+            }
+            const validItems = processFileItems(state.validItems, action.validFiles);
+            // `invalidItems` should only track invalid items from latest action taken
+            const invalidItems = processFileItems(undefined, action.invalidFiles);
+            return { validItems, invalidItems };
+        }
+        case 'REMOVE_FILE_ITEM': {
+            const { validItems: prevItems } = state;
+            if (!prevItems?.length)
+                return state;
+            const nextItems = prevItems.filter(({ id }) => id !== action.id);
+            if (nextItems.length === prevItems.length)
+                return state;
+            // `validItems` is strictly undefined if it has 0 file items
+            // otherwise, `validItems` is guaranteed to have at least 1+ file items
+            const validItems = nextItems.length ? nextItems : undefined;
+            return { ...state, validItems };
+        }
+        case 'RESET_FILE_ITEMS': {
+            return DEFAULT_STATE;
+        }
+    }
+};
+
+export { fileItemsReducer };

package/dist/esm/components/StorageBrowser/fileItems/utils.mjs

@@ -0,0 +1,55 @@
+import { isUndefined, isString, isEmpty } from '@aws-amplify/ui';
+import { UPLOAD_FILE_SIZE_LIMIT, DEFAULT_RESOLVED_FILES } from './constants.mjs';
+
+const compareFileItems = (prev, next) => prev.key.localeCompare(next.key);
+const constructFiles = (files, file) => isUndefined(files) ? [file] : files.concat(file);
+const defaultValidateFile = (file) => file.size <= UPLOAD_FILE_SIZE_LIMIT;
+const resolveFiles = (files, validateFile) => {
+    if (!files?.length)
+        return DEFAULT_RESOLVED_FILES;
+    if (!validateFile)
+        return { validFiles: files, invalidFiles: undefined };
+    return files.reduce((acc, file) => {
+        if (validateFile(file)) {
+            acc.validFiles = constructFiles(acc.validFiles, file);
+        }
+        else {
+            acc.invalidFiles = constructFiles(acc.invalidFiles, file);
+        }
+        return acc;
+    }, 
+    // create new copy of default to be modified
+    { ...DEFAULT_RESOLVED_FILES });
+};
+const processFileItems = (prevItems, files) => {
+    if (!files?.length)
+        return prevItems;
+    // construct `nextItems` and filter out existing `file` entries
+    const nextItems = files.reduce((items, file) => {
+        const { name, webkitRelativePath } = file;
+        return prevItems?.some(({ file: existing }) => existing.name === name &&
+            existing.webkitRelativePath === webkitRelativePath)
+            ? items
+            : items.concat({
+                key: isEmpty(webkitRelativePath) ? name : webkitRelativePath,
+                id: crypto.randomUUID(),
+                file,
+            });
+    }, []);
+    if (!nextItems.length)
+        return prevItems;
+    if (!prevItems?.length) {
+        return nextItems.sort(compareFileItems);
+    }
+    return prevItems?.concat(nextItems).sort(compareFileItems);
+};
+const parseFileSelectParams = (value) => {
+    if (isUndefined(value))
+        return ['FILE', undefined];
+    if (isString(value))
+        return [value, undefined];
+    const [selectType, ...rest] = value;
+    return [selectType, !rest?.length ? undefined : { accept: rest.join() }];
+};
+
+export { defaultValidateFile, parseFileSelectParams, processFileItems, resolveFiles };

package/dist/esm/components/StorageBrowser/useAction/utils.mjs

@@ -6,12 +6,12 @@ import { isDefaultActionViewType } from '../actions/configs/defaults.mjs';
 
 const resolveHandler = (value) => (isFunction(value) ? value : value.handler);
 const getActionHandlers = (configs) => {
-    const { copy: copyConfig, createFolder: createFolderConfig, delete: deleteConfig, download, upload: uploadConfig, listLocationItems, listLocations, } = configs.default;
+    const { copy: copyConfig, createFolder: createFolderConfig, delete: deleteConfig, download: downloadConfig, upload: uploadConfig, listLocationItems, listLocations, } = configs.default;
     const defaultHandlers = {
         copy: copyConfig.handler,
         createFolder: createFolderConfig.handler,
         delete: deleteConfig.handler,
-        download,
+        download: 'handler' in downloadConfig ? downloadConfig.handler : downloadConfig,
         listLocationItems,
         listLocations,
         upload: uploadConfig.handler,

package/dist/esm/components/StorageBrowser/views/LocationActionView/CopyView/CopyViewProvider.mjs

@@ -9,7 +9,8 @@ import '@aws-amplify/ui-react-core';
 import '@aws-amplify/ui-react-core/elements';
 import { useDisplayText } from '../../../displayText/context.mjs';
 import useResolveTableData from '../../hooks/useResolveTableData/useResolveTableData.mjs';
-import { COPY_TABLE_RESOLVERS, COPY_TABLE_KEYS } from '../../utils/tableResolvers/copyResolvers.mjs';
+import { COPY_TABLE_RESOLVERS } from '../../utils/tableResolvers/copyResolvers.mjs';
+import { FILE_DATA_ITEM_TABLE_KEYS } from '../../utils/tableResolvers/constants.mjs';
 import { FoldersMessageProvider } from './FoldersMessageControl.mjs';
 import { FoldersPaginationProvider } from './FoldersPaginationControl.mjs';
 import { FoldersTableProvider } from './FoldersTableControl.mjs';
@@ -19,7 +20,7 @@ function CopyViewProvider({ children, ...props }) {
     const { actionCancelLabel, actionDestinationLabel, actionExitLabel, actionStartLabel, getActionCompleteMessage, overwriteWarningMessage, searchPlaceholder, searchSubmitLabel, searchClearLabel, statusDisplayCanceledLabel, statusDisplayCompletedLabel, statusDisplayFailedLabel, statusDisplayQueuedLabel, title, } = displayText;
     const { destination, folders, isProcessing, isProcessingComplete, statusCounts, tasks: items, onActionCancel, onActionExit, onActionStart, onSelectDestination, onTaskRemove, } = props;
     const { hasNextPage, highestPageVisited, hasError: hasFoldersError, message: foldersErrorMessage, query, hasExhaustedSearch, isLoading, page, pageItems, onPaginate, onQuery, onSearchClear, onSearch, onSelectFolder, } = folders;
-    const tableData = useResolveTableData(COPY_TABLE_KEYS, COPY_TABLE_RESOLVERS, {
+    const tableData = useResolveTableData(FILE_DATA_ITEM_TABLE_KEYS, COPY_TABLE_RESOLVERS, {
         items,
         props: { displayText, isProcessing, onTaskRemove },
     });

package/dist/esm/components/StorageBrowser/views/LocationActionView/CreateFolderView/CreateFolderViewProvider.mjs

@@ -1,7 +1,6 @@
 import React__default from 'react';
 import { ControlsContextProvider } from '../../../controls/context.mjs';
 import { useDisplayText } from '../../../displayText/context.mjs';
-import '@aws-amplify/ui';
 import { isValidFolderName } from './utils.mjs';
 
 function CreateFolderViewProvider({ children, ...props }) {

package/dist/esm/components/StorageBrowser/views/LocationActionView/DeleteView/DeleteViewProvider.mjs

@@ -1,9 +1,10 @@
 import React__default from 'react';
 import { ControlsContextProvider } from '../../../controls/context.mjs';
 import { useDisplayText } from '../../../displayText/context.mjs';
-import '@aws-amplify/ui';
 import useResolveTableData from '../../hooks/useResolveTableData/useResolveTableData.mjs';
-import { DELETE_TABLE_RESOLVERS, DELETE_TABLE_KEYS } from '../../utils/tableResolvers/deleteResolvers.mjs';
+import '@aws-amplify/ui';
+import { FILE_DATA_ITEM_TABLE_KEYS } from '../../utils/tableResolvers/constants.mjs';
+import { DELETE_TABLE_RESOLVERS } from '../../utils/tableResolvers/deleteResolvers.mjs';
 
 function DeleteViewProvider({ children, ...props }) {
     const { DeleteView: displayText } = useDisplayText();
@@ -12,7 +13,7 @@ function DeleteViewProvider({ children, ...props }) {
     const message = isProcessingComplete
         ? getActionCompleteMessage({ counts: statusCounts })
         : undefined;
-    const tableData = useResolveTableData(DELETE_TABLE_KEYS, DELETE_TABLE_RESOLVERS, {
+    const tableData = useResolveTableData(FILE_DATA_ITEM_TABLE_KEYS, DELETE_TABLE_RESOLVERS, {
         items,
         props: { displayText, isProcessing, onTaskRemove },
     });

package/dist/esm/components/StorageBrowser/views/LocationActionView/DownloadView/DownloadView.mjs

@@ -0,0 +1,47 @@
+import React__default from 'react';
+import '@aws-amplify/ui-react';
+import { ViewElement } from '../../../components/elements/definitions.mjs';
+import '../../../components/elements/IconElement.mjs';
+import { ActionCancelControl } from '../../../controls/ActionCancelControl.mjs';
+import { ActionExitControl } from '../../../controls/ActionExitControl.mjs';
+import { ActionStartControl } from '../../../controls/ActionStartControl.mjs';
+import { DataTableControl } from '../../../controls/DataTableControl.mjs';
+import { MessageControl } from '../../../controls/MessageControl.mjs';
+import { StatusDisplayControl } from '../../../controls/StatusDisplayControl.mjs';
+import { TitleControl } from '../../../controls/TitleControl.mjs';
+import { classNames } from '@aws-amplify/ui';
+import { STORAGE_BROWSER_BLOCK } from '../../../components/base/constants.mjs';
+import '../../../components/composables/context.mjs';
+import '@aws-amplify/ui-react-core';
+import '@aws-amplify/ui-react-core/elements';
+import { DownloadViewProvider } from './DownloadViewProvider.mjs';
+import { useDownloadView } from './useDownloadView.mjs';
+
+const DownloadView = ({ className, ...props }) => {
+    const state = useDownloadView(props);
+    return (React__default.createElement(ViewElement, { className: classNames(STORAGE_BROWSER_BLOCK, className) },
+        React__default.createElement(DownloadViewProvider, { ...state },
+            React__default.createElement(ActionExitControl, null),
+            React__default.createElement(TitleControl, null),
+            React__default.createElement(ViewElement, { className: `${STORAGE_BROWSER_BLOCK}__data-table` },
+                React__default.createElement(DataTableControl, null)),
+            React__default.createElement(ViewElement, { className: `${STORAGE_BROWSER_BLOCK}__summary` },
+                React__default.createElement(StatusDisplayControl, null)),
+            React__default.createElement(ViewElement, { className: `${STORAGE_BROWSER_BLOCK}__footer` },
+                React__default.createElement(ViewElement, { className: `${STORAGE_BROWSER_BLOCK}__message` },
+                    React__default.createElement(MessageControl, null)),
+                React__default.createElement(ViewElement, { className: `${STORAGE_BROWSER_BLOCK}__buttons` },
+                    React__default.createElement(ActionCancelControl, null),
+                    React__default.createElement(ActionStartControl, null))))));
+};
+DownloadView.displayName = 'DownloadView';
+DownloadView.Provider = DownloadViewProvider;
+DownloadView.Cancel = ActionCancelControl;
+DownloadView.Exit = ActionExitControl;
+DownloadView.Message = MessageControl;
+DownloadView.Start = ActionStartControl;
+DownloadView.Statuses = StatusDisplayControl;
+DownloadView.TasksTable = DataTableControl;
+DownloadView.Title = TitleControl;
+
+export { DownloadView };

package/dist/esm/components/StorageBrowser/views/LocationActionView/DownloadView/DownloadViewProvider.mjs

@@ -0,0 +1,38 @@
+import React__default from 'react';
+import { ControlsContextProvider } from '../../../controls/context.mjs';
+import { useDisplayText } from '../../../displayText/context.mjs';
+import useResolveTableData from '../../hooks/useResolveTableData/useResolveTableData.mjs';
+import '@aws-amplify/ui';
+import { FILE_DATA_ITEM_TABLE_KEYS } from '../../utils/tableResolvers/constants.mjs';
+import { DOWNLOAD_TABLE_RESOLVERS } from '../../utils/tableResolvers/downloadResolvers.mjs';
+
+function DownloadViewProvider({ children, ...props }) {
+    const { DownloadView: displayText } = useDisplayText();
+    const { actionCancelLabel, actionExitLabel, actionStartLabel, title, statusDisplayCanceledLabel, statusDisplayCompletedLabel, statusDisplayFailedLabel, statusDisplayQueuedLabel, getActionCompleteMessage, } = displayText;
+    const { isProcessing, isProcessingComplete, statusCounts, tasks: items, onActionCancel, onActionStart, onActionExit, onTaskRemove, } = props;
+    const message = isProcessingComplete
+        ? getActionCompleteMessage({ counts: statusCounts })
+        : undefined;
+    const tableData = useResolveTableData(FILE_DATA_ITEM_TABLE_KEYS, DOWNLOAD_TABLE_RESOLVERS, {
+        items,
+        props: { displayText, isProcessing, onTaskRemove },
+    });
+    return (React__default.createElement(ControlsContextProvider, { data: {
+            actionCancelLabel,
+            actionExitLabel,
+            actionStartLabel,
+            isActionCancelDisabled: !isProcessing || isProcessingComplete,
+            isActionExitDisabled: isProcessing,
+            isActionStartDisabled: isProcessing || isProcessingComplete,
+            statusDisplayCanceledLabel,
+            statusDisplayCompletedLabel,
+            statusDisplayFailedLabel,
+            statusDisplayQueuedLabel,
+            statusCounts,
+            tableData,
+            title,
+            message,
+        }, onActionStart: onActionStart, onActionExit: onActionExit, onActionCancel: onActionCancel }, children));
+}
+
+export { DownloadViewProvider };

package/dist/esm/components/StorageBrowser/views/LocationActionView/DownloadView/useDownloadView.mjs

@@ -0,0 +1,66 @@
+import React__default from 'react';
+import { isFunction } from '@aws-amplify/ui';
+import { useLocationItems } from '../../../locationItems/context.mjs';
+import { useStore } from '../../../store/context.mjs';
+import '../../../useAction/context.mjs';
+import { useAction } from '../../../useAction/useAction.mjs';
+import '@aws-amplify/ui-react-core';
+import '@aws-amplify/ui-react-core/elements';
+import '../../../credentials/context.mjs';
+import '@aws-amplify/storage/internals';
+import '../../../configuration/context.mjs';
+import 'aws-amplify/storage';
+import '../../../actions/configs/context.mjs';
+import '../../../actions/configs/defaults.mjs';
+
+// assign to constant to ensure referential equality
+const EMPTY_ITEMS = [];
+const useDownloadView = (options) => {
+    const { onExit: _onExit } = options ?? {};
+    const [{ location }, storeDispatch] = useStore();
+    const [locationItems, locationItemsDispatch] = useLocationItems();
+    const { current } = location;
+    const { fileDataItems: items = EMPTY_ITEMS } = locationItems;
+    const [processState, handleProcess] = useAction('download', {
+        items,
+    });
+    const { isProcessing, isProcessingComplete, statusCounts, tasks } = processState;
+    const onActionStart = () => {
+        if (!current)
+            return;
+        handleProcess();
+    };
+    const onActionCancel = () => {
+        tasks.forEach((task) => {
+            // Calling cancel on task works only on queued tasks.
+            // In case of download, all download presigned url open at once
+            // When certain threshold is reached for queuing inside StorageBrowser, cancel might be possible.
+            if (isFunction(task.cancel))
+                task.cancel();
+        });
+    };
+    const onActionExit = () => {
+        // clear files state
+        locationItemsDispatch({ type: 'RESET_LOCATION_ITEMS' });
+        // clear selected action
+        storeDispatch({ type: 'RESET_ACTION_TYPE' });
+        if (isFunction(_onExit))
+            _onExit(current);
+    };
+    const onTaskRemove = React__default.useCallback(({ data }) => {
+        locationItemsDispatch({ type: 'REMOVE_LOCATION_ITEM', id: data.id });
+    }, [locationItemsDispatch]);
+    return {
+        isProcessing,
+        isProcessingComplete,
+        location,
+        statusCounts,
+        tasks,
+        onActionCancel,
+        onActionExit,
+        onActionStart,
+        onTaskRemove,
+    };
+};
+
+export { useDownloadView };

package/dist/esm/components/StorageBrowser/views/LocationActionView/UploadView/UploadView.mjs

@@ -18,6 +18,7 @@ import { DataTableControl } from '../../../controls/DataTableControl.mjs';
 import { DropZoneControl } from '../../../controls/DropZoneControl.mjs';
 import { MessageControl } from '../../../controls/MessageControl.mjs';
 import { OverwriteToggleControl } from '../../../controls/OverwriteToggleControl.mjs';
+import { PaginationControl } from '../../../controls/PaginationControl.mjs';
 import { StatusDisplayControl } from '../../../controls/StatusDisplayControl.mjs';
 import { TitleControl } from '../../../controls/TitleControl.mjs';
 import { UploadViewProvider } from './UploadViewProvider.mjs';
@@ -32,6 +33,7 @@ const UploadView = ({ className, ...props }) => {
             React__default.createElement(ViewElement, { className: `${STORAGE_BROWSER_BLOCK}__controls` },
                 React__default.createElement(OverwriteToggleControl, null),
                 React__default.createElement(ViewElement, { className: `${STORAGE_BROWSER_BLOCK}__buttons` },
+                    React__default.createElement(PaginationControl, null),
                     React__default.createElement(AddFolderControl, null),
                     React__default.createElement(AddFilesControl, null))),
             React__default.createElement(DropZoneControl, null,
@@ -51,6 +53,7 @@ UploadView.displayName = 'UploadView';
 UploadView.Provider = UploadViewProvider;
 UploadView.AddFiles = AddFilesControl;
 UploadView.AddFolder = AddFolderControl;
+UploadView.Pagination = PaginationControl;
 UploadView.Cancel = ActionCancelControl;
 UploadView.Destination = ActionDestinationControl;
 UploadView.DropZone = DropZoneControl;