Merge branch 'clean' of https://github.com/hngprojects/hng_boilerplat…

…e_nextjs into clean

package.json

@@ -72,7 +72,7 @@
     "@testing-library/jest-dom": "^6.4.6",
     "@testing-library/react": "^16.0.0",
     "@testing-library/user-event": "^14.5.2",
-    "@types/node": "^20.14.11",
+    "@types/node": "^20.14.12",
     "@types/prop-types": "^15.7.12",
     "@types/react": "^18.3.3",
     "@types/react-dom": "^18",
@@ -97,7 +97,7 @@
     "prettier": "^3.3.2",
     "prettier-plugin-tailwindcss": "^0.6.5",
     "tailwindcss": "^3.4.1",
-    "typescript": "^5.5.3",
+    "typescript": "^5.5.4",
     "vitest": "^1.6.0"
   }
 }

src/app/(auth-routes)/layout.tsx

@@ -1,20 +1,17 @@
-
 import Footer from "~/components/layouts/footer";
 
 import { Suspense } from "react";
 
-
 import Navbar from "~/components/layouts/navbar";
 
 function Layout({ children }: { children: React.ReactNode }) {
   return (
     <>
-
       <Navbar is_auth_path />
       <div className="mx-auto w-5/6">
         <Suspense>{children}</Suspense>
       </div>
-			<Footer />
+      <Footer />
     </>
   );
 }

src/app/(auth-routes)/register/page.tsx

@@ -23,6 +23,8 @@ import {
   InputOTPGroup,
   InputOTPSlot,
 } from "~/components/ui/input-otp";
+import Google from "../../../../public/images/google.svg";
+import Facebook from "../../../../public/images/facebook.svg";
 
 const formSchema = z.object({
   fullname: z.string().min(2, {
@@ -53,14 +55,8 @@ const SignUp = () => {
         </p>
       </div>
       <div className="flex justify-center gap-4 p-4">
-        <AuthProvider
-          title="Sign in with Google"
-          icon="/public/images/google.png"
-        />
-        <AuthProvider
-          title="Sign in with Google"
-          icon="/public/images/google.png"
-        />
+        <AuthProvider title="Sign in with Google" icon={Google} />
+        <AuthProvider title="Sign in with Facebook" icon={Facebook} />
       </div>
       <div className="mx-auto w-2/4">
         <Form {...form}>

src/components/layouts/homepage/Hero.tsx

@@ -11,6 +11,8 @@ import "swiper/css/navigation";
 import "swiper/css/pagination";
 import "swiper/css/scrollbar";
 
+import Link from "next/link";
+
 const Hero = () => {
   return (
     <div className="py-14 sm:py-20">
@@ -36,9 +38,11 @@ const Hero = () => {
               and optimal productivity.
             </p>
 
-            <button className="rounded bg-primary px-8 py-4 text-background">
-              Get Started
-            </button>
+            <Link href="/register">
+              <button className="rounded bg-primary px-8 py-4 text-background">
+                Get Started
+              </button>
+            </Link>
           </div>
 
           <div className="mt-14 flex w-full justify-end rounded-lg lg:mt-0 lg:w-1/2">

src/components/layouts/navbar/index.tsx

@@ -18,8 +18,6 @@ const Navbar = ({ is_auth_path = false }: { is_auth_path?: boolean }) => {
   const [scrolling, setIsScrolling] = useState<boolean>(false);
   const { user } = useUser();
 
-  //
-
   const handleScrollEvent = () => {
     if (window.scrollY > 1) {
       setIsScrolling(true);
@@ -67,7 +65,7 @@ const Navbar = ({ is_auth_path = false }: { is_auth_path?: boolean }) => {
               Log in
             </Link>
             <Link
-              href="/sign-up"
+              href="/register"
               className="grid h-[44px] place-items-center whitespace-nowrap rounded-md border border-primary bg-primary px-4 text-white lg:px-8"
             >
               Get Started