I'm trying to set up user authentication with Firebase for my React webapp, but I'm running into errors with the firebaseAuth.app() function. I've tried reinstalling firebase and the firebase admin in the project directory, converting to SDK 9 syntax for the imports, and reordering certain statements, but nothing seems to be working. Here is my App.js file:

import withFirebaseAuth from 'react-with-firebase-auth'
import firebase from 'firebase/compat/app';
import 'firebase/auth';

import firebaseConfig from './firebaseConfig';

import "firebase/compat/app";
import "firebase/compat/analytics";

import { initializeApp } from 'firebase/app';
import { getAuth } from "firebase/auth";

const firebaseApp = firebase.initializeApp(firebaseConfig);

const firebaseAppAuth = firebaseApp.auth();
const providers = {
  googleProvider: new firebase.auth.GoogleAuthProvider(),
};

const {
  user,
  signOut,
  signInWithGoogle,
} = this.props;

function App() {
  return (
    <div className="App">
    <header className="App-header">
    <img src={logo} className="App-logo" alt="logo" />
    {
      user
        ? <p>Hello, {user.displayName}</p>
        : <p>Please sign in.</p>
    }
    {
      user
        ? <button onClick={signOut}>Sign out</button>
        : <button onClick={signInWithGoogle}>Sign in with Google</button>
    }
  </header>

    </div>
  );
}

export default withFirebaseAuth({
  providers,
  firebaseAppAuth,
})(App);

I have a firebaseConfig.js file as well with the configuration information. Sorry for any newb-ness, as I'm new to React. Can anyone help resolve this error?