/* eslint-disable no-restricted-globals */
/* eslint-disable jsx-a11y/click-events-have-key-events */
/* eslint-disable jsx-a11y/no-static-element-interactions */
import LIcon from "@/components/ui/lucid-icon/lucid-icon";
import { useLocale } from "@/hooks/useLocale";

interface CoreSummaryHeaderProps {
  children: string;
  hideBackButton?: boolean;
  onClickBackButton?: () => void;
}

const CoreSummaryHeader = ({
  hideBackButton = false,
  ...props
}: CoreSummaryHeaderProps) => {
  const { t } = useLocale();
  return (
    <div className="py-6">
      {!hideBackButton && (
        <div
          className="mb-6 flex w-fit cursor-pointer gap-2 text-primary-500 "
          onClick={() => {
            try {
              if (props.onClickBackButton) {
                props.onClickBackButton();
                return;
              }
              history.back();
            } catch (error) {
              /* empty */
            }
          }}
        >
          <LIcon name="ArrowLeft" />
          <span className="text-base font-medium">{t("Go back")}</span>
        </div>
      )}
      <h1 className="m-0 line-clamp-1 p-0 px-4 text-2xl font-semibold md:px-0">
        {props.children}
      </h1>
    </div>
  );
};

export default CoreSummaryHeader;