import {useSearchParams} from "react-router-dom";
import {useTranslation} from "react-i18next";

export function PaymentError() {
    const [searchParams, setSearchParams] = useSearchParams();
    const {t} = useTranslation();

    const error = searchParams.get("error");

    return <div className="container">
        <div className="row">
            <div className="col-md-12" style={{textAlign: "center"}}>
                <h1>{t('erreurDePaiement')}</h1>
                <p>{t('erreurDePaiement.msg')}</p>
                <p><strong>{t('erreurDePaiement.detail')}</strong> {error}</p>

                <button className="btn btn-primary" onClick={() => navigate("/club/member")}
                        style={{marginTop: "0.5rem"}}>{t('retouràLaListeDeMembres')}</button>
            </div>
        </div>
    </div>;
}
