[v6] How to set dynamic custom prefix for each file upload like v5 about amplify-js

[cwomack]

Hey, @natuan62 👋. We appreciate you opening this issue and I'm going to mark it as a feature request for v6 of Amplify for version parity from v5. Previously, you could use something like the file type to create those dynamic prefixes in S3 upon uploading.

For v6 (and using Gen 1 with CLI created backend resources), it looks like we may need to do something along the lines of exposing extra arguments for a custom prefixResolver(), such as file type, and make this optional. However, in the Gen 2 Developer Experience (which is currently in developer preview) this should be supported once we go General Availability. The functionality isn't released yet, but we will follow up on this issue as soon as it is.

As for the code snippet for a a solution you provided above, there's a risk of causing concurrent calls to S3 calls in your promise callback, which could lead to potential race conditions. If the uploaded file is larger than 5 MB, it will call the multi-part upload and make multiple calls within the promise. I'm concerned that you may end up with different calls leading to different prefixes if this happens.

Best recommendation here would be to await the release of this functionality in the Gen2 Developer Experience, or until the feature request is fully supported on the Gen 1 side of things.

[natuan62]

I found this solution, seem it not good. Anyway better this way @cwomack ?

const uploadS3 = async (input: {file: string, key: string}, accessLevel: AccessLevel) => {
    const libraryOptions: any = {
      Storage: {
        S3: {
          prefixResolver: async (input: { accessLevel: AccessLevel, targetIdentityId: string}) => {
            const { targetIdentityId } = input;
           
            const prefix = input.accessLevel === 'private' ? 'video' : 'image';
            return `private/${prefix}/${targetIdentityId}/`;
          },
        },
      },
    };
    Amplify.configure(awsconfig as ResourcesConfig, libraryOptions);

    const operation = uploadData({
      key: input.key,
      data: input.file,
      options: {
        contentType: 'text/plain',
        accessLevel,
      },
    });
    const result = await operation.result;
  };

  const listFiles = [{file: 'video1', type: 'video'}, {file: 'image1', type: 'image'}];

  await Promise.all(listFiles.map((file, index) => {
    const accessLevel = file.type === 'video' ? 'private' : 'protected';
    return uploadS3({file: file.file, key: file.file}, accessLevel);
  }