// screens/not_found.jsx — the page for an address that names no page.
//
// The shell keeps its sidebar and topbar around this: a wrong URL is a wrong URL,
// not a broken app, and the way out (Overview, or back) should be one click away.
// The address that failed is shown as typed, because "what did I actually paste?"
// is the first thing a person checks. The URL bar is left alone too — see the
// URL-sync effect in app.jsx, which never rewrites a not-found address.
function NotFoundScreen({ path, onHome }) {
  const canGoBack = typeof history !== "undefined" && history.length > 1;
  return (
    <div className="page notfound" role="main" aria-labelledby="notfound-title">
      <div className="notfound-code" aria-hidden="true">404</div>
      <h1 id="notfound-title" className="notfound-title">There's no page at this address</h1>
      <p className="notfound-sub">
        <span className="notfound-path mono">{path || "/"}</span> is not a page in VulnerabilityCore.
        The link may be out of date, or the address mistyped.
      </p>
      <div className="notfound-acts">
        <button className="btn btn-accent" type="button" onClick={onHome}>
          <Icon name="dashboard" size={15} />Go to Overview
        </button>
        {canGoBack && (
          <button className="btn btn-ghost" type="button" onClick={() => history.back()}>
            <Icon name="arrowL" size={15} />Go back
          </button>
        )}
      </div>
    </div>
  );
}

window.NotFoundScreen = NotFoundScreen;