Multifile upload with mongoose

[KevinKoetz]

I was struggling getting multiple file upload to work with mongoose models and wonder if there is a better way to do it.

What is working:

const Files = new Schema({
  key: [String],
  mimeType: [String],
  bucket: [String],
  size: [Number],
});

const modelWithImages = model(
  "WithImages",
  new Schema({
    multipleImages: Files,
  })
);

const adminJs = new AdminJS({
    databases: [database],
    resources: [
      {
        resource: modelWithImages,
        options: {
          properties: {
            "multipleImages.key": { isVisible: false },
            "multipleImages.mimeType": { isVisible: false },
            "multipleImages.bucket": { isVisible: false },
            "multipleImages.size": { isVisible: false },
          },
        },
        features: [
          uploadFileFeature({
            provider: {
              aws: {
                bucket: "adminjstest",
                region: "eu-central-1",
                expires: 0,
                accessKeyId: process.env.S3_KEY,
                secretAccessKey: process.env.S3_SECRET,
              },
            },
            properties: {
              key: "multipleImages.key",
              mimeType: "multipleImages.mimeType",
              bucket: "multipleImages.bucket",
              size: "multipleImages.size",
              file: "multipleImages.file",
              filePath: "multipleImages.filePath",
              filename: "multipleImages.filename",
              filesToDelete: "multipleImages.filesToDelete",
            },
            multiple: true,
            uploadPath: (record, filename) =>
              `${record.id()}/multipleImages/${filename}`,
          })
        ],
      },
    ],
    rootPath: "/",
  });

what i expected to work somehow:

const File = new Schema({
  key: String,
  mimeType: String,
  bucket: String,
  size: Number,
});

const modelWithImages = model(
  "WithImages",
  new Schema({
    multipleImages: [File],
  })
);

const adminJs = new AdminJS({
    databases: [database],
    resources: [
      {
        resource: modelWithImages,
        options: {
          properties: {
            multipleImages: {
              type: "mixed,
              isArray: true
            }
          },
        },
        features: [
          uploadFileFeature({
            provider: {
              aws: {
                bucket: "adminjstest",
                region: "eu-central-1",
                expires: 0,
                accessKeyId: process.env.S3_KEY,
                secretAccessKey: process.env.S3_SECRET,
              },
            },
            properties: {
              key: "multipleImages.key",
              mimeType: "multipleImages.mimeType",
              bucket: "multipleImages.bucket",
              size: "multipleImages.size",
              file: "multipleImages.file",
              filePath: "multipleImages.filePath",
              filename: "multipleImages.filename",
              filesToDelete: "multipleImages.filesToDelete",
            },
            multiple: true,
            uploadPath: (record, filename) =>
              `${record.id()}/multipleImages/${filename}`,
          })
        ],
      },
    ],
    rootPath: "/",
  });

While the second model is more in line with my understanding of having a nested array of files, it doesn't work with AdminJS Upload because upload with multiple expects key, mimeType, bucket and size to be arrays themself.

Is there any way to make it work with the second model, or could we introduce a way to let adminJS know what exactly is the array? For example, inside the uploadFeature properties we could be able to write a kinda template literal like "multipleImages.${index}.key" which could be interpreted in the frontend to know where the index of the array should go. Or the frontend could be intelligently checking if multipleImages is an Array (as specified in the resource options with multipleImages: {type: "mixed", isArray: true}) and if yes, try to create an object within this array.

[haseebahmad109]

@KevinKoetz
any workaround solution for this ?

[KevinKoetz]

My workaround actually was to use the strange Files Schema above:

const Files = new Schema({
  key: [String],
  mimeType: [String],
  bucket: [String],
  size: [Number],
});

const modelWithImages = model(
  "WithImages",
  new Schema({
    multipleImages: Files,
  })
);

If you dont want or cant do this, maybe you could workaround it using a virtual on the Mongoose Model that maps the four arrays expected by adminJS to a single array with file objects inside. (Might break stuff in adminJS, like filtering or sorting because you cant query virtuals)

[haseebahmad109]

@KevinKoetz
I think this pull solves my issue.

[KevinKoetz]

Yes, it does. Thank you for linking it here.