I have updated my firebase's version and because of the breaking changes of firebase v9 the code doesn't work now. I have change the firebase.js file to how it need's to be. and inported 👇 firebase/auth. I have played with the code but can't get it to work. Any help is appreciated.

import { signInWithPopup, getAuth, GoogleAuthProvider } from 'firebase/auth'

const [postPopUp, setpostPopUp] = useState(false)
const [isUserSignedIn, setIsUserSignedIn] = useState(true)
const [UserIcon, setUserIcon] = useState('')

const SignInWithFireBase = () => {
  var google_provider = new firebase.auth.GoogleAuthProvider()
  firebase.auth().signInWithPopup(google_provider)
    .then((re) => {
      setUserIcon(re.additionalUserInfo.profile.picture)
      console.log(re)
    })
    .catch((err) => {
      console.log(err)
    })
}

firebase.auth().onAuthStateChanged((user) => {
  if (user) {
    return setIsUserSignedIn(true)
  } else {
    setIsUserSignedIn(false)
  }
})