Add back to home button on auth page

Added a "Kembali ke Beranda" (Back to Home) button on the login/signup
page to allow users to navigate back to the home page without needing
to authenticate.

Changes:
- Imported Link and ArrowLeft icon from lucide-react
- Added button above the auth card that links to "/"
- Wrapped content in a space-y-4 container for proper spacing

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
dwindown
2026-01-02 10:42:01 +07:00
parent 60baf32f73
commit db882f48c4

View File

@@ -1,5 +1,5 @@
import { useState, useEffect } from 'react';
import { useNavigate } from 'react-router-dom';
import { useNavigate, Link } from 'react-router-dom';
import { useAuth } from '@/hooks/useAuth';
import { Button } from '@/components/ui/button';
import { Input } from '@/components/ui/input';
@@ -7,6 +7,7 @@ import { Label } from '@/components/ui/label';
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
import { toast } from '@/hooks/use-toast';
import { z } from 'zod';
import { ArrowLeft } from 'lucide-react';
const emailSchema = z.string().email('Invalid email address');
const passwordSchema = z.string().min(6, 'Password must be at least 6 characters');
@@ -71,7 +72,16 @@ export default function Auth() {
return (
<div className="min-h-screen flex items-center justify-center bg-background p-4">
<Card className="w-full max-w-md border-2 border-border shadow-md">
<div className="w-full max-w-md space-y-4">
{/* Back to Home Button */}
<Link to="/">
<Button variant="ghost" className="gap-2">
<ArrowLeft className="w-4 h-4" />
Kembali ke Beranda
</Button>
</Link>
<Card className="border-2 border-border shadow-md">
<CardHeader>
<CardTitle className="text-2xl">{isLogin ? 'Login' : 'Sign Up'}</CardTitle>
<CardDescription>
@@ -132,5 +142,6 @@ export default function Auth() {
</CardContent>
</Card>
</div>
</div>
);
}