反应 firebase 谷歌身份验证奇怪的行为

Question

使用弹出窗口成功登录后，出现错误，但如果我再次登录，则不会 我不知道为什么。

在下面的屏幕截图中，您可以在按钮上看到错误，同时在我登录的导航栏上看到

屏幕截图（登录时证明错误）

登录.js

import React, { useState } from "react";
import { Button, Spinner, Alert, Form } from "react-bootstrap";
import { useAuth } from "../AuthContext";
import { useHistory } from "react-router-dom";
import CenteredContainer from "./CenteredContainer";
import { faGoogle } from "@fortawesome/free-brands-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import Navigation from "./Navigation";

export default function Login() {
  const { loginWithGoogle, AddUserIfNotExists } = useAuth();
  const { currentUser } = useAuth();
  const [error, setError] = useState("");
  const [loading, setLoading] = useState(false);
  const history = useHistory();

  async function handleSubmit(e) {
    e.preventDefault();

    try {
      setError("");
      setLoading(true);
      await loginWithGoogle();
      await AddUserIfNotExists();
      history.push(`/user/${currentUser.uid}`);
    } catch (e) {
      setError("Failed to authenticate please try again");
      setLoading(false);
    }
  }

  return (
    <>
      <Navigation />
      <CenteredContainer>
        {error && <Alert variant="danger">{error}</Alert>}
        <Form onSubmit={handleSubmit}>
          <Button
            disabled={loading}
            className="w-100"
            type="submit"
            variant="outline-dark"
          >
            {loading ? (
              <Spinner animation="grow" variant="dark" />
            ) : (
              <>
                <FontAwesomeIcon icon={faGoogle} />
                <span> Sign in with Google</span>
              </>
            )}
          </Button>
        </Form>
      </CenteredContainer>
    </>
  );
}

请帮忙！

（没有更多细节只是为了让stackoverflow让我发布）