All files / react-app/src/features/error-page index.tsx

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
 
 
 
 
 
94x
2x
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
import { Link } from "react-router";
 
import { BreadCrumbs, SimplePageContainer } from "@/components";
import { useFeatureFlag } from "@/hooks/useFeatureFlag";
 
export const ErrorPage = () => {
  const isFAQEnabled = useFeatureFlag("TOGGLE_FAQ");
 
  return (
    <SimplePageContainer>
      <BreadCrumbs
        options={[
          {
            to: "/",
            displayText: "Home",
            order: 0,
          },
          {
            to: "/404",
            displayText: "Page not found",
            order: 1,
          },
        ]}
      />
      <main className="flex justify-center flex-col items-center gap-y-10">
        <div>
          <h1 className="text-5xl font-[Merriweather] font-bold">
            Sorry, we couldn't find that page.
          </h1>
 
          <div className="pt-10 flex gap-x-20">
            <Link className="text-2xl p-0 text-primary hover:underline font-bold" to="/">
              Go to Home Page
            </Link>
            <Link
              className="text-2xl p-0 text-primary hover:underline font-bold"
              to={isFAQEnabled ? "/support" : "/faq"}
            >
              Get Support
            </Link>
          </div>
        </div>
      </main>
    </SimplePageContainer>
  );
};