store: simplify /services and /contact to the approved design #48

New issue

Closed

opened 2026-08-27 06:35:53 +00:00 by yuris · 0 comments

yuris commented

2026-08-27 06:35:53 +00:00

Owner

The mockups for these two pages were deliberately cut down after review — layanan.html lost 42% of its markup and kontak.html 29% — because both said everything twice. The shipped pages have the same problem the mockups had before the cut.

/services → `layanan.html`

One grid of six entries, nothing else. Each entry: category label, service name, one summary line, one WhatsApp CTA with the existing whatsappUrl({kind:"service"}) prefill, and a Sparepart yang dipakai link into the matching catalog category. Above the grid, a single line of guidance replacing all per-service checklists: "Saat chat, sebutkan jenis dan tahun kendaraan, plus gejala atau bagian yang dikerjakan." Keep the Beli di sini, pasang di tempat. positioning line and the closing catalog band.

The six services and their copy stay exactly as apps/store/lib/services.ts has them — no invented prices, turnaround times or warranty terms. The long description field still feeds /services/[slug], which keeps its Service JSON-LD and its parts-by-installService list; only the index gets simpler.

/contact → `kontak.html`

Two sections, down from the current page's panel set:

Identity — name, address, hours, service area, with one primary action (Chat WhatsApp) plus Telepon and Petunjuk arah, and the map beside it. All values from lib/business.ts.
Cara pesan — four one-line steps (Chat → Konfirmasi → Transfer → Dikirim atau dipasang) with the note that there is no online payment and that harga, ongkir and jadwal are settled in chat, including the one non-obvious fact: kirim ke seluruh Indonesia lewat JNE, J&T atau Indah Cargo, ongkir dihitung lewat chat.

Two follow-ons

Fold /cara-pesan into /contact. The design puts the ordering flow at kontak.html#cara-pesan, and app/cara-pesan/page.tsx currently duplicates it as a fifth route. Redirect or remove it, and update app/sitemap.ts (which lists /cara-pesan) plus every internal link — including the footer.
Real map. The mockup carries a clearly-marked placeholder. Ship a real embed or a static map image linking to business.directionsUrl; a static image is preferable on a static export with images.unoptimized, since an iframe embed costs a third-party request on every visit.

Acceptance

Both pages render the reduced structure at desktop, 701–1120px and 375px. /cara-pesan no longer exists as a separate route and nothing links to it. The sitemap matches the real route set. Service WhatsApp prefills are unchanged — lib/contact-links.test.ts still passes untouched.

The mockups for these two pages were deliberately cut down after review — `layanan.html` lost 42% of its markup and `kontak.html` 29% — because both said everything twice. The shipped pages have the same problem the mockups had before the cut. ### /services → `layanan.html` One grid of six entries, nothing else. Each entry: category label, service name, **one** summary line, one WhatsApp CTA with the existing `whatsappUrl({kind:"service"})` prefill, and a `Sparepart yang dipakai` link into the matching catalog category. Above the grid, a single line of guidance replacing all per-service checklists: *"Saat chat, sebutkan jenis dan tahun kendaraan, plus gejala atau bagian yang dikerjakan."* Keep the `Beli di sini, pasang di tempat.` positioning line and the closing catalog band. The six services and their copy stay exactly as `apps/store/lib/services.ts` has them — no invented prices, turnaround times or warranty terms. The long `description` field still feeds `/services/[slug]`, which keeps its `Service` JSON-LD and its parts-by-`installService` list; only the index gets simpler. ### /contact → `kontak.html` Two sections, down from the current page's panel set: 1. Identity — name, address, hours, service area, with **one** primary action (Chat WhatsApp) plus Telepon and Petunjuk arah, and the map beside it. All values from `lib/business.ts`. 2. `Cara pesan` — four one-line steps (Chat → Konfirmasi → Transfer → Dikirim atau dipasang) with the note that there is no online payment and that harga, ongkir and jadwal are settled in chat, including the one non-obvious fact: kirim ke seluruh Indonesia lewat JNE, J&T atau Indah Cargo, ongkir dihitung lewat chat. ### Two follow-ons - **Fold `/cara-pesan` into `/contact`.** The design puts the ordering flow at `kontak.html#cara-pesan`, and `app/cara-pesan/page.tsx` currently duplicates it as a fifth route. Redirect or remove it, and update `app/sitemap.ts` (which lists `/cara-pesan`) plus every internal link — including the footer. - **Real map.** The mockup carries a clearly-marked placeholder. Ship a real embed or a static map image linking to `business.directionsUrl`; a static image is preferable on a static export with `images.unoptimized`, since an iframe embed costs a third-party request on every visit. ### Acceptance Both pages render the reduced structure at desktop, 701–1120px and 375px. `/cara-pesan` no longer exists as a separate route and nothing links to it. The sitemap matches the real route set. Service WhatsApp prefills are unchanged — `lib/contact-links.test.ts` still passes untouched.

yuris referenced this issue

2026-08-27 08:51:04 +00:00

feat(store): reconcile globals.css with the approved design tokens #52

yuris referenced this issue

2026-08-27 16:47:03 +00:00

data: no published item has category, brand, fitment, oemNumbers or weightGrams — three of four facets are empty in production #61

yuris referenced this issue from a pull request that will close it,

2026-08-27 19:26:05 +00:00

feat(store): simplify /services and /contact to the approved design #63

yuris referenced this issue

2026-08-27 20:01:19 +00:00

feat(store): simplify /services and /contact to the approved design #63