I want to upload main image, and side images from 2 different file inputs using multer, but I couldn't find how to do that, multer seems to only accept one upload on route, so how can I do that? Multer is throwing me unexpected field error in my code.

HTML Form:

<form method="POST" action="/addprod" enctype="multipart/form-data">
    <h3>Add product</h3>
    <h4>Main image</h4>
    <input type="file" class="mainimg" accept="image/*" name="mainimg">
    <h4>Side images</h4>
    <input type="file" class="sideImgs" accept="image/*" multiple name="sideimgs">
    <button>Add product</button>
</form>

node.js

const storage = multer.diskStorage({
    destination: function(req, file, cb) {
        cb(null,'../public/prodImgs/')
    },
    filename: function(req, file, cb) {
        const newName = Date.now() + '-' + Math.round(Math.random() * 100)
        cb(null,file.fieldname + '-' + newName)
    }
});
const upload = multer({ storage: storage });
    
let mid = {
    main: upload.single('mainimg'),
    sides: upload.array('sideimgs')
}

app.post('/addprod', [mid.main, mid.sides], async (req, res) =>{
    console.log(req.files,"\n\n\n")
    console.log(req.body)
});