Next.js 404 Links

404Links.tsx

'use client'
import React, { MouseEvent } from 'react'
import Link from 'next/link'
import settings from '../lib/settings'

export function HomeLink404() {
  const handleClick = (e: MouseEvent<HTMLAnchorElement>, href: string) => {
    e.preventDefault()
  }
  return (
    <Link
      href="/"
      onClick={(e) => handleClick(e, '/')}
      className="hover:text-primary inline-block rounded-lg border border-white px-8 py-3 text-center text-base font-semibold text-white transition hover:bg-white"
    >
      Go to {settings.hostName}
    </Link>
  )
}
export function DashboardLink404() {
  const handleClick = (e: MouseEvent<HTMLAnchorElement>, href: string) => {
    e.preventDefault()
  }
  return (
    <Link
      href="/dashboard"
      onClick={(e) => handleClick(e, '/dashboard')}
      className="hover:text-primary inline-block rounded-lg border border-white px-8 py-3 text-center text-base font-semibold text-white transition hover:bg-white"
    >
      Go to the dashboard
    </Link>
  )
}