upload multiple images to Cloud Storage through Firebase - reactjs

Question

I am trying to upload multiple pictures to Cloud Storage through Firebase. I am using expo ImagePicker, which can take multiple images using the camera.
Here is code,
const [image, setImage] = useState([]);
const pickImageOnly = async () => {
let result = await ImagePicker.launchCameraAsync({
mediaTypes: ImagePicker.MediaTypeOptions.All,
allowsEditing: true,
quality: 0.5,
});
if (!result.cancelled) {
setNextImg(true);
setImage((images) => images.concat(result.uri));
}
};
Now, I am trying to store those images in the firestore database. However, only one image is stored in the database, Here is my try.
const uploadImage = async () => {
for (let step = 0; step < image.length; step++) {
const uploadUri = image[step];
let filename = uploadUri.substring(uploadUri.lastIndexOf('/') + 1);
setUploading(true);
setTransferred(0);
const response = await fetch(uploadUri);
const blob = await response.blob();
const storageRef = firebase.storage().ref().child(`${user.email}/images/${filename}`)
const task = storageRef.put(blob);
// Set transferred state
task.on('state_changed', (taskSnapshot) => {
// console.log(
// `${taskSnapshot.bytesTransferred} transferred out of ${taskSnapshot.totalBytes}`,
// );
setTransferred(
Math.round(taskSnapshot.bytesTransferred / taskSnapshot.totalBytes) *
100,
)
})
try {
const ref = await task;
const url = await storageRef.getDownloadURL()
setUploading(false);
setImage(null);
return url;
} catch (e) {
console.log(e);
return null;
}
}
}
How can I store all the images in the database?