125 lines
4.3 KiB
TypeScript
125 lines
4.3 KiB
TypeScript
"use client";
|
|
|
|
import Link from "next/link";
|
|
import { useEffect, useState } from "react";
|
|
import { useRouter } from "next/navigation";
|
|
import { Button } from "@/components/ui/button";
|
|
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
|
|
import { doesSessionExist } from "supertokens-web-js/recipe/session";
|
|
|
|
export default function HomePage() {
|
|
const router = useRouter();
|
|
const [isLoading, setIsLoading] = useState(true);
|
|
const [isLoggedIn, setIsLoggedIn] = useState(false);
|
|
|
|
useEffect(() => {
|
|
// Check if user is already logged in
|
|
doesSessionExist().then((exists) => {
|
|
setIsLoggedIn(exists);
|
|
setIsLoading(false);
|
|
|
|
// If logged in, redirect to projects
|
|
if (exists) {
|
|
router.push("/marks-account/projects");
|
|
}
|
|
}).catch(() => {
|
|
setIsLoading(false);
|
|
});
|
|
}, [router]);
|
|
|
|
if (isLoading) {
|
|
return (
|
|
<div className="flex min-h-screen items-center justify-center bg-background">
|
|
<div className="text-center">
|
|
<div className="h-8 w-8 animate-spin rounded-full border-4 border-primary border-t-transparent mx-auto mb-4" />
|
|
<p className="text-muted-foreground">Loading...</p>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<div className="flex min-h-screen items-center justify-center bg-background p-4">
|
|
<div className="w-full max-w-2xl space-y-6">
|
|
{/* Logo */}
|
|
<div className="flex justify-center">
|
|
<img
|
|
src="/vibn-black-circle-logo.png"
|
|
alt="Vib'n"
|
|
className="h-24 w-24"
|
|
/>
|
|
</div>
|
|
|
|
{/* Welcome Card */}
|
|
<Card>
|
|
<CardHeader className="space-y-1">
|
|
<CardTitle className="text-3xl font-bold text-center">
|
|
Welcome to Vib'n
|
|
</CardTitle>
|
|
<CardDescription className="text-center text-lg">
|
|
Your AI-powered development platform
|
|
</CardDescription>
|
|
</CardHeader>
|
|
<CardContent className="space-y-6">
|
|
<div className="text-center space-y-4">
|
|
<p className="text-muted-foreground">
|
|
Track, manage, and deploy your AI-coded projects with ease.
|
|
</p>
|
|
|
|
<div className="grid gap-4 md:grid-cols-3">
|
|
<Card className="bg-muted/50">
|
|
<CardContent className="pt-6">
|
|
<div className="text-3xl mb-2">🚀</div>
|
|
<h3 className="font-semibold mb-1">Fast Deployment</h3>
|
|
<p className="text-xs text-muted-foreground">
|
|
Deploy to Coolify with one click
|
|
</p>
|
|
</CardContent>
|
|
</Card>
|
|
|
|
<Card className="bg-muted/50">
|
|
<CardContent className="pt-6">
|
|
<div className="text-3xl mb-2">🤖</div>
|
|
<h3 className="font-semibold mb-1">AI-Powered</h3>
|
|
<p className="text-xs text-muted-foreground">
|
|
Track AI coding sessions
|
|
</p>
|
|
</CardContent>
|
|
</Card>
|
|
|
|
<Card className="bg-muted/50">
|
|
<CardContent className="pt-6">
|
|
<div className="text-3xl mb-2">📊</div>
|
|
<h3 className="font-semibold mb-1">Analytics</h3>
|
|
<p className="text-xs text-muted-foreground">
|
|
Monitor project progress
|
|
</p>
|
|
</CardContent>
|
|
</Card>
|
|
</div>
|
|
|
|
<div className="pt-6 flex gap-4 justify-center">
|
|
<Button size="lg" asChild>
|
|
<Link href="/auth">
|
|
Get Started
|
|
</Link>
|
|
</Button>
|
|
<Button size="lg" variant="outline" asChild>
|
|
<a href={process.env.NEXT_PUBLIC_PROXY_URL || "#"} target="_blank" rel="noopener noreferrer">
|
|
API Docs
|
|
</a>
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
</CardContent>
|
|
</Card>
|
|
|
|
{/* Features */}
|
|
<div className="text-center text-sm text-muted-foreground">
|
|
<p>✅ Self-hosted • ✅ Open source • ✅ Powered by Coolify</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|