/* eslint-disable @typescript-eslint/no-explicit-any */
"use client";

import { useForm } from "@inertiajs/react";
import styles from "./link-expired.module.scss";
import { FiMail } from "react-icons/fi";

export default function LinkExpired({ email }: any) {
  const { post, processing } = useForm({
    email,
  });

  const handleResend = () => {
    post(route("invite.resend"));
  };

  return (
    <div className={styles.wrapper}>
      <div className={styles.card}>
        {/* ICON */}
        <div className={styles.icon}>
          ⏳
        </div>

        {/* HEADER */}
        <div className={styles.header}>
          <h1>Link Expired</h1>
          <p>Your activation link is no longer valid</p>
        </div>

        {/* EMAIL */}
        <div className={styles.emailBox}>
          <FiMail />
          <span>{email}</span>
        </div>

        {/* MESSAGE */}
        <div className={styles.message}>
          <p>
            No worries — we can send you a fresh activation link so you can
            complete your account setup.
          </p>
        </div>

        {/* BUTTON */}
        <button
          onClick={handleResend}
          disabled={processing}
          className={styles.button}
        >
          {processing ? "Sending..." : "Resend Activation Link"}
        </button>

        {/* FOOTER */}
        <div className={styles.footer}>
          <p>If you didn’t request this, you can safely ignore it</p>
        </div>
      </div>
    </div>
  );
}