- Create (public) route group with landing page (hero, featured listings, district links, stats, CTA) - Create search page with filter sidebar, list/map/split view modes, URL-synced filters, pagination - Build ListingMap component with CSS-based marker visualization and popup details - Build FilterBar with transaction type, property type, city, price range, area, bedrooms filters - Build PropertyCard and SearchResults components with responsive grid layout - Update middleware to allow public access to / and /search routes - Move dashboard home to /dashboard to avoid route conflict - All content in Vietnamese, mobile responsive Co-Authored-By: Paperclip <noreply@paperclip.ing>
115 lines
4.8 KiB
TypeScript
115 lines
4.8 KiB
TypeScript
'use client';
|
|
|
|
import Link from 'next/link';
|
|
import { usePathname } from 'next/navigation';
|
|
import { cn } from '@/lib/utils';
|
|
import { useAuthStore } from '@/lib/auth-store';
|
|
import { Button } from '@/components/ui/button';
|
|
|
|
export default function PublicLayout({ children }: { children: React.ReactNode }) {
|
|
const pathname = usePathname();
|
|
const { user } = useAuthStore();
|
|
|
|
return (
|
|
<div className="min-h-screen bg-background">
|
|
<header className="sticky top-0 z-50 border-b bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/60">
|
|
<div className="mx-auto flex h-14 max-w-7xl items-center px-4">
|
|
<Link href="/" className="mr-6 flex items-center space-x-2">
|
|
<span className="text-lg font-bold text-primary">GoodGo</span>
|
|
</Link>
|
|
|
|
<nav className="flex items-center space-x-1">
|
|
<Link
|
|
href="/"
|
|
className={cn(
|
|
'rounded-md px-3 py-2 text-sm font-medium transition-colors hover:bg-accent hover:text-accent-foreground',
|
|
pathname === '/' ? 'bg-accent text-accent-foreground' : 'text-muted-foreground',
|
|
)}
|
|
>
|
|
Trang chủ
|
|
</Link>
|
|
<Link
|
|
href="/search"
|
|
className={cn(
|
|
'rounded-md px-3 py-2 text-sm font-medium transition-colors hover:bg-accent hover:text-accent-foreground',
|
|
pathname.startsWith('/search')
|
|
? 'bg-accent text-accent-foreground'
|
|
: 'text-muted-foreground',
|
|
)}
|
|
>
|
|
Tìm kiếm
|
|
</Link>
|
|
</nav>
|
|
|
|
<div className="ml-auto flex items-center space-x-3">
|
|
{user ? (
|
|
<>
|
|
<span className="hidden text-sm text-muted-foreground sm:inline">
|
|
{user.fullName}
|
|
</span>
|
|
<Link href="/dashboard">
|
|
<Button size="sm">Bảng điều khiển</Button>
|
|
</Link>
|
|
</>
|
|
) : (
|
|
<>
|
|
<Link href="/login">
|
|
<Button variant="ghost" size="sm">
|
|
Đăng nhập
|
|
</Button>
|
|
</Link>
|
|
<Link href="/register">
|
|
<Button size="sm">Đăng ký</Button>
|
|
</Link>
|
|
</>
|
|
)}
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
<main>{children}</main>
|
|
|
|
<footer className="border-t bg-muted/40">
|
|
<div className="mx-auto max-w-7xl px-4 py-8">
|
|
<div className="grid gap-8 sm:grid-cols-2 lg:grid-cols-4">
|
|
<div>
|
|
<h3 className="mb-3 text-sm font-semibold">GoodGo</h3>
|
|
<p className="text-sm text-muted-foreground">
|
|
Nền tảng bất động sản thông minh tại Việt Nam
|
|
</p>
|
|
</div>
|
|
<div>
|
|
<h3 className="mb-3 text-sm font-semibold">Loại BĐS</h3>
|
|
<ul className="space-y-2 text-sm text-muted-foreground">
|
|
<li><Link href="/search?propertyType=APARTMENT" className="hover:text-foreground">Căn hộ</Link></li>
|
|
<li><Link href="/search?propertyType=HOUSE" className="hover:text-foreground">Nhà riêng</Link></li>
|
|
<li><Link href="/search?propertyType=VILLA" className="hover:text-foreground">Biệt thự</Link></li>
|
|
<li><Link href="/search?propertyType=LAND" className="hover:text-foreground">Đất nền</Link></li>
|
|
</ul>
|
|
</div>
|
|
<div>
|
|
<h3 className="mb-3 text-sm font-semibold">Khu vực</h3>
|
|
<ul className="space-y-2 text-sm text-muted-foreground">
|
|
<li><Link href="/search?city=Hồ Chí Minh" className="hover:text-foreground">TP. Hồ Chí Minh</Link></li>
|
|
<li><Link href="/search?city=Hà Nội" className="hover:text-foreground">Hà Nội</Link></li>
|
|
<li><Link href="/search?city=Đà Nẵng" className="hover:text-foreground">Đà Nẵng</Link></li>
|
|
<li><Link href="/search?city=Nha Trang" className="hover:text-foreground">Nha Trang</Link></li>
|
|
</ul>
|
|
</div>
|
|
<div>
|
|
<h3 className="mb-3 text-sm font-semibold">Hỗ trợ</h3>
|
|
<ul className="space-y-2 text-sm text-muted-foreground">
|
|
<li><Link href="/login" className="hover:text-foreground">Đăng nhập</Link></li>
|
|
<li><Link href="/register" className="hover:text-foreground">Đăng ký</Link></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div className="mt-8 border-t pt-4 text-center text-sm text-muted-foreground">
|
|
© 2026 GoodGo. Tất cả quyền được bảo lưu.
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
</div>
|
|
);
|
|
}
|