Merge pull request #610 from ShouvikGhosh2048/add-coming-soon-page

Add coming soon page

src/components/layout/footer.tsx

@@ -1,6 +1,7 @@
 import { Box, Group, Stack, createStyles } from "@mantine/core";
 import Link from "next/link";
 import { cmlDiscordInviteUrl } from "~/consts/cmlDiscordInviteUrl";
+import { COMING_SOON_PATHNAME } from "~/consts/pathnames";
 
 
 
@@ -43,8 +44,8 @@ export const Footer = () => {
                         align="start"
                         spacing="1px"
                     >
-                        <Link href="">My Account</Link>
-                        <Link href="">Settings</Link>
+                        <Link href={COMING_SOON_PATHNAME}>My Account</Link>
+                        <Link href={COMING_SOON_PATHNAME}>Settings</Link>
                     </Stack>
                     <Link
                         href={cmlDiscordInviteUrl}
@@ -56,8 +57,8 @@ export const Footer = () => {
                         align="end"
                         spacing="1px"
                     >
-                        <Link href="">Cookie Policy</Link>
-                        <Link href="">Privacy Policy</Link>
+                        <Link href={COMING_SOON_PATHNAME}>Cookie Policy</Link>
+                        <Link href={COMING_SOON_PATHNAME}>Privacy Policy</Link>
                     </Stack>
                 </Group>
             </footer>

src/components/layout/layout.tsx

@@ -5,13 +5,14 @@ import { Header } from "./header";
 import { Navbar } from "./navbar/navbar";
 import { Footer } from "./footer";
 import { getNonEmptyArray } from "~/utils/getNonEmptyArray";
+import { MODS_PAGE_PATHNAME } from "~/consts/pathnames";
 
 
 
 
 const PAGES = getNonEmptyArray([
     { label: "Home", pathname: "/" },
-    { label: "Mods", pathname: "/mods" },
+    { label: "Mods", pathname: MODS_PAGE_PATHNAME },
 ]);
 
 

src/components/mods/expandedMod.tsx

@@ -6,6 +6,7 @@ import PublicationDate from "./publicationDate";
 import ModDownloadButton from "./modDownloadButton/modDownloadButton";
 import Link from "next/link";
 import ModCarousel from "./modCarousel";
+import { COMING_SOON_PATHNAME } from "~/consts/pathnames";
 
 
 
@@ -63,8 +64,7 @@ const ExpandedMod = ({ isLoading, mod }: ExpandedModProps) => {
                 <ModDownloadButton gamebananaModId={mod.gamebananaModId} />
                 <Link
                     href={{
-                        pathname: "/mods/[id]",
-                        query: { id: mod.id },
+                        pathname: COMING_SOON_PATHNAME,
                     }}
                     className={classes.moreInfo}
                 >

src/consts/pathnames.ts

@@ -0,0 +1,3 @@
+export const MODS_PAGE_PATHNAME = "/mods";
+
+export const COMING_SOON_PATHNAME = "/coming-soon";

src/pages/comingSoon.tsx

@@ -0,0 +1,17 @@
+import { type NextPage } from "next";
+import { Layout } from "~/components/layout/layout";
+import { COMING_SOON_PATHNAME } from "~/consts/pathnames";
+
+
+
+
+const ComingSoon: NextPage = () => {
+  return (
+    <Layout pageTitle="Coming Soon" pageDescription="Coming Soon" pathname={COMING_SOON_PATHNAME}>
+      <h1>Coming soon</h1>
+      <p>The site is currently in early beta. This feature has not been completed yet.</p>
+    </Layout>
+  );
+};
+
+export default ComingSoon;

src/pages/index.tsx

@@ -4,6 +4,10 @@ import { signIn, signOut, useSession } from "next-auth/react";
 
 import { api } from "~/utils/api";
 import { Layout } from "~/components/layout/layout";
+import { MODS_PAGE_PATHNAME } from "~/consts/pathnames";
+
+
+
 
 const Home: NextPage = () => {
 
@@ -12,7 +16,7 @@ const Home: NextPage = () => {
       <h1>Celeste Mods List</h1>
       <p>Welcome! The site is currently in early beta.</p>
       <Link
-        href={"/mods"}
+        href={MODS_PAGE_PATHNAME}
       >
         You can only browse mods for now.
       </Link>

src/pages/mods/index.tsx

@@ -7,6 +7,7 @@ import { noRatingsFoundMessage } from "~/consts/noRatingsFoundMessage";
 import { Layout } from "~/components/layout/layout";
 import { ModsTable } from "~/components/mods/modsTable";
 import type { ModWithInfo } from "~/components/mods/types";
+import { MODS_PAGE_PATHNAME } from "~/consts/pathnames";
 
 
 
@@ -254,7 +255,7 @@ const Mods: NextPage = () => {
 
 
     return (
-        <Layout pageTitle="Mods" pageDescription="Mods" pathname="/mods">
+        <Layout pageTitle="Mods" pageDescription="Mods" pathname={MODS_PAGE_PATHNAME}>
             <Title className={classes.pageTitle} order={2}>Mods List</Title>
             <ModsTable qualities={qualities} difficulties={difficulties} modsWithInfo={modsWithInfo} isLoading={isLoading} />
         </Layout>