Book a Demo!
CoCalc Logo Icon
StoreFeaturesDocsShareSupportNewsAboutPoliciesSign UpSign In
sagemathinc
GitHub Repository: sagemathinc/cocalc
 Path: blob/master/src/packages/next/pages/404.tsx
1447 views
1
/*

2
 *  This file is part of CoCalc: Copyright © 2022 Sagemath, Inc.

3
 *  License: MS-RSL – see LICENSE.md for details

4
 */

5


6
import { useEffect, useState } from "react";

7
import { join } from "path";

8
import Head from "next/head";

9
import Footer from "components/landing/footer";

10
import LandingHeader from "components/landing/header";

11
import { Layout } from "antd";

12
import basePath from "lib/base-path";

13
import { Icon } from "@cocalc/frontend/components/icon";

14
import { COLORS } from "@cocalc/util/theme";

15
import apiPost from "lib/api/post";

16
import { MAX_WIDTH } from "lib/config";

17


18
const favicon = join(basePath, "webapp/favicon-32x32.png");

19


20
export default function Custom404() {

21
  const [siteName, setSiteName] = useState<string>("");

22
  useEffect(() => {

23
    (async () => {

24
      const customize = await apiPost("customize", { fields: ["siteName"] });

25
      setSiteName(customize.siteName);

26
    })();

27
  }, []);

28


29
  return (

30
    <>

31
      <Head>

32
        <title>{`${siteName ? siteName + " – " : ""}404 Page Not Found`}</title>

33
        <meta name="description" content="404 Page Not Found" />

34
        <meta name="robots" content="noindex,nofollow" />

35
        <link rel="icon" href={favicon} />

36
      </Head>

37
      <Layout>

38
        <LandingHeader />

39
        <Layout.Content style={{ background: "white" }}>

40
          <div

41
            style={{

42
              color: "#555",

43
              margin: "50px auto",

44
              minHeight: "50vh",

45
              maxWidth: MAX_WIDTH,

46
              fontSize: "150%",

47
            }}

48
          >

49
            <h1>

50
              404 – Page Not Found

51
              <span

52
                style={{

53
                  float: "right",

54
                  fontSize: "200%",

55
                  color: COLORS.ANTD_RED,

56
                }}

57
              >

58
                <Icon name="robot" />

59
              </span>

60
            </h1>

61


62
            <div>

63
              <a href={`${basePath}/`}>

64
                Back to {siteName ? `${siteName}'s ` : "the "} main page

65
              </a>

66
            </div>

67
          </div>

68
        </Layout.Content>

69
        <Footer />

70
      </Layout>

71
    </>

72
  );

73
}

74


75