85 lines
3.4 KiB
TypeScript
85 lines
3.4 KiB
TypeScript
"use client";
|
|
|
|
import Link from "next/link";
|
|
import { Compass, LogIn, Sparkles } from "lucide-react";
|
|
import { useAuth } from "@/components/auth/auth-provider";
|
|
|
|
/**
|
|
* / — the Home (Feed) gate.
|
|
*
|
|
* The Instagram-inspired infinite-scroll feed of posts from people you
|
|
* follow will live here. Until that ships we show two paths:
|
|
*
|
|
* • Sign in — for visitors who don't have an account yet; the eventual
|
|
* feed is personalised, so an account is the prerequisite.
|
|
* • Explore the Knowledgebase — Śrīla Prabhupāda's full library is
|
|
* ready today, regardless of feed status.
|
|
*
|
|
* The "Sign in" CTA hides once the user is authenticated — at that point
|
|
* there's nothing to gate, just a "feed coming soon" note above the
|
|
* always-on Knowledgebase entry.
|
|
*/
|
|
|
|
export default function HomePage() {
|
|
const { user, loading } = useAuth();
|
|
const authed = !loading && !!user;
|
|
|
|
return (
|
|
<main className="flex-1 max-w-2xl w-full mx-auto px-4 sm:px-6 py-16 sm:py-24">
|
|
<div className="flex flex-col items-center text-center gap-5">
|
|
<span
|
|
aria-hidden
|
|
className="inline-flex size-14 items-center justify-center rounded-full bg-primary/10 text-primary"
|
|
>
|
|
<Sparkles className="size-6" />
|
|
</span>
|
|
|
|
<h1 className="font-[family-name:var(--font-title)] font-semibold text-2xl sm:text-3xl text-foreground leading-tight text-balance">
|
|
{authed
|
|
? "Your feed is coming soon"
|
|
: "Welcome to Prabhupāda Says"}
|
|
</h1>
|
|
|
|
<p className="text-sm text-muted-foreground leading-relaxed max-w-md">
|
|
{authed
|
|
? "We're building a feed of quotes shared by the community. Until it lands, dive into the Knowledgebase — Śrīla Prabhupāda's books, letters, lectures, and teachings."
|
|
: "Sign in to follow seekers and see their quotes here once the feed launches, or jump straight into the Knowledgebase — the original, unedited writings of His Divine Grace A.C. Bhaktivedanta Swami Prabhupāda."}
|
|
</p>
|
|
|
|
<div className="flex flex-col sm:flex-row items-center gap-3 mt-2">
|
|
{!authed ? (
|
|
<Link
|
|
href="/login"
|
|
className="inline-flex items-center justify-center gap-2 rounded-lg bg-primary text-primary-foreground px-5 h-11 text-sm font-medium hover:bg-primary/90 transition-colors min-w-[12rem]"
|
|
>
|
|
<LogIn className="size-4" />
|
|
Sign in to view feed
|
|
</Link>
|
|
) : null}
|
|
<Link
|
|
href="/search"
|
|
className={
|
|
authed
|
|
? "inline-flex items-center justify-center gap-2 rounded-lg bg-primary text-primary-foreground px-5 h-11 text-sm font-medium hover:bg-primary/90 transition-colors min-w-[12rem]"
|
|
: "inline-flex items-center justify-center gap-2 rounded-lg border border-border text-foreground px-5 h-11 text-sm font-medium hover:bg-muted transition-colors min-w-[12rem]"
|
|
}
|
|
>
|
|
<Compass className="size-4" />
|
|
Explore Knowledgebase
|
|
</Link>
|
|
</div>
|
|
|
|
{!authed ? (
|
|
<p className="text-xs text-muted-foreground mt-1">
|
|
No account?{" "}
|
|
<Link href="/signup" className="text-foreground hover:underline">
|
|
Create one
|
|
</Link>{" "}
|
|
— it's free.
|
|
</p>
|
|
) : null}
|
|
</div>
|
|
</main>
|
|
);
|
|
}
|