src/shared/components/app/error-page.tsx

   1 import { setIsoData } from "@utils/app";
   2 import { Component } from "inferno";
   3 import { T } from "inferno-i18next-dess";
   4 import { Link } from "inferno-router";
   5 import { IsoDataOptionalSite } from "../../interfaces";
   6 import { I18NextService } from "../../services";
   7
   8 export class ErrorPage extends Component<any, any> {
   9   private isoData: IsoDataOptionalSite = setIsoData(this.context);
  10
  11   constructor(props: any, context: any) {
  12     super(props, context);
  13   }
  14
  15   render() {
  16     const { errorPageData } = this.isoData;
  17
  18     return (
  19       <div className="error-page container-lg text-center">
  20         <h1>
  21           {errorPageData
  22             ? I18NextService.i18n.t("error_page_title")
  23             : I18NextService.i18n.t("not_found_page_title")}
  24         </h1>
  25         {errorPageData ? (
  26           <T i18nKey="error_page_paragraph" className="p-4" parent="p">
  27             #<a href="https://lemmy.ml/c/lemmy_support">#</a>#
  28             <a href="https://matrix.to/#/#lemmy-space:matrix.org">#</a>#
  29           </T>
  30         ) : (
  31           <p>{I18NextService.i18n.t("not_found_page_message")}</p>
  32         )}
  33         {!errorPageData && (
  34           <Link to="/" replace>
  35             {I18NextService.i18n.t("not_found_return_home_button")}
  36           </Link>
  37         )}
  38         {errorPageData?.adminMatrixIds &&
  39           errorPageData.adminMatrixIds.length > 0 && (
  40             <>
  41               <div>
  42                 {I18NextService.i18n.t("error_page_admin_matrix", {
  43                   instance:
  44                     this.isoData.site_res?.site_view.site.name ??
  45                     "this instance",
  46                 })}
  47               </div>
  48               <ul className="mx-auto mt-2" style={{ width: "fit-content" }}>
  49                 {errorPageData.adminMatrixIds.map(matrixId => (
  50                   <li key={matrixId} className="text-info">
  51                     {matrixId}
  52                   </li>
  53                 ))}
  54               </ul>
  55             </>
  56           )}
  57         {errorPageData?.error && (
  58           <T
  59             i18nKey="error_code_message"
  60             parent="p"
  61             interpolation={{ error: errorPageData.error }}
  62           >
  63             #<strong className="text-danger">#</strong>#
  64           </T>
  65         )}
  66       </div>
  67     );
  68   }
  69 }