From 2f774ec91613ec778d872f9a193e0525c7b33f4e Mon Sep 17 00:00:00 2001 From: jakevanhalder <124746901+jakevanhalder@users.noreply.github.com> Date: Sat, 18 Oct 2025 23:59:41 -0700 Subject: [PATCH 1/2] Refactor project structure to use optional src directory. --- {app => src/app}/favicon.ico | Bin {app => src/app}/globals.css | 0 {app => src/app}/layout.tsx | 0 {app => src/app}/page.tsx | 0 4 files changed, 0 insertions(+), 0 deletions(-) rename {app => src/app}/favicon.ico (100%) rename {app => src/app}/globals.css (100%) rename {app => src/app}/layout.tsx (100%) rename {app => src/app}/page.tsx (100%) diff --git a/app/favicon.ico b/src/app/favicon.ico similarity index 100% rename from app/favicon.ico rename to src/app/favicon.ico diff --git a/app/globals.css b/src/app/globals.css similarity index 100% rename from app/globals.css rename to src/app/globals.css diff --git a/app/layout.tsx b/src/app/layout.tsx similarity index 100% rename from app/layout.tsx rename to src/app/layout.tsx diff --git a/app/page.tsx b/src/app/page.tsx similarity index 100% rename from app/page.tsx rename to src/app/page.tsx From c9d1260a2c8bb8f7b476479ff49f6be5fd162966 Mon Sep 17 00:00:00 2001 From: jakevanhalder <124746901+jakevanhalder@users.noreply.github.com> Date: Wed, 22 Oct 2025 21:57:45 -0700 Subject: [PATCH 2/2] Implement home and login page wireframe design. --- src/app/layout.tsx | 10 ++-- src/app/login/page.tsx | 20 +++++++ src/app/page.tsx | 109 ++++------------------------------- src/components/Navbar.tsx | 118 ++++++++++++++++++++++++++++++++++++++ 4 files changed, 156 insertions(+), 101 deletions(-) create mode 100644 src/app/login/page.tsx create mode 100644 src/components/Navbar.tsx diff --git a/src/app/layout.tsx b/src/app/layout.tsx index f7fa87e..b242a94 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -1,5 +1,6 @@ import type { Metadata } from "next"; import { Geist, Geist_Mono } from "next/font/google"; +import Navbar from "../components/Navbar"; import "./globals.css"; const geistSans = Geist({ @@ -13,8 +14,8 @@ const geistMono = Geist_Mono({ }); export const metadata: Metadata = { - title: "Create Next App", - description: "Generated by create next app", + title: "FirstFM", + description: "Generated by FirstFM", }; export default function RootLayout({ @@ -25,9 +26,10 @@ export default function RootLayout({ return ( - {children} + +
{children}
); diff --git a/src/app/login/page.tsx b/src/app/login/page.tsx new file mode 100644 index 0000000..fc9c153 --- /dev/null +++ b/src/app/login/page.tsx @@ -0,0 +1,20 @@ +'use client'; + +export default function LoginPage() { + return ( +
+
+

Log in with Last.fm

+

FirstFM uses your Last.fm account to recommend songs and personalize your experience.

+
+
+ +
+
+ ); +} diff --git a/src/app/page.tsx b/src/app/page.tsx index 21b686d..cbb9736 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -1,103 +1,18 @@ -import Image from "next/image"; - export default function Home() { return ( -
-
- Next.js logo -
    -
  1. - Get started by editing{" "} - - app/page.tsx - - . -
    2. -
  2. - Save and see your changes instantly. -
    3. -
- -
- - Vercel logomark - Deploy now - - - Read our docs - +
+
+
+

Visualize Your Music, Discover Your Story

+

+ Unlock your music map by signing in with your Last.fm account. +

-
- + +
+
+

This couldn't have been possible without the FirstFM team check them out here! v1.0.0

+
); } diff --git a/src/components/Navbar.tsx b/src/components/Navbar.tsx new file mode 100644 index 0000000..7d3596b --- /dev/null +++ b/src/components/Navbar.tsx @@ -0,0 +1,118 @@ +'use client'; + +import Link from "next/link"; +import { useState } from "react"; +import { Menu, X, Music } from "lucide-react"; + +export default function Navbar() { + const [open, setOpen] = useState(false); + const user = false; // Placeholder for user authentication state + + const navItems = [ + { href: "/", label: "Home" }, + { href: "/library", label: "Library" }, + ]; + + if (!user) { + return ( +
+
+
+
+ + FirstFM + +
+ +
+ + Log in + +
+
+
+
+ ); + } + + return ( +
+
+
+
+ + FirstFM + +
+ + + +
+
+ +
+ + {/* Mobile menu button */} +
+ +
+
+
+
+ + {/* Mobile panel */} + {open && ( +
+
+ {navItems.map((item) => ( + setOpen(false)} + className="block px-3 py-2 rounded-md text-base hover:bg-muted/60" + > + {item.label} + + ))} +
+ +
+
+
+ )} +
+ ); +}