import { EAuthModes } from "@buzzwaretech/constants";
import Link from "next/link";
import React from "react";

interface TermsAndConditionsProps {
  authType?: EAuthModes;
}

// Constants for better maintainability
const LEGAL_LINKS = {
  termsOfService: "https://buzzwareTech.so/legals/terms-and-conditions",
  privacyPolicy: "https://buzzwareTech.so/legals/privacy-policy",
} as const;

const MESSAGES = {
  [EAuthModes.SIGN_UP]: "By creating an account",
  [EAuthModes.SIGN_IN]: "By signing in",
} as const;

// Reusable link component to reduce duplication
function LegalLink({
  href,
  children,
}: {
  href: string;
  children: React.ReactNode;
}) {
  return (
    <Link
      href={href}
      className="text-secondary"
      target="_blank"
      rel="noopener noreferrer"
    >
      <span className="text-13 font-medium underline hover:cursor-pointer">
        {children}
      </span>
    </Link>
  );
}

export function TermsAndConditions({
  authType = EAuthModes.SIGN_IN,
}: TermsAndConditionsProps) {
  return (
    <div className="flex items-center justify-center">
      <p className="text-center text-13 whitespace-pre-line text-tertiary">
        {`${MESSAGES[authType]}, you understand and agree to \n our `}
        <LegalLink href={LEGAL_LINKS.termsOfService}>
          Terms of Service
        </LegalLink>{" "}
        and{" "}
        <LegalLink href={LEGAL_LINKS.privacyPolicy}>Privacy Policy</LegalLink>.
      </p>
    </div>
  );
}