3dtours/make-comics
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add stories dashboard with API endpoint and navigation updates

Browse Source
This commit is contained in:
Riccardo Giorato
2025-12-26 11:36:45 +01:00
parent 79bd750630
commit 14b247ffaa
5 changed files with 265 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/landing/navbar.tsx
+26 -9
View File
@@ -1,7 +1,8 @@
"use client";
import { useState } from "react";
import { Github, Key, User } from "lucide-react";
import { usePathname } from "next/navigation";
import { Github, Key, BookOpen, User, Plus } from "lucide-react";
import Link from "next/link";
import { ApiKeyModal } from "@/components/api-key-modal";
import {
@@ -14,16 +15,19 @@ import {
export function Navbar() {
const [showApiModal, setShowApiModal] = useState(false);
const pathname = usePathname();
const handleApiKeySubmit = (key: string) => {
localStorage.setItem("together_api_key", key);
setShowApiModal(false);
};
const isOnStoriesPage = pathname === "/stories";
return (
<>
<nav className="w-full h-14 sm:h-16 border-b border-border/50 flex items-center justify-between px-4 sm:px-6 lg:px-8 z-50 bg-background/80 backdrop-blur-md">
<div className="flex items-center gap-1">
<Link href="/" className="flex items-center gap-1 hover:opacity-80 transition-opacity">
<div className="w-8 h-8 sm:w-10 sm:h-10 flex items-center justify-center">
<img
src="/images/makecomics-logo.png"
@@ -34,7 +38,7 @@ export function Navbar() {
<span className="text-white font-heading tracking-[0.005em] text-lg sm:text-xl">
MakeComics
</span>
</div>
</Link>
<div className="flex items-center gap-2 sm:gap-3">
<button
@@ -69,12 +73,25 @@ export function Navbar() {
</SignInButton>
</SignedOut>
<SignedIn>
<button className="flex items-center gap-1.5 sm:gap-2 px-2 sm:px-3 py-1.5 glass-panel glass-panel-hover transition-all text-xs rounded-md cursor-pointer">
<User className="w-3.5 h-3.5 sm:w-4 sm:h-4" />
<span className="text-muted-foreground text-xs sm:text-sm hidden sm:inline tracking-tight">
My Stories
</span>
</button>
{isOnStoriesPage ? (
<Link href="/">
<button className="flex items-center gap-1.5 sm:gap-2 px-2 sm:px-3 py-1.5 glass-panel glass-panel-hover transition-all text-xs rounded-md cursor-pointer">
<Plus className="w-3.5 h-3.5 sm:w-4 sm:h-4" />
<span className="text-muted-foreground text-xs sm:text-sm hidden sm:inline tracking-tight">
Create New
</span>
</button>
</Link>
) : (
<Link href="/stories">
<button className="flex items-center gap-1.5 sm:gap-2 px-2 sm:px-3 py-1.5 glass-panel glass-panel-hover transition-all text-xs rounded-md cursor-pointer">
<User className="w-3.5 h-3.5 sm:w-4 sm:h-4" />
<span className="text-muted-foreground text-xs sm:text-sm hidden sm:inline tracking-tight">
My Stories
</span>
</button>
</Link>
)}
</SignedIn>
</div>
</nav>