vngrup/dress
vngrup/dress
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: remove Cara Pesan section and optimize filter parameter handling in homepage router calls

Browse Source
This commit is contained in:
Yoga Pangestu 2026-04-24 00:19:57 +07:00
parent b7f3953a56
commit bfd96f1358
1 changed files with 14 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
resources/js/pages/homepage.tsx
View File

@ -20,7 +20,11 @@ export default function Homepage({ categories = [], bestSellers, topSellingProdu
useEffect(() => {
const timer = setTimeout(() => {
router.get(window.location.pathname, { search, category: selectedCategorySlug }, {
const params: any = {};
if (search) params.search = search;
if (selectedCategorySlug) params.category = selectedCategorySlug;
router.get(window.location.pathname, params, {
preserveState: true,
preserveScroll: true,
only: ['bestSellers'],
@ -34,7 +38,11 @@ export default function Homepage({ categories = [], bestSellers, topSellingProdu
}, [search]);
useEffect(() => {
router.get(window.location.pathname, { search, category: selectedCategorySlug }, {
const params: any = {};
if (search) params.search = search;
if (selectedCategorySlug) params.category = selectedCategorySlug;
router.get(window.location.pathname, params, {
preserveState: true,
preserveScroll: true,
only: ['bestSellers'],
@ -135,7 +143,6 @@ export default function Homepage({ categories = [], bestSellers, topSellingProdu
<nav className="hidden items-center gap-10 text-[10px] font-bold uppercase tracking-[0.2em] md:flex">
<a href="#homepage" onClick={(e) => scrollToSection(e, '#homepage')} className="hover:opacity-70 transition-opacity">Beranda</a>
<a href="#product" onClick={(e) => scrollToSection(e, '#product')} className="hover:opacity-70 transition-opacity">Produk</a>
<a href="#howToOrder" onClick={(e) => scrollToSection(e, '#howToOrder')} className="hover:opacity-70 transition-opacity">Cara Pesan</a>
<a href="#aboutUs" onClick={(e) => scrollToSection(e, '#aboutUs')} className="hover:opacity-70 transition-opacity">Tentang Kami</a>
</nav>
@ -357,29 +364,6 @@ export default function Homepage({ categories = [], bestSellers, topSellingProdu
</div>
</section>
{/* How To Order Section */}
<section id="howToOrder" className="border-b border-[#1e4a6d]/20 bg-[#f7f3eb]">
<div className="mx-auto max-w-7xl border-x border-[#1e4a6d]/20">
<div className="grid grid-cols-1 md:grid-cols-3">
{[
{ step: "01", title: "Pilih Product", desc: "Temukan koleksi kemeja terbaik kami yang sesuai dengan gaya Anda." },
{ step: "02", title: "Hubungi Kami", desc: "Konfirmasi pesanan melalui WhatsApp dengan detail ukuran dan warna." },
{ step: "03", title: "Pengiriman", desc: "Pesanan akan dikemas eksklusif dan dikirim langsung ke alamat Anda." }
].map((item, idx) => (
<div key={idx} className="group border-b border-[#1e4a6d]/20 p-12 last:border-b-0 md:border-b-0 md:border-r md:last:border-r-0">
<div className="mb-8 flex h-12 w-12 items-center justify-center rounded-full border border-[#1e4a6d]/20 text-xs font-bold transition-all group-hover:bg-[#1e4a6d] group-hover:text-white">
{item.step}
</div>
<h3 className="mb-4 text-xl font-medium">{item.title}</h3>
<p className="text-sm leading-relaxed opacity-60">
{item.desc}
</p>
</div>
))}
</div>
</div>
</section>
{/* Brand Section */}
<section id="aboutUs" className="border-b border-[#1e4a6d]/20 bg-[#f7f3eb]">
<div className="mx-auto max-w-7xl">
@ -434,7 +418,6 @@ export default function Homepage({ categories = [], bestSellers, topSellingProdu
<ul className="flex flex-col gap-3 text-sm opacity-60">
<li><Link href="#" className="hover:underline">Beranda</Link></li>
<li><Link href="#" className="hover:underline">Produk</Link></li>
<li><Link href="#" className="hover:underline">Cara Pesan</Link></li>
<li><Link href="#" className="hover:underline">Tentang Kami</Link></li>
</ul>
</div>
@ -483,7 +466,6 @@ export default function Homepage({ categories = [], bestSellers, topSellingProdu
<div className="flex flex-col gap-8 text-3xl font-medium">
<a href="#homepage" onClick={(e) => scrollToSection(e, '#homepage')} className="hover:italic transition-all">Beranda</a>
<a href="#product" onClick={(e) => scrollToSection(e, '#product')} className="hover:italic transition-all">Produk</a>
<a href="#howToOrder" onClick={(e) => scrollToSection(e, '#howToOrder')} className="hover:italic transition-all">Cara Pesan</a>
<a href="#aboutUs" onClick={(e) => scrollToSection(e, '#aboutUs')} className="hover:italic transition-all">Tentang Kami</a>
</div>
<div className="mt-20 flex gap-6">
@ -525,8 +507,8 @@ export default function Homepage({ categories = [], bestSellers, topSellingProdu
<div
onClick={() => setActiveModalImage(selectedProduct?.thumbnail_url)}
className={`relative aspect-square w-14 cursor-pointer overflow-hidden transition-all duration-300 ${activeModalImage === selectedProduct?.thumbnail_url
? 'ring-1 ring-[#1e4a6d] ring-offset-2'
: 'opacity-40 hover:opacity-100'
? 'ring-1 ring-[#1e4a6d] ring-offset-2'
: 'opacity-40 hover:opacity-100'
}`}
>
<img src={selectedProduct?.thumbnail_url} className="h-full w-full object-cover" alt="main" />
@ -538,8 +520,8 @@ export default function Homepage({ categories = [], bestSellers, topSellingProdu
key={i}
onClick={() => setActiveModalImage(img.url)}
className={`relative aspect-square w-14 cursor-pointer overflow-hidden transition-all duration-300 ${activeModalImage === img.url
? 'ring-1 ring-[#1e4a6d] ring-offset-2'
: 'opacity-40 hover:opacity-100'
? 'ring-1 ring-[#1e4a6d] ring-offset-2'
: 'opacity-40 hover:opacity-100'
}`}
>
<img src={img.url} className="h-full w-full object-cover" alt={`view ${i + 1}`} />