import useTranslation from "next-translate/useTranslation";
import router from "next/router";
import Link from "next/link";
import CaseNoticeBanner from "./case/caseNoticeBanner";

export default function ServiceBanner(props) {
    let { t, lang } = useTranslation();

    const showSigninFromEnv = true;
    const showNoticeFromEnv = false;

    // keep backwards-compat with existing usage
    const showSignin = props?.noSignin === true ? false : showSigninFromEnv;

    const signInButton = () => {
        router.push(
            `${
                router.locale == "cy" ? "/awd/mewngofnodi" : "/auth/signin"
            }?callbackUrl=${encodeURIComponent(
                window.location.href,
            )}&error=EmailSignin`,
        );
    };
    return (
        <>
            <div className="servicebanner">
                <h1>
                    <img
                        className={
                            router.locale == "cy"
                                ? "govuk-!-margin-top-4 serviceTitle cy"
                                : "govuk-!-margin-top-4 serviceTitle"
                        }
                        src={
                            router.locale == "cy"
                                ? "/assets/images/planning-casework-cy.svg"
                                : "/assets/images/planning-casework-en.svg"
                        }
                        alt="Planning casework"
                    />
                </h1>

                {showSignin && props.noSignin != true && (
                    <div className="serviceBanner_userDetails">
                        <button
                            onClick={() => signInButton()}
                            className="govuk-header__link "
                        >
                            {t("common:signin-label")}
                        </button>
                    </div>
                )}
            </div>

            {showNoticeFromEnv && (
                <div>
                    <div
                        className="govuk-warning-text noticebanner govuk-!-margin-bottom-0"
                        key={1}
                    >
                        <strong className="govuk-warning-text__text">
                            <span className="govuk-visually-hidden">
                                Announcement
                            </span>
                        </strong>
                        <div>
                            <div className=" govuk-body-s">
                                <h2 className="govuk-heading-s">
                                    {router.locale == "cy"
                                        ? "Cyhoeddiad"
                                        : "Announcement"}
                                </h2>
                            </div>
                            <div className="govuk-body-s">
                                {router.locale == "cy" ? (
                                    <>
                                        <p>
                                            Oherwydd gwaith cynnal a chadw
                                            hanfodol, rydym yn disgwyl rhywfaint
                                            o darfu ar ein gwasanaethau Porth
                                            Gwaith Achos rhwng 9-13 Chwefror
                                            2026.{" "}
                                        </p>
                                        <p>
                                            Ymddiheurwn am yr anghyfleustra. Am
                                            ymholiadau brys yn ystod y cyfnod
                                            hwn, cysylltwch â{" "}
                                            <a href="mailto:pedw.gwaithachos@llyw.cymru">
                                                pedw.gwaithachos@llyw.cymru
                                            </a>
                                        </p>
                                    </>
                                ) : (
                                    <>
                                        <p>
                                            Due to essential maintenance, we are
                                            expecting some disruption to our
                                            Casework Portal services between
                                            9-13 February 2026.
                                        </p>
                                        <p>
                                            We apologise for the inconvenience.
                                            For urgent enquries during this time
                                            please contact{" "}
                                            <a href="mailto:pedw.casework@gov.wales">
                                                pedw.casework@gov.wales
                                            </a>
                                        </p>
                                    </>
                                )}
                            </div>
                        </div>
                    </div>
                </div>
            )}
        </>
    );
}