I have a React project where i get photo URLs from firebase storage (getPhotoArray function) I have the correct urls being console logged when i click the button, but it doesnt show on my page.

I have multiple photos in the firebase storage folder and i am getting the right amount and right photos console logged in the array(in getPhotoArray function)

export const getPhotoArray = async (selectedDonation, setPhotos) => {
  const listRef = ref(storage,  /Images/ +selectedDonation.id);
  const images = []
  listAll(listRef)
    .then((res) => {
      if (res.items.length > 0) {
        res.items.forEach((itemRef) => {
          // Get the download URL
          getDownloadURL(ref(storage, itemRef.fullPath))
          .then((url) => {
            images.push(url)
          })
          .catch((error) => {
          });
        });
        setPhotos(images)
        console.log(images)
      }else {
        toast.info( No Photos Found, Please Try Again Later )
      }
    }).catch((error) => {

    });   
}

import React, {useEffect, useMemo, useState} from  react 
import  ./donation_information.css 
import {getReceiptURL, getPhotoArray} from  ../../API/FirestoreAPI  

export default function DonationInformation({ selectedDonation, selectedDonationSteps }) {
  const [Photos, setPhotos] = useState([]);
 
  const getPhotos = () => {
    getPhotoArray(selectedDonation, setPhotos)
  }

 useEffect(() => {
  setURL(  )
  setPhotos([])
 }, [selectedDonation]);

  return (
    <div className= donationInformation >
        <div className= download-photos >
          <button onClick={getPhotos}>Show Photos</button>
          {
            useMemo(() => {
              Photos.map((photo) => {
                return <img src="photo" key={photo} alt="" />
              })
            }, [Photos])
          }
        </div>
        </div>
    </div>
  )
}

I have tried wrapping the Photos.map with useEffect, thats the only thing i could think of