import { Link, NotFoundError } from '@tanstack/react-router'

import { Button } from '@postxl/ui-components'

export const NotFoundErrorPage = ({ error }: { error: NotFoundError }) => {
  console.log(error)
  return (
    <div className="flex w-full pt-4 px-4 h-(--content-without-header)">
      <div className="flex flex-col gap-4 border-1 border-(--discreet-border) w-full h-full items-center justify-center">
        <h2>The page you’re looking for doesn’t exist.</h2>
        <Button asChild>
          <Link to={'/'}>Back to Home</Link>
        </Button>
      </div>
    </div>
  )
}
