import { sleep } from '@incode/utils';
import getFinishStatus from '@incodetech/welcome/getFinishStatus';
import { useEffect } from 'react';

type FinishProps = {
  title: string;
  subtitle: string;
  token: string;
  workflowId: string;
  goNext: () => void;
};
const Finish = ({
  title,
  subtitle,
  workflowId,
  token,
  goNext,
}: FinishProps) => {
  useEffect(() => {
    const finish = async () => {
      await getFinishStatus(workflowId, {
        token,
      });
      await sleep(3000);
      goNext();
    };
    finish();
  }, [token, workflowId, goNext]);

  return (
    <div className="incd-flex incd-h-full incd-flex-col incd-items-center incd-justify-around incd-px-11 incd-text-center">
      <div aria-live="assertive">
        <h1 className="incd-text-2xl incd-px-2">{title}</h1>
        <p className="incd-text-xl">{subtitle}</p>
      </div>
    </div>
  );
};

export default Finish;