feat(react-storage): refactor useView action related hooks

packages/react-storage/jest.config.ts

@@ -16,10 +16,10 @@ const config: Config = {
       // functions: 90,
       // lines: 95,
       // statements: 95,
-      branches: 81,
-      functions: 85.8,
+      branches: 81.5,
+      functions: 86.5,
       lines: 93,
-      statements: 92.7,
+      statements: 93,
     },
   },
   moduleNameMapper: { '^uuid$': '<rootDir>/../../node_modules/uuid' },

packages/react-storage/src/components/StorageBrowser/actions/__tests__/createEnhancedListHandler.spec.ts

@@ -7,7 +7,7 @@ import {
   ListHandler,
   ListHandlerInput,
   ListHandlerOutput,
-} from '../types';
+} from '../handlers';
 
 const mockAction = jest.fn();
 

packages/react-storage/src/components/StorageBrowser/actions/configs/types.ts

@@ -10,8 +10,8 @@ import {
   CreateFolderHandler,
   DeleteHandler,
   CopyHandler,
+  TaskHandler,
 } from '../handlers';
-import { TaskHandler } from '../types';
 
 type StringWithoutSpaces<T extends string> = Exclude<
   T,

packages/react-storage/src/components/StorageBrowser/actions/createEnhancedListHandler.ts

