diff --git a/nextjs/public/img/logo.png b/nextjs/public/img/logo.png new file mode 100644 index 0000000..5d266b8 Binary files /dev/null and b/nextjs/public/img/logo.png differ diff --git a/nextjs/src/app/layout.tsx b/nextjs/src/app/layout.tsx index f92a944..8838c5b 100644 --- a/nextjs/src/app/layout.tsx +++ b/nextjs/src/app/layout.tsx @@ -1,7 +1,8 @@ import type { Metadata } from "next"; import { Inter } from "next/font/google"; import "./globals.css"; -import NavBar from "@/components/NavBar"; +import Navbar from "@/components/Navbar"; +import { Footer } from "@/components/Footer"; const inter = Inter({ subsets: ["latin"] }); @@ -19,8 +20,9 @@ export default function RootLayout({
- +
{children}
+
diff --git a/nextjs/src/app/page.tsx b/nextjs/src/app/page.tsx index 51ddbcb..83b2f36 100644 --- a/nextjs/src/app/page.tsx +++ b/nextjs/src/app/page.tsx @@ -1,4 +1,3 @@ -//import { createClient } from "@/utils/supabase/server"; import { Container } from "@/components/ui/Container"; import { Hero } from "@/components/landing_page/Hero"; import { SectionTitle } from "@/components/landing_page/SectionTitle"; @@ -8,20 +7,12 @@ import { Faq } from "@/components/landing_page/Faq"; import { benefitData, featureData } from "@/components/landing_page/data"; export default async function Home() { - /* Subabase user for later use - const supabase = createClient(); - { - - const { data } = await supabase.auth.getUser(); - const user = data?.user; - */ - return ( Intelligent Study Tutor creates personalized questions, provides instant feedback, - and answers all your study-related queries. Whether you’re preparing for exams or + and answers all your study-related questions. Whether you are preparing for exams or just need a little extra help, Study Tutor is here to support you every step of the way. diff --git a/nextjs/src/components/landing_page/Footer.tsx b/nextjs/src/components/Footer.tsx similarity index 67% rename from nextjs/src/components/landing_page/Footer.tsx rename to nextjs/src/components/Footer.tsx index 350abaf..cd9577a 100644 --- a/nextjs/src/components/landing_page/Footer.tsx +++ b/nextjs/src/components/Footer.tsx @@ -3,9 +3,9 @@ import { Container } from "@/components/ui/Container"; export function Footer() { return ( -
+
-
+
Copyright © {new Date().getFullYear()}
diff --git a/nextjs/src/components/NavBar.tsx b/nextjs/src/components/NavBar.tsx deleted file mode 100644 index 396903f..0000000 --- a/nextjs/src/components/NavBar.tsx +++ /dev/null @@ -1,66 +0,0 @@ -import { createClient } from "@/utils/supabase/server"; -import Link from "next/link"; - -export default async function NavBar() { - const supabase = createClient(); - const { data } = await supabase.auth.getUser(); - const user = data?.user; - - return ( -
- -
- ); -} diff --git a/nextjs/src/components/Navbar.tsx b/nextjs/src/components/Navbar.tsx new file mode 100644 index 0000000..aa9ca55 --- /dev/null +++ b/nextjs/src/components/Navbar.tsx @@ -0,0 +1,168 @@ +import { Disclosure, DisclosureButton, DisclosurePanel } from "@headlessui/react"; +import { Bars3Icon, XMarkIcon } from "@heroicons/react/24/outline"; +import { createClient } from "@/utils/supabase/server"; +import Image from "next/image"; +import Link from "next/link"; +import { User } from "@/types"; + +const navigation = [ + { name: "Home", href: "/", current: false }, + { name: "Flash cards", href: "/flashcards", current: false }, + { name: "Your studies", href: "#", current: false } +]; +const userNavigation = [ + { name: "Log in", href: "/login" }, + { name: "Register", href: "/register" } +]; + +const userLoggedInNavigation = [{ name: "Log out", href: "/logout" }]; + +function classNames(...classes: string[]) { + return classes.filter(Boolean).join(" "); +} + +export default async function Navbar() { + const supabase = createClient(); + const { data } = await supabase.auth.getUser(); + const user = data?.user as unknown as User | undefined; + + return ( + <> +
+ +
+
+
+ +
+ Study Tutor + Study Tutor +
+ +
+
+ {navigation.map((item) => ( + + {item.name} + + ))} +
+
+
+
+ {user ? ( +
+
+ + Log Out + +
+
+ ) : ( +
+
+ + Log In + + + Register + +
+
+ )} +
+
+ {/* Mobile menu button */} + + + Open main menu + +
+
+
+ + +
+ {navigation.map((item) => ( + + {item.name} + + ))} +
+
+
+ {user + ? userLoggedInNavigation.map((item) => ( + + {item.name} + + )) + : userNavigation.map((item) => ( + + {item.name} + + ))} +
+
+ + +
+ + ); +} diff --git a/nextjs/src/components/landing_page/Hero.tsx b/nextjs/src/components/landing_page/Hero.tsx index ed20c6e..6e9a781 100644 --- a/nextjs/src/components/landing_page/Hero.tsx +++ b/nextjs/src/components/landing_page/Hero.tsx @@ -1,45 +1,67 @@ +import { createClient } from "@/utils/supabase/server"; import Image from "next/image"; import { Container } from "@/components/ui/Container"; import heroImg from "../../../public/img/picture1.png"; +import Link from "next/link"; +import { User } from "@/types"; + +export const Hero = async () => { + const supabase = createClient(); + const { data } = await supabase.auth.getUser(); + const user = data?.user as unknown as User | undefined; -export const Hero = () => { return ( <>
-

+

Study Tutor

-

- - Your AI-Powered Study Companion +

+ Your AI-Powered Study Companion

- Unlock your full potential with Study Tutor. Study Tutor is your - personal AI-powered study assistant designed to make learning more - efficient and enjoyable. + Unlock your full potential with Study Tutor. It is your personal + AI-powered study assistant designed to make learning more efficient and + enjoyable.

Get started now and transform your learning experience!

- + {user ? ( +
+ + Flash cards + + + + Your studies + +
+ ) : ( +
+ + Log In + + + + Register + +
+ )}
diff --git a/nextjs/src/components/landing_page/Navbar.tsx b/nextjs/src/components/landing_page/Navbar.tsx deleted file mode 100644 index 6e977c9..0000000 --- a/nextjs/src/components/landing_page/Navbar.tsx +++ /dev/null @@ -1,109 +0,0 @@ -"use client"; -import Link from "next/link"; -import Image from "next/image"; -import { Disclosure, DisclosureButton, DisclosurePanel } from "@headlessui/react"; - -export const Navbar = () => { - const navigation = ["Product", "Features", "Pricing", "Company", "Blog"]; - - return ( -
- -
- ); -};