ob/sprint
1
0
Fork 0
mirror of https://github.com/hex248/sprint.git synced 2026-02-08 18:33:01 +00:00
Code Issues Packages Projects Releases Wiki Activity

replaced login page with modal

Browse Source
This commit is contained in:
Oliver Bryan
2026-01-28 10:22:36 +00:00
parent 04bafca5f3
commit 26d2c904b4
6 changed files with 89 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
packages/frontend/src/pages/Landing.tsx
View File

@@ -1,5 +1,6 @@
import { useState } from "react";
import { Link } from "react-router-dom";
import { LoginModal } from "@/components/login-modal";
import { useSession } from "@/components/session-provider";
import ThemeToggle from "@/components/theme-toggle";
import { Button } from "@/components/ui/button";
@@ -24,7 +25,6 @@ const pricingTiers = [
"Email support",
],
cta: "Get started free",
ctaLink: "/login",
highlighted: false,
},
{
@@ -45,7 +45,6 @@ const pricingTiers = [
"Priority email support",
],
cta: "Try pro free for 14 days",
ctaLink: "/login",
highlighted: true,
},
];
@@ -88,6 +87,7 @@ const faqs = [
export default function Landing() {
const { user, isLoading } = useSession();
const [billingPeriod, setBillingPeriod] = useState<"monthly" | "annual">("monthly");
const [loginModalOpen, setLoginModalOpen] = useState(false);
return (
<div className="min-h-screen flex flex-col" id="top">
@@ -129,8 +129,8 @@ export default function Landing() {
<Link to="/issues">Open app</Link>
</Button>
) : (
<Button asChild variant="outline" size="sm">
<Link to="/login">Sign in</Link>
<Button variant="outline" size="sm" onClick={() => setLoginModalOpen(true)}>
Sign in
</Button>
)}
</div>
@@ -162,8 +162,8 @@ export default function Landing() {
</Button>
) : (
<>
<Button asChild size="lg" className="text-lg px-8 py-6">
<Link to="/login">Start free trial</Link>
<Button size="lg" className="text-lg px-8 py-6" onClick={() => setLoginModalOpen(true)}>
Start free trial
</Button>
<Button asChild variant="outline" size="lg" className="text-lg px-8 py-6">
<a href="#pricing">See pricing</a>
@@ -381,14 +381,14 @@ export default function Landing() {
</ul>
<Button
asChild
variant={tier.highlighted ? "default" : "outline"}
className={cn(
"font-700 py-6",
tier.highlighted ? "bg-personality hover:bg-personality/90 text-background" : "",
)}
onClick={() => setLoginModalOpen(true)}
>
<Link to={tier.ctaLink}>{tier.cta}</Link>
{tier.cta}
</Button>
</div>
))}
@@ -472,8 +472,8 @@ export default function Landing() {
<Link to="/issues">Open app</Link>
</Button>
) : (
<Button asChild size="lg" className="text-lg px-8 py-6">
<Link to="/login">Start your free trial</Link>
<Button size="lg" className="text-lg px-8 py-6" onClick={() => setLoginModalOpen(true)}>
Start your free trial
</Button>
)}
</div>
@@ -484,6 +484,8 @@ export default function Landing() {
</div>
</main>
<LoginModal open={loginModalOpen} onOpenChange={setLoginModalOpen} />
<footer className="flex justify-center gap-2 items-center py-1 border-t">
<span className="font-300 text-lg text-muted-foreground">
Built by{" "}

32
packages/frontend/src/pages/Login.tsx
View File

@@ -1,32 +0,0 @@
import { useEffect } from "react";
import { useNavigate, useSearchParams } from "react-router-dom";
import Loading from "@/components/loading";
import LogInForm from "@/components/login-form";
import { useSession } from "@/components/session-provider";
export default function Login() {
const navigate = useNavigate();
const [searchParams] = useSearchParams();
const { user, isLoading } = useSession();
useEffect(() => {
if (!isLoading && user) {
const next = searchParams.get("next") || "/issues";
navigate(next, { replace: true });
}
}, [user, isLoading, navigate, searchParams]);
if (isLoading) {
return <Loading message="Checking authentication" />;
}
if (user) {
return <Loading message="Redirecting" />;
}
return (
<div className="flex flex-col items-center justify-center gap-4 w-full h-[100vh]">
<LogInForm />
</div>
);
}