import { createSignal, onCleanup, onMount } from "solid-js";
import { PeachMark } from "../components/PeachMark";

export function ProCelebration() {
  const [leaving, setLeaving] = createSignal(false);

  onMount(() => {
    const t = window.setTimeout(() => setLeaving(true), 1800);
    onCleanup(() => window.clearTimeout(t));
  });

  return (
    <div class="peach-pro-celebration" classList={{ "is-leaving": leaving() }}>
      <div class="peach-pro-bloom-target"><PeachMark class="peach-pro-bloom-icon" /></div>
      <div class="peach-pro-wordmark">peach pro</div>
      <div class="peach-pro-thankyou">thank you.</div>
    </div>
  );
}