Lighthouse performance Largest Contentful Paint element

Question

I was just testing my lighthouse score and found my Largest Contentful Paint element to be of 10,210 ms, although the issue which lighthouse pointed out is a

tag which on click redirects to another route like

 <p
   className="link-para"
   onClick={() => history.push("/recover-pass")}>
    Clica aqui para recuperar a password de acesso à PRO
 </p>

and then recover-pass has the code below

import React, { useState, useCallback } from "react";
import { useFormik } from "formik";
import { store } from "react-notifications-component";
import LogoYellow from "~images/logo_yellow.svg";
import { successNotificationCustom } from "~components/notification/notification";
import mediaBreakPoint from "~utils/media-breakpoint";
import { useHistory } from "react-router";
import { useMutation } from "@apollo/react-hooks";
import { apiErrorHandler } from "~utils/apiErrorHandler";
import { PlainInput } from "~components/Inputs/plainInput";
import { Buttons } from "~components/buttons";
import { Spinner } from "~components/spinner";
import { RESET_PASSWORD } from "../utils/mutation";
import "../index.less";
import { validationSchemaForgot } from "../utils/validation";

const ForgotPassword = () => {
  const [disabled, setDisabled] = useState(false);
  const history = useHistory();
  const tabBreakpoint = mediaBreakPoint("(max-width: 900px)");
  const formik = useFormik({
    initialValues: {
      email: null,
    },
    onSubmit: (values: any) => {
      setDisabled(true);
      const { email } = values;
      const wallet_url = process.env.REACT_APP_HP_URL;
      const continueUrl = wallet_url.concat(":");
      resetPassword({
        variables: {
          email,
          continueUrl,
          canHandleCodeInApp: false,
          appName: "Partner",
        },
      });
    },
    validationSchema: validationSchemaForgot,
  });

  

  const [resetPassword] = useMutation(RESET_PASSWORD, {
    fetchPolicy: "no-cache",
    onError: useCallback((error: any) => {
      setDisabled(false);
      apiErrorHandler(error);
    }, []),
    onCompleted: useCallback(({  }: any) => {
      setDisabled(false);
      store.addNotification(
        successNotificationCustom(
          "Email enviado. ",
          "Segue as instruções no email que recebeste.",
          7000
        )
      );
    }, []),
  });

  return (
    <div id="account-container">
      {disabled && <Spinner />}
      <div className="auth-logo">
        <a href="">
          <img src={LogoYellow} className="Logo" />
        </a>
      </div>
      <div className="card" style={{ width: tabBreakpoint ? "100%" : "450px" }}>
        <h1 className="heading-text">Recuperação de Password</h1>
        <form onSubmit={formik.handleSubmit} className="form-container">
          <PlainInput
            formik={formik}
            question="Email"
            name="email"
            className="tab-text-large"
            mainDivStyle={{ marginBottom: 10 }}
          />
          <p className="link-para" onClick={() => history.push("/entrar")}>
            Voltar para trás
          </p>
          <br />

          <Buttons
            type="submit"
            isDisabled={disabled}
            text=" Recuperar Password"
            width="200px"
          />
        </form>
      </div>
    </div>
  );
};

export default ForgotPassword;

So i don't find anything that could lead to such high LCP and I dont know what to do, any suggestions would be appreciated, thanks!