Using Firebase Auth & gAPI?

Question

How do I get Firebase Auth to work with Google drive api?

Using react, I have firebase auth working and google drive (gapi) both working individually but am struggling to merge the two.

With Firebase 9, it's been made easier to access Google API: This gives you a Google Access Token. You can use it to access Google APIs.

My thinking is to get the token and then pass that to the gapi .init function. However, I'm not sure where to go after that. Any guidance in the right direction would be greatly appreciated!

import { getAuth, getRedirectResult, GoogleAuthProvider } from "firebase/auth";

onst auth = getAuth();
signInWithPopup(auth, provider)
  .then((result) => {
    // This gives you a Google Access Token. You can use it to access the Google API.
    const credential = GoogleAuthProvider.credentialFromResult(result);
    const token = credential.accessToken;

My gapi implementation:

useEffect(() => {
    window.gapi.load("client:auth2", initClient);
  }, []);

  useEffect(() => {
    if (authState) {
      authState.isSignedIn.listen(updateSigninStatus);
    }
  }, [authState]);

  const initClient = () => {
    try {
      window.gapi.auth2
        .init({
          apiKey: "API KEY...",
          clientId:
            "CLIENT ID...",
          scope: "https://www.googleapis.com/auth/drive",
          discoveryDocs: [
            "https://www.googleapis.com/discovery/v1/apis/drive/v3/rest",
          ],
        })
        .then(() => {
          const authInstance = window.gapi.auth2.getAuthInstance();
          setAuthState(authInstance);
        });
    } catch (err) {
      console.log(err);
    }
  };

  const signInFunction = () => {
    authState.signIn();
    updateSigninStatus();
  };

  const signOutFunction = () => {
    authState.signOut();
  };

  const updateSigninStatus = () => {
    setSigninStatus();
  };

  const setSigninStatus = async () => {
     //code...
      }
    }
  };