From ec288ff2f87d341705531a60ff72bed217d5e74f Mon Sep 17 00:00:00 2001
From: BigBen-7 <benardsimon7@gmail.com>
Date: Wed, 26 Feb 2025 18:23:07 +0100
Subject: [PATCH] Fix: Fix app layout and route

---
 frontend/app/(root)/forgot-password/page.tsx |  9 +++++++++
 frontend/app/(root)/game/page.tsx            | 11 +++++++++++
 frontend/app/(root)/layout.js                | 12 ++++++++++--
 frontend/app/(root)/otp/page.jsx             |  7 +++++++
 frontend/app/(root)/page.jsx                 | 10 ++++------
 frontend/app/(root)/reset-password/page.jsx  |  7 +++++++
 frontend/app/(root)/setting/page.tsx         |  7 +++++++
 frontend/app/(root)/stats/page.tsx           |  9 +++++++++
 frontend/app/game/page.tsx                   | 16 ----------------
 frontend/app/page.jsx                        |  9 ---------
 frontend/components/LandingPage.jsx          | 10 +++++-----
 11 files changed, 69 insertions(+), 38 deletions(-)
 create mode 100644 frontend/app/(root)/forgot-password/page.tsx
 create mode 100644 frontend/app/(root)/game/page.tsx
 create mode 100644 frontend/app/(root)/otp/page.jsx
 create mode 100644 frontend/app/(root)/reset-password/page.jsx
 create mode 100644 frontend/app/(root)/setting/page.tsx
 create mode 100644 frontend/app/(root)/stats/page.tsx
 delete mode 100644 frontend/app/game/page.tsx
 delete mode 100644 frontend/app/page.jsx

diff --git a/frontend/app/(root)/forgot-password/page.tsx b/frontend/app/(root)/forgot-password/page.tsx
new file mode 100644
index 0000000..8c3c895
--- /dev/null
+++ b/frontend/app/(root)/forgot-password/page.tsx
@@ -0,0 +1,9 @@
+import React from 'react'
+
+const page = () => {
+  return (
+    <div>Forgot password email verification page.</div>
+  )
+}
+
+export default page
\ No newline at end of file
diff --git a/frontend/app/(root)/game/page.tsx b/frontend/app/(root)/game/page.tsx
new file mode 100644
index 0000000..0117946
--- /dev/null
+++ b/frontend/app/(root)/game/page.tsx
@@ -0,0 +1,11 @@
+import Keyboard from "../../../components/Keyboard";
+import WordGrid from "../../../components/WordGrid.jsx";
+
+export default function page() {
+  return (
+    <div>
+        <WordGrid />
+        <Keyboard />
+    </div>
+  );
+}
diff --git a/frontend/app/(root)/layout.js b/frontend/app/(root)/layout.js
index c277197..f59f54c 100644
--- a/frontend/app/(root)/layout.js
+++ b/frontend/app/(root)/layout.js
@@ -1,6 +1,14 @@
-import { ReactNode } from "react";
+import Navbar from "../../components/Navbar";
+import { AppProvider } from "../../context/AppContext";
 
 const Layout = ({ children }) => {
-  return <main>{children}</main>;
+  return (
+    <main>
+      <AppProvider>
+        <Navbar />
+        {children}
+      </AppProvider>
+    </main>
+  );
 };
 export default Layout;
diff --git a/frontend/app/(root)/otp/page.jsx b/frontend/app/(root)/otp/page.jsx
new file mode 100644
index 0000000..3add628
--- /dev/null
+++ b/frontend/app/(root)/otp/page.jsx
@@ -0,0 +1,7 @@
+import React from "react";
+
+const page = () => {
+  return <div>OTP page</div>;
+};
+
+export default page;
diff --git a/frontend/app/(root)/page.jsx b/frontend/app/(root)/page.jsx
index 8cc182a..cd1aaaf 100644
--- a/frontend/app/(root)/page.jsx
+++ b/frontend/app/(root)/page.jsx
@@ -1,11 +1,9 @@
-import Keyboard from "../../components/Keyboard.jsx";
-import WordGrid from "../../components/WordGrid.jsx";
+import LandingPage from "../../components/LandingPage";
 
