BacPacNet · bacpactech · Oct 1, 2024 · Oct 1, 2024 · Oct 1, 2024
diff --git a/src/app/v2/community/[id]/page.tsx → src/app/(withLayout)/community/[id]/page.tsx b/src/app/v2/community/[id]/page.tsx → src/app/(withLayout)/community/[id]/page.tsx
@@ -1,13 +1,15 @@
-import LeftNavWrapper from '@/components/molecules/LeftNavWrapper'
+'use client'
 import UniversityCard from '@/components/molecules/UniversityCard'
 import PostContainer from '@/components/organisms/PostsContainer'
 import UserPostContainer from '@/components/organisms/UserPostContainer'
 import { PostInputType } from '@/types/constants'
+import { useParams } from 'next/navigation'
 import React from 'react'
 
 const Community = () => {
+  const { id } = useParams()
   return (
-    <LeftNavWrapper>
+    <>
       <UniversityCard
         universityLogo={''}
         universityName={'Lorem University'}
@@ -19,8 +21,8 @@ const Community = () => {
         memberCount={200}
       />
       <UserPostContainer type={PostInputType.Community} />
-      <PostContainer />
-    </LeftNavWrapper>
+      <PostContainer communityId={id} />
+    </>
   )
 }
 

diff --git a/src/app/(withLayout)/communityGroup/[group_id]/page.tsx b/src/app/(withLayout)/communityGroup/[group_id]/page.tsx
@@ -0,0 +1,5 @@
+import React from 'react'
+
+export default function CommunityGroup() {
+  return <div>CommunityGroup</div>
+}
diff --git a/src/app/(withLayout)/layout.tsx b/src/app/(withLayout)/layout.tsx
@@ -3,12 +3,14 @@ import React, { useState } from 'react'
 
 export default function Layout({ children }: { children: React.ReactNode }) {
   return (
-    <div className="flex h-screen gap-8 py-8">
-      <div className="w-1/5 hidden md:block">
-        <LeftNavbar />
+    <div className="flex gap-8 bg-surface-primary-50">
+      <div className="w-1/5 hidden md:block ">
+        <div className="fixed w-[288px] left-0 z-10 ">
+          <LeftNavbar />
+        </div>
       </div>
       <div className="w-3/5">{children}</div>
-      <div className="w-1/5 rounded-2xl shadow-2xl bg-white hidden lg:block"></div>
+      <div className="w-1/5  shadow-2xl bg-white hidden lg:block mt-1"></div>
     </div>
   )
 }
diff --git a/src/app/(withLayout)/timeline/page.tsx b/src/app/(withLayout)/timeline/page.tsx
@@ -7,7 +7,7 @@ export default function Timeline() {
   return (
     <>
       <UserPostContainer type={PostInputType.Timeline} />
-      <PostContainer />
+      <PostContainer isTimeline={true} />
     </>
   )
 }
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
@@ -54,7 +54,7 @@ export default function RootLayout({ children }: { children: React.ReactNode })
         <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick-theme.min.css" />
       </head>
 
-      <body className="bg-surface-primary-50">
+      <body>
         <ReactQueryClientProvider>
           <ZustandSocketProvider>
             <LogoNavbar />

diff --git a/src/app/login/page.tsx b/src/app/login/page.tsx
@@ -1,114 +1,11 @@
-/* eslint-disable @next/next/no-img-element */
-'use client'
-import Footer from '@components/Footer/Footer'
-import { useForm, SubmitHandler } from 'react-hook-form'
-import { useEffect, useState } from 'react'
-import { AiOutlineEye } from 'react-icons/ai'
-import { AiOutlineEyeInvisible } from 'react-icons/ai'
-import Link from 'next/link'
-import { useHandleLogin } from '@/services/auth'
-import { LoginForm } from '@/models/auth'
-// import { useUniStore } from '@/store/store'
-import { useRouter } from 'next/navigation'
-import { ButtonPrimary } from '@/components/Buttons/PrimaryButton'
+import LoginBox from '@/components/organism/Login/LoginBox'
+import React from 'react'
 
 const Login = () => {
-  const [showPassword, setShowPassword] = useState(false)
-  const { mutate: mutateLogin, isSuccess } = useHandleLogin()
-  const {
-    register: registerLogin,
-    handleSubmit: handleSubmitLogin,
-    formState: { errors: loginErrors },
-  } = useForm<LoginForm>()
-  // const { userProfileData } = useUniStore()
-  const router = useRouter()
-
-  const onLoginSubmit: SubmitHandler<LoginForm> = async (data) => {
-    await mutateLogin(data)
-    // if (userProfileData?._id) {
-    //   router.push(`/community/${userProfileData._id}/timeline`)
-    // } else {
-    //   console.error('User profile data is missing or invalid.')
-    // }
-  }
-
-  useEffect(() => {
-    if (isSuccess) {
-      router.push(`/timeline`)
-    }
-  }, [isSuccess])
-
   return (
-    <main>
-      <div className="flex flex-col justify-center items-center bg-violet-100">
-        <div className="my-16 bg-white flex flex-col justify-center px-6 py-8 rounded-xl w-[85%] lg:w-[500px] mx-4">
-          <div className="self-center">
-            <img src="/unibuzzLogo.png" alt="uniBuzz Logo" />
-          </div>
-          <h1 className="text-2xl font-extrabold py-6 text-center">Login to your account</h1>
-          <form className="flex flex-col font-medium">
-            <label htmlFor="email" className="py-1">
-              Email Address
-            </label>
-            <input
-              {...registerLogin('email', {
-                required: true,
-                pattern: {
-                  value: /^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}$/i,
-                  message: 'Please enter a valid email address',
-                },
-              })}
-              placeholder="Email Address"
-              className=" border pl-6 py-2 text-md rounded-lg border-gray-light font-normal"
-            />
-            {loginErrors.email && (
-              <span className="text-red-500 font-normal">{loginErrors.email.message ? loginErrors.email.message : 'Please enter your email!'}</span>
-            )}
-            <label htmlFor="password" className="py-1 mt-5">
-              Password
-            </label>
-            {/* include validation with required or other standard HTML validation rules */}
-            <div className="relative">
-              <input
-                {...registerLogin('password', { required: true })}
-                placeholder="Password"
-                className=" border pl-6 py-2 text-md rounded-lg border-gray-light font-normal w-full"
-                type={showPassword ? 'text' : 'password'}
-              />
-              <div className="absolute inset-y-0 right-0 pr-3 flex items-center text-sm leading-5">
-                {showPassword ? (
-                  <AiOutlineEyeInvisible className="h-5 w-5 text-gray-700 cursor-pointer" onClick={() => setShowPassword(!showPassword)} />
-                ) : (
-                  <AiOutlineEye className="h-5 w-5 text-gray-700 cursor-pointer" onClick={() => setShowPassword(!showPassword)} />
-                )}
-              </div>
-            </div>
-            {/* errors will return when field validation fails  */}
-            {loginErrors.password && <span className="text-red-500 font-normal">Please enter your password!</span>}
-            <p className="text-sm text-slate-600 font-normal px-2 my-4 cursor-pointer">Forgot Password?</p>
-            {/* checkbox for remember me */}
-            {/*<div className="flex flex-row items-center mb-4 pl-2">
-              <div>
-                <input type="checkbox" {...registerLogin('rememberMe')} id="rememberMe" name="rememberMe" value="true" className="mr-2" />
-              </div>
-              <label htmlFor="rememberMe" className="text-sm font-normal">
-                Remember Me
-              </label>
-            </div>*/}
-            <ButtonPrimary onClick={handleSubmitLogin(onLoginSubmit)} className="py-2 rounded-xl text-white text-lg font-normal mb-5">
-              Login
-            </ButtonPrimary>
-            <p className="text-md text-center text-gray font-medium px-2">
-              Don&apos;t have an account?{' '}
-              <span className="text-primary cursor-pointer">
-                <Link href={'/register'}>Sign Up</Link>
-              </span>
-            </p>
-          </form>
-        </div>
-      </div>
-      <Footer />
-    </main>
+    <div className="flex justify-center items-center h-screen bg-neutral-50">
+      <LoginBox />
+    </div>
   )
 }
 

