import { interactiveText } from "@indietabletop/appkit/common.css.ts";
import { Link } from "wouter";
import { InfoPage } from "./index.tsx";

export function NotFoundPage() {
  return (
    <InfoPage
      heading="Nothing here..."
      description={
        <>
          The link you have followed might be broken.{" "}
          <Link href="/" className={interactiveText}>
            Back to dashboard
          </Link>
          .
        </>
      }
    />
  );
}

export function ClientSideErrorPage() {
  const description = (
    <>
      Sorry, this wasn't supposed to happen. If the error persists, please{" "}
      <a className={interactiveText} href={`mailto:support@indietabletop.club`}>
        get in touch
      </a>
      .
    </>
  );

  return (
    <InfoPage heading="An wild Error appears!" description={description} />
  );
}