-export default function page() {
+export default function Page() {
   return (
-    <div>
-      <WordGrid />
-      <Keyboard />
+    <div className="bg-[#ffffff]">
+      <LandingPage  />
     </div>
   );
 }
diff --git a/frontend/app/(root)/reset-password/page.jsx b/frontend/app/(root)/reset-password/page.jsx
new file mode 100644
index 0000000..0d3fe9f
--- /dev/null
+++ b/frontend/app/(root)/reset-password/page.jsx
@@ -0,0 +1,7 @@
+import React from "react";
+
+const page = () => {
+  return <div>Reset Password</div>;
+};
+
+export default page;
diff --git a/frontend/app/(root)/setting/page.tsx b/frontend/app/(root)/setting/page.tsx
new file mode 100644
index 0000000..9c07413
--- /dev/null
+++ b/frontend/app/(root)/setting/page.tsx
@@ -0,0 +1,7 @@
+import React from "react";
+
+const page = () => {
+  return <div>Settings</div>;
+};
+
+export default page;
diff --git a/frontend/app/(root)/stats/page.tsx b/frontend/app/(root)/stats/page.tsx
new file mode 100644
index 0000000..3136b49
--- /dev/null
+++ b/frontend/app/(root)/stats/page.tsx
@@ -0,0 +1,9 @@
+import React from 'react'
+
+const page = () => {
+  return (
+    <div>stats</div>
+  )
+}
+
+export default page
\ No newline at end of file
diff --git a/frontend/app/game/page.tsx b/frontend/app/game/page.tsx
deleted file mode 100644
index 3872f13..0000000
--- a/frontend/app/game/page.tsx
+++ /dev/null
@@ -1,16 +0,0 @@
-import Keyboard from "../../components/Keyboard";
-import Navbar from "../../components/Navbar.jsx";
-import WordGrid from "../../components/WordGrid.jsx";
-import { AppProvider } from "../../context/AppContext";
-
-export default function page() {
-  return (
-    <div>
-      <AppProvider>
-        <Navbar />
-        <WordGrid />
-        <Keyboard />
-      </AppProvider>
-    </div>
-  );
-}
diff --git a/frontend/app/page.jsx b/frontend/app/page.jsx
deleted file mode 100644
index 22b09bf..0000000
--- a/frontend/app/page.jsx
+++ /dev/null
@@ -1,9 +0,0 @@
-import LandingPage from "../components/LandingPage";
-
-export default function Page() {
-  return (
-    <div className="bg-[#ffffff]">
-      <LandingPage />
-    </div>
-  );
-}
diff --git a/frontend/components/LandingPage.jsx b/frontend/components/LandingPage.jsx
index 18ee97d..fd81766 100644
--- a/frontend/components/LandingPage.jsx
+++ b/frontend/components/LandingPage.jsx
@@ -20,17 +20,17 @@ const LandingPage = () => {
   }, []);
   return (
     <div className="w-full h-full relative px-4 pb-2  sm:px-10 xl:px-20">
-      <header
+      {/* <header
         className={`fixed inset-x-0 top-0 z-50 py-4 lg:py-5 sm:px-10 xl:px-20 bg-white transition-shadow ${
           hasShadow ? "shadow-[0_1px_4px_rgba(0,0,0,0.05)]" : "shadow-none"
         }`}
       >
-      </header>
+      </header> */}
 
       <div className="w-full h-full max-w-7xl mx-auto">
         <div className="mx-auto justify-between lg:flex gap-10 xl:gap-24 mt-8 ">
           <div className="lg:mx-0 pt-8 sm:pt-10 lg:pb-1 xl:max-w-[548px] ">
-            <h1 className="mt-10 lg:mt-32 text-3xl text-[#29296E] font-roboto sm:pr-20 break-words lg:pr-0 sm:text-5xl font-semibold sm:leading-[58px] lg:leading-[70px] tracking-[1.2px]">
+            <h1 className=" text-3xl text-[#29296E] font-roboto sm:pr-20 break-words lg:pr-0 sm:text-5xl font-semibold sm:leading-[58px] lg:leading-[70px] tracking-[1.2px]">
               Get 6 Chances to guess a 5-letter word.
             </h1>
             <p className="mt-6 text-lg text-black sm:text-[24px] font-normal break-words leading-[40px] w-full">
@@ -52,8 +52,8 @@ const LandingPage = () => {
               </Link>
             </div>
           </div>
-          <div className="relative w-full h-auto min-h-[400px] lg:min-h-[630px] flex items-center justify-center">
-            <div className="relative w-full h-full aspect-square max-w-[630px] max-h-[630px]">
+          <div className="relative w-full h-auto min-h-[400px] flex items-center justify-center">
+            <div className="relative w-full h-full max-w-[630px] max-h-[630px]">
               <Image
                 src="/landingpageImg.svg"
                 alt="Word game illustration"