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

   1 import { Component } from "inferno";
   2 import { Link } from "inferno-router";
   3 import { ErrorPageData, setIsoData } from "../../utils";
   4
   5 export class ErrorPage extends Component<any, any> {
   6   private isoData = setIsoData(this.context);
   7
   8   constructor(props: any, context: any) {
   9     super(props, context);
  10   }
  11
  12   render() {
  13     const errorPageData = this.getErrorPageData();
  14
  15     return (
  16       <div className="container-lg">
  17         <h1>{errorPageData ? "Error!" : "Page Not Found"}</h1>
  18         <p>
  19           {errorPageData
  20             ? "There was an error on the server. Try refreshing your browser of coming back at a later time"
  21             : "The page you are looking for does not exist"}
  22         </p>
  23         {!errorPageData && (
  24           <Link to="/">Click here to return to your home page</Link>
  25         )}
  26         {errorPageData?.adminMatrixIds &&
  27           errorPageData.adminMatrixIds.length > 0 && (
  28             <div>
  29               <div>
  30                 If you would like to reach out to one of{" "}
  31                 {this.isoData.site_res.site_view.site.name}&apos;s admins for
  32                 support, try the following Matrix addresses:
  33               </div>
  34               <ul>
  35                 {errorPageData.adminMatrixIds.map(matrixId => (
  36                   <li key={matrixId}>{matrixId}</li>
  37                 ))}
  38               </ul>
  39             </div>
  40           )}
  41         {errorPageData?.error && <code>{errorPageData.error.message}</code>}
  42       </div>
  43     );
  44   }
  45
  46   private getErrorPageData() {
  47     const errorPageData = this.isoData.routeData[0] as
  48       | ErrorPageData
  49       | undefined;
  50     if (errorPageData?.type === "error") {
  51       return errorPageData;
  52     }
  53
  54     return undefined;
  55   }
  56 }