npm i react-image-file-resizer
// components/forms/ImageUpload.js
const handleUpload = (e) => {
let files = e.target.files;
files = [...files];
if (files?.length) {
setAd({ ...ad, uploading: true });
files.map((f) => {
// upload
new Promise((resolve) => {
Resizer.imageFileResizer(
f,
1080,
720,
"JPEG",
100,
0,
async (uri) => {
try {
const { data } = await axios.post("/upload-image", {
image: uri,
});
setAd((prev) => ({
...prev,
photos: [data, ...prev.photos],
uploading: false,
}));
} catch (err) {
console.log("photo upload err => ", err);
setAd({ ...ad, uploading: false });
}
},
"base64"
);
});
});
} else {
setAd({ ...ad, uploading: false });
}
};