jsonwebtoken.github.io/src/features/common/components/errors/error-page/error-page.component.tsx at b137b993bba3270f55ef0617662eb9fcd4470d4e · jsonwebtoken/jsonwebtoken.github.io · GitHub

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
import React from "react";
import styles from "./error-page.module.scss";
import { ShellComponent } from "@/features/common/components/shell/shell.component";
import { MobileHeaderComponent } from "@/features/common/components/headers/mobile-header/mobile-header.component";
import { HeaderComponent } from "@/features/common/components/headers/header/header.component";
import { FooterComponent } from "@/features/common/components/footer/footer.component";
import { ThemeCookieValues } from "@/features/common/values/theme.values";
import { getLayoutDictionary } from "@/features/localization/services/language-dictionary.service";

interface ErrorPageComponentProps {
  languageCode: string;
  themeCode: ThemeCookieValues;
  children: React.ReactNode;
}

export const ErrorPageComponent: React.FC<ErrorPageComponentProps> = ({
  languageCode,
  themeCode,
  children,
}) => {
  const layoutDictionary = getLayoutDictionary(languageCode);

  return (
    <html lang={languageCode} data-theme={themeCode}>
      <ShellComponent languageCode={languageCode} themeCode={themeCode}>
        <header className={styles.header}>
          <MobileHeaderComponent
            languageCode={languageCode}
            dictionary={layoutDictionary}
            themeCode={themeCode}
          />
          <HeaderComponent
            languageCode={languageCode}
            dictionary={layoutDictionary}
            themeCode={themeCode}
          />
        </header>
        <main className={styles.main}>{children}</main>
        <FooterComponent
          languageCode={languageCode}
          dictionary={layoutDictionary.footer}
        />
      </ShellComponent>
    </html>
  );
};