diff --git a/src/app/community/[id]/connections/page.tsx → ...p/old-community/[id]/connections/page.tsx b/src/app/community/[id]/connections/page.tsx → ...p/old-community/[id]/connections/page.tsx
diff --git a/src/app/community/[id]/page.tsx → src/app/old-community/[id]/page.tsx b/src/app/community/[id]/page.tsx → src/app/old-community/[id]/page.tsx
diff --git a/src/app/community/loading.tsx → src/app/old-community/loading.tsx b/src/app/community/loading.tsx → src/app/old-community/loading.tsx
diff --git a/src/app/community/page.tsx → src/app/old-community/page.tsx b/src/app/community/page.tsx → src/app/old-community/page.tsx
diff --git a/src/app/old-login/page.tsx b/src/app/old-login/page.tsx
@@ -0,0 +1,115 @@
+/* eslint-disable @next/next/no-img-element */
+'use client'
+import Footer from '@components/Footer/Footer'
+import { useForm, SubmitHandler } from 'react-hook-form'
+import { useEffect, useState } from 'react'
+import { AiOutlineEye } from 'react-icons/ai'
+import { AiOutlineEyeInvisible } from 'react-icons/ai'
+import Link from 'next/link'
+import { useHandleLogin } from '@/services/auth'
+import { LoginForm } from '@/models/auth'
+// import { useUniStore } from '@/store/store'
+import { useRouter } from 'next/navigation'
+import { ButtonPrimary } from '@/components/Buttons/PrimaryButton'
+
+const Login = () => {
+  const [showPassword, setShowPassword] = useState(false)
+  const { mutate: mutateLogin, isSuccess } = useHandleLogin()
+  const {
+    register: registerLogin,
+    handleSubmit: handleSubmitLogin,
+    formState: { errors: loginErrors },
+  } = useForm<LoginForm>()
+  // const { userProfileData } = useUniStore()
+  const router = useRouter()
+
+  const onLoginSubmit: SubmitHandler<LoginForm> = async (data) => {
+    await mutateLogin(data)
+    // if (userProfileData?._id) {
+    //   router.push(`/community/${userProfileData._id}/timeline`)
+    // } else {
+    //   console.error('User profile data is missing or invalid.')
+    // }
+  }
+
+  useEffect(() => {
+    if (isSuccess) {
+      router.push(`/timeline`)
+    }
+  }, [isSuccess])
+
+  return (
+    <main>
+      <div className="flex flex-col justify-center items-center bg-violet-100">
+        <div className="my-16 bg-white flex flex-col justify-center px-6 py-8 rounded-xl w-[85%] lg:w-[500px] mx-4">
+          <div className="self-center">
+            <img src="/unibuzzLogo.png" alt="uniBuzz Logo" />
+          </div>
+          <h1 className="text-2xl font-extrabold py-6 text-center">Login to your account</h1>
+          <form className="flex flex-col font-medium">
+            <label htmlFor="email" className="py-1">
+              Email Address
+            </label>
+            <input
+              {...registerLogin('email', {
+                required: true,
+                pattern: {
+                  value: /^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}$/i,
+                  message: 'Please enter a valid email address',
+                },
+              })}
+              placeholder="Email Address"
+              className=" border pl-6 py-2 text-md rounded-lg border-gray-light font-normal"
+            />
+            {loginErrors.email && (
+              <span className="text-red-500 font-normal">{loginErrors.email.message ? loginErrors.email.message : 'Please enter your email!'}</span>
+            )}
+            <label htmlFor="password" className="py-1 mt-5">
+              Password
+            </label>
+            {/* include validation with required or other standard HTML validation rules */}
+            <div className="relative">
+              <input
+                {...registerLogin('password', { required: true })}
+                placeholder="Password"
+                className=" border pl-6 py-2 text-md rounded-lg border-gray-light font-normal w-full"
+                type={showPassword ? 'text' : 'password'}
+              />
+              <div className="absolute inset-y-0 right-0 pr-3 flex items-center text-sm leading-5">
+                {showPassword ? (
+                  <AiOutlineEyeInvisible className="h-5 w-5 text-gray-700 cursor-pointer" onClick={() => setShowPassword(!showPassword)} />
+                ) : (
+                  <AiOutlineEye className="h-5 w-5 text-gray-700 cursor-pointer" onClick={() => setShowPassword(!showPassword)} />
+                )}
+              </div>
+            </div>
+            {/* errors will return when field validation fails  */}
+            {loginErrors.password && <span className="text-red-500 font-normal">Please enter your password!</span>}
+            <p className="text-sm text-slate-600 font-normal px-2 my-4 cursor-pointer">Forgot Password?</p>
+            {/* checkbox for remember me */}
+            {/*<div className="flex flex-row items-center mb-4 pl-2">
+              <div>
+                <input type="checkbox" {...registerLogin('rememberMe')} id="rememberMe" name="rememberMe" value="true" className="mr-2" />
+              </div>
+              <label htmlFor="rememberMe" className="text-sm font-normal">
+                Remember Me
+              </label>
+            </div>*/}
+            <ButtonPrimary onClick={handleSubmitLogin(onLoginSubmit)} className="py-2 rounded-xl text-white text-lg font-normal mb-5">
+              Login
+            </ButtonPrimary>
+            <p className="text-md text-center text-gray font-medium px-2">
+              Don&apos;t have an account?{' '}
+              <span className="text-primary cursor-pointer">
+                <Link href={'/register'}>Sign Up</Link>
+              </span>
+            </p>
+          </form>
+        </div>
+      </div>
+      <Footer />
+    </main>
+  )
+}
+
+export default Login