71 lines
2.3 KiB
TypeScript
71 lines
2.3 KiB
TypeScript
"use client";
|
|
|
|
import { useEffect } from 'react';
|
|
import { useStore } from '@/lib/store';
|
|
import { Navbar } from "@/components/Navbar";
|
|
import { Gallery } from "@/components/Gallery";
|
|
import { PromptHero } from "@/components/PromptHero";
|
|
import { Settings } from "@/components/Settings";
|
|
import { PromptLibrary } from "@/components/PromptLibrary";
|
|
import { UploadHistory } from "@/components/UploadHistory";
|
|
import { CookieExpiredDialog } from "@/components/CookieExpiredDialog";
|
|
import { BottomNav } from "@/components/BottomNav";
|
|
|
|
export default function Home() {
|
|
const { currentView, setCurrentView, loadGallery } = useStore();
|
|
|
|
useEffect(() => {
|
|
loadGallery();
|
|
}, [loadGallery]);
|
|
|
|
const handleTabChange = (tab: 'create' | 'library' | 'uploads' | 'settings') => {
|
|
if (tab === 'create') setCurrentView('gallery');
|
|
else if (tab === 'uploads') setCurrentView('history');
|
|
else setCurrentView(tab);
|
|
};
|
|
|
|
const getActiveTab = () => {
|
|
if (currentView === 'gallery') return 'create';
|
|
if (currentView === 'history') return 'uploads';
|
|
return currentView as 'create' | 'library' | 'uploads' | 'settings';
|
|
};
|
|
|
|
return (
|
|
<div className="flex h-[100dvh] w-full bg-background text-foreground overflow-hidden font-sans flex-col relative">
|
|
{/* Top Navbar - Mobile Header */}
|
|
<Navbar />
|
|
|
|
{/* Main Content Area */}
|
|
<main className="flex-1 relative flex flex-col w-full overflow-hidden">
|
|
|
|
{/* Scrollable Container */}
|
|
<div className="flex-1 overflow-y-auto w-full scroll-smooth no-scrollbar pt-16 pb-24 md:pb-0">
|
|
<div className="w-full max-w-lg md:max-w-7xl mx-auto p-4 md:p-6 min-h-full">
|
|
|
|
{/* Always show Hero on Create View */}
|
|
{currentView === 'gallery' && (
|
|
<>
|
|
<PromptHero />
|
|
<Gallery />
|
|
</>
|
|
)}
|
|
|
|
{currentView === 'settings' && <Settings />}
|
|
|
|
{currentView === 'library' && (
|
|
<PromptLibrary onSelect={(p) => setCurrentView('gallery')} />
|
|
)}
|
|
|
|
{currentView === 'history' && <UploadHistory />}
|
|
|
|
</div>
|
|
</div>
|
|
</main>
|
|
|
|
{/* Bottom Navigation (Mobile & Desktop App-like) */}
|
|
<BottomNav currentTab={getActiveTab()} onTabChange={handleTabChange} />
|
|
|
|
<CookieExpiredDialog />
|
|
</div>
|
|
);
|
|
}
|