@@ -5,7 +5,7 @@ import {
   ListHandlerOptions,
   ListHandlerInput,
   ListHandlerOutput,
-} from './types';
+} from './handlers';
 
 interface SearchOptions<T> {
   query: string;

packages/react-storage/src/components/StorageBrowser/actions/handlers/__tests__/copy.spec.ts

@@ -15,7 +15,8 @@ const baseInput: CopyHandlerInput = {
   },
   data: {
     id: 'identity',
-    key: 'some-key',
+    key: 'some-prefixfix/some-key.hehe',
+    fileKey: 'some-key.hehe',
     lastModified: new Date(),
     size: 100000000,
     type: 'FILE',
@@ -35,7 +36,7 @@ describe('copyHandler', () => {
       destination: {
         expectedBucketOwner: baseInput.config.accountId,
         bucket,
-        path: `${baseInput.destinationPrefix}${baseInput.data.key}`,
+        path: `${baseInput.destinationPrefix}${baseInput.data.fileKey}`,
       },
       source: {
         expectedBucketOwner: `${baseInput.config.accountId}`,

packages/react-storage/src/components/StorageBrowser/actions/handlers/__tests__/delete.spec.ts

@@ -14,7 +14,8 @@ const baseInput: DeleteHandlerInput = {
   },
   data: {
     id: 'id',
-    key: 'prefix/key',
+    key: 'prefix/key.png',
+    fileKey: 'key.png',
     lastModified: new Date(),
     size: 829292,
     type: 'FILE',

packages/react-storage/src/components/StorageBrowser/actions/handlers/__tests__/download.spec.ts

@@ -14,7 +14,8 @@ const baseInput: DownloadHandlerInput = {
   },
   data: {
     id: 'id',
-    key: 'key',
+    key: 'prefix/file-name',
+    fileKey: 'file-name',
     lastModified: new Date(),
     size: 1000022,
     type: 'FILE',

packages/react-storage/src/components/StorageBrowser/actions/handlers/__tests__/utils.spec.ts

@@ -1,7 +1,7 @@
 import { LocationAccess } from '../../../storage-internal';
 import { LocationData } from '../types';
 
-import { parseLocationAccess } from '../utils';
+import { getFileKey, parseLocationAccess } from '../utils';
 
 describe('parseLocationAccess', () => {
   const bucket = 'test-bucket';
@@ -93,3 +93,14 @@ describe('parseLocationAccess', () => {
     expect(parseLocationAccess(location)).toStrictEqual(expected);
   });
 });
+
+describe('getFileKey', () => {
+  it('should return the filename without the path', () => {
+    expect(getFileKey('/path/to/file.txt')).toBe('file.txt');
+    expect(getFileKey('document.pdf')).toBe('document.pdf');
+  });
+
+  it('should handle paths with multiple slashes', () => {
+    expect(getFileKey('/path//to///file.txt')).toBe('file.txt');
+  });
+});

packages/react-storage/src/components/StorageBrowser/actions/handlers/copy.ts

@@ -1,17 +1,15 @@
 import { copy } from '../../storage-internal';
-import { getFilenameWithoutPrefix } from '../../views/LocationActionView/utils';
 import {
+  FileDataItem,
   TaskHandler,
   TaskHandlerInput,
-  TaskData,
   TaskHandlerOptions,
   TaskHandlerOutput,
-} from '../types';
-import { FileData } from './listLocationItems';
+} from './types';
 
 import { constructBucket } from './utils';
 
-export interface CopyHandlerData extends TaskData, FileData {}
+export interface CopyHandlerData extends FileDataItem {}
 
 export interface CopyHandlerInput
   extends TaskHandlerInput<CopyHandlerData, TaskHandlerOptions> {
@@ -29,11 +27,11 @@ export const copyHandler: CopyHandler = (input) => {
     credentials,
     customEndpoint,
   } = config;
-  const { key: sourcePath } = data;
+  const { key: sourcePath, fileKey } = data;
 
   const bucket = constructBucket(config);
 
-  const destinationPath = `${path}${getFilenameWithoutPrefix(sourcePath)}`;
+  const destinationPath = `${path}${fileKey}`;
   const source = { bucket, expectedBucketOwner, path: sourcePath };
   const destination = { bucket, expectedBucketOwner, path: destinationPath };
 

packages/react-storage/src/components/StorageBrowser/actions/handlers/createFolder.ts

@@ -4,7 +4,7 @@ import {
   TaskHandlerInput,
   TaskHandlerOutput,
   TaskHandlerOptions,
-} from '../types';
+} from './types';
 
 export interface CreateFolderHandlerData extends TaskData {}
 export interface CreateFolderHandlerOptions extends TaskHandlerOptions {

packages/react-storage/src/components/StorageBrowser/actions/handlers/delete.ts

@@ -5,15 +5,14 @@ import {
   TaskHandlerOptions,
   TaskHandlerInput,
   TaskHandlerOutput,
-  TaskData,
-} from '../types';
-import { FileData } from './listLocationItems';
+  FileDataItem,
+} from './types';
 
 import { constructBucket } from './utils';
 
 export interface DeleteHandlerOptions extends TaskHandlerOptions {}
 
-export interface DeleteHandlerData extends TaskData, FileData {}
+export interface DeleteHandlerData extends FileDataItem {}
 
 export interface DeleteHandlerInput
   extends TaskHandlerInput<DeleteHandlerData, DeleteHandlerOptions> {}

packages/react-storage/src/components/StorageBrowser/actions/handlers/download.ts

@@ -1,15 +1,15 @@
 import { getUrl } from '../../storage-internal';
 import {
-  TaskData,
+  FileDataItem,
   TaskHandler,
   TaskHandlerInput,
   TaskHandlerOptions,
   TaskHandlerOutput,
-} from '../types';
-import { FileData } from './listLocationItems';
+} from './types';
+
 import { constructBucket } from './utils';
 
-export interface DownloadHandlerData extends TaskData, FileData {}
+export interface DownloadHandlerData extends FileDataItem {}
 export interface DownloadHandlerOptions extends TaskHandlerOptions {}
 
 export interface DownloadHandlerInput

packages/react-storage/src/components/StorageBrowser/actions/handlers/index.ts

@@ -5,5 +5,5 @@ export * from './download';
 export * from './listLocationItems';
 export * from './listLocations';
 export * from './upload';
-
+export * from './utils';
 export * from './types';

packages/react-storage/src/components/StorageBrowser/actions/handlers/listLocationItems.ts

@@ -9,28 +9,13 @@ import {
   ListHandlerInput,
   ListHandlerOptions,
   ListHandlerOutput,
-} from '../types';
+  LocationItemData,
+} from './types';
 
 const DEFAULT_PAGE_SIZE = 1000;
 
-export interface FolderData {
-  key: string;
-  id: string;
-  type: 'FOLDER';
-}
-
-export interface FileData {
-  key: string;
-  lastModified: Date;
-  id: string;
-  size: number;
-  type: 'FILE';
-}
-
 type ListOutputItem = ListOutput['items'][number];
 
-export type LocationItemData = FileData | FolderData;
-
 export type LocationItemType = LocationItemData['type'];
 
 export interface ListLocationItemsHandlerOptions

packages/react-storage/src/components/StorageBrowser/actions/handlers/listLocations.ts

@@ -9,7 +9,7 @@ import {
   ListHandlerInput,
   ListHandlerOutput,
   ListHandler,
-} from '../types';
+} from './types';
 
 import { LocationData } from './types';
 import { parseLocations, ExcludeType } from './utils';

packages/react-storage/src/components/StorageBrowser/actions/handlers/types.ts

@@ -1,4 +1,7 @@
-import { Permission } from '../../storage-internal';
+import {
+  LocationCredentialsProvider,
+  Permission,
+} from '../../storage-internal';
 
 export type LocationType = 'OBJECT' | 'PREFIX' | 'BUCKET';
 
@@ -33,3 +36,87 @@ export interface LocationData {
    */
   type: LocationType;
 }
+
+export interface FolderData {
+  key: string;
+  id: string;
+  type: 'FOLDER';
+}
+
+export interface FileData {
+  key: string;
+  lastModified: Date;
+  id: string;
+  size: number;
+  type: 'FILE';
+}
+
+export type LocationItemData = FileData | FolderData;
+
+export interface FileDataItem extends FileData, TaskData {
+  fileKey: string;
+}
+
+export interface FileItem extends TaskData {
+  file: File;
+}
+
+export interface ActionInputConfig {
+  accountId?: string;
+  bucket: string;
+  credentials: LocationCredentialsProvider;
+  customEndpoint?: string;
+  region: string;
+}
+
+interface ActionInput<T = any> {
+  config: ActionInputConfig;
+  prefix: string;
+  options?: T;
+}
+
+export interface TaskData {
+  key: string;
+  id: string;
+}
+
+export interface TaskHandlerOptions {
+  onProgress?: (
+    data: { key: string; id: string },
+    progress: number | undefined
+  ) => void;
+}
+
+export interface TaskHandlerInput<
+  T extends TaskData = TaskData,
+  K extends TaskHandlerOptions = TaskHandlerOptions,
+> {
+  config: ActionInputConfig;
+  data: T;
+  options?: K;
+}
+
+export interface TaskHandlerOutput {
+  cancel?: () => void;
+  result: Promise<{
+    message?: string;
+    status: 'CANCELED' | 'COMPLETE' | 'FAILED' | 'OVERWRITE_PREVENTED';
+  }>;
+}
+
+export type TaskHandler<T = any, K = any> = (input: T) => K;
+
+export interface ListHandlerOptions<T = never> {
+  exclude?: T;
+  nextToken?: string;
+  pageSize?: number;
+}
+
+export interface ListHandlerInput<T = any> extends ActionInput<T> {}
+
+export interface ListHandlerOutput<T = any> {
+  nextToken: string | undefined;
+  items: T[];
+}
+
+export type ListHandler<T = any, K = any> = (input: T) => Promise<K>;

packages/react-storage/src/components/StorageBrowser/actions/handlers/upload.ts

@@ -9,7 +9,7 @@ import {
   TaskHandlerInput,
   TaskHandlerOutput,
   TaskHandlerOptions,
-} from '../types';
+} from './types';
 
 import { constructBucket } from './utils';
 

packages/react-storage/src/components/StorageBrowser/actions/handlers/utils.ts

@@ -1,6 +1,12 @@
 import { LocationAccess, Permission } from '../../storage-internal';
-import { ActionInputConfig } from '../types';
-import { LocationData, LocationType } from './types';
+import {
+  ActionInputConfig,
+  FileData,
+  FileDataItem,
+  FileItem,
+  LocationData,
+  LocationType,
+} from './types';
 
 export const constructBucket = ({
   bucket: bucketName,
@@ -33,7 +39,6 @@ export const parseLocationAccess = (location: LocationAccess): LocationData => {
       // { scope: 's3://bucket/path/*', type: 'PREFIX', },
       bucket = slicedScope.slice(0, slicedScope.indexOf('/'));
       prefix = `${slicedScope.slice(bucket.length + 1, -1)}`;
-
       break;
     }
     case 'OBJECT': {
@@ -79,3 +84,17 @@ export const parseLocations = (
     },
     []
   );
+
+export const getFileKey = (key: string): string =>
+  key.slice(key.lastIndexOf('/') + 1, key.length);
+
+export const createFileDataItem = (data: FileData): FileDataItem => ({
+  ...data,
+  fileKey: getFileKey(data.key),
+});
+
+export const isFileItem = (value: unknown): value is FileItem =>
+  !!(value as FileItem).file;
+
+export const isFileDataItem = (item: unknown): item is FileDataItem =>
+  !!(item as FileDataItem).fileKey;