add loading and optimize query using cache and pwa
This commit is contained in:
@@ -0,0 +1,17 @@
|
||||
/**
|
||||
* Skeleton generik untuk route group `(public)` — fallback streaming bagi
|
||||
* halaman yang tidak punya `loading.tsx` sendiri (beranda, profil, dll).
|
||||
*/
|
||||
export default function Loading() {
|
||||
return (
|
||||
<div className="mx-auto max-w-5xl px-4 py-10">
|
||||
<div className="h-8 w-1/2 animate-pulse rounded-xl bg-neutral-200" />
|
||||
<div className="mt-4 space-y-3">
|
||||
<div className="h-4 w-full animate-pulse rounded bg-neutral-100" />
|
||||
<div className="h-4 w-5/6 animate-pulse rounded bg-neutral-100" />
|
||||
<div className="h-4 w-2/3 animate-pulse rounded bg-neutral-100" />
|
||||
</div>
|
||||
<div className="mt-8 h-64 animate-pulse rounded-2xl bg-neutral-100" />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,31 @@
|
||||
/** Skeleton halaman detail trip — tampil instan saat data masih di-fetch. */
|
||||
export default function Loading() {
|
||||
return (
|
||||
<div className="mx-auto max-w-3xl px-4 py-4 sm:py-8">
|
||||
<div className="mb-3 h-4 w-40 animate-pulse rounded bg-neutral-200 sm:mb-4" />
|
||||
|
||||
<div className="overflow-hidden rounded-2xl border border-neutral-200 bg-white shadow-sm">
|
||||
<div className="h-44 animate-pulse bg-neutral-200 sm:h-56 lg:h-72" />
|
||||
|
||||
<div className="border-b border-neutral-100 px-4 py-4 sm:px-6">
|
||||
<div className="h-6 w-2/3 animate-pulse rounded bg-neutral-200" />
|
||||
<div className="mt-2 h-4 w-1/3 animate-pulse rounded bg-neutral-100" />
|
||||
</div>
|
||||
|
||||
<div className="space-y-5 p-4 sm:space-y-6 sm:p-6">
|
||||
<div className="grid grid-cols-2 gap-2 sm:gap-3">
|
||||
{Array.from({ length: 4 }).map((_, i) => (
|
||||
<div
|
||||
key={i}
|
||||
className="h-16 animate-pulse rounded-xl bg-neutral-100 sm:h-[72px]"
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
<div className="h-24 animate-pulse rounded-xl bg-neutral-100" />
|
||||
<div className="h-32 animate-pulse rounded-xl bg-neutral-100" />
|
||||
<div className="h-12 animate-pulse rounded-xl bg-neutral-200" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,29 @@
|
||||
/** Skeleton daftar trip — tampil instan saat list masih di-fetch. */
|
||||
export default function Loading() {
|
||||
return (
|
||||
<div className="mx-auto max-w-6xl px-4 py-6 sm:py-8">
|
||||
<div className="mb-6 h-8 w-56 animate-pulse rounded-lg bg-neutral-200 sm:mb-8" />
|
||||
<div className="mb-6 h-40 animate-pulse rounded-2xl bg-neutral-100" />
|
||||
|
||||
<div className="grid gap-4 sm:grid-cols-2 lg:grid-cols-3">
|
||||
{Array.from({ length: 6 }).map((_, i) => (
|
||||
<div
|
||||
key={i}
|
||||
className="overflow-hidden rounded-2xl border border-neutral-200 bg-white"
|
||||
>
|
||||
<div className="h-40 animate-pulse bg-neutral-200" />
|
||||
<div className="space-y-3 p-4">
|
||||
<div className="h-5 w-3/4 animate-pulse rounded bg-neutral-200" />
|
||||
<div className="h-4 w-1/2 animate-pulse rounded bg-neutral-100" />
|
||||
<div className="h-4 w-2/3 animate-pulse rounded bg-neutral-100" />
|
||||
<div className="mt-3 flex items-center justify-between border-t border-neutral-100 pt-3">
|
||||
<div className="h-5 w-20 animate-pulse rounded bg-neutral-200" />
|
||||
<div className="h-4 w-16 animate-pulse rounded bg-neutral-100" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,31 @@
|
||||
import type { MetadataRoute } from "next";
|
||||
import { siteConfig } from "@/lib/site";
|
||||
|
||||
/**
|
||||
* Web app manifest — dideteksi otomatis oleh Next App Router (`<link
|
||||
* rel="manifest">` di-inject). Mendukung "Add to Home Screen" di mobile.
|
||||
*/
|
||||
export default function manifest(): MetadataRoute.Manifest {
|
||||
return {
|
||||
name: `${siteConfig.name} — ${siteConfig.slogan}`,
|
||||
short_name: siteConfig.name,
|
||||
description: siteConfig.description,
|
||||
start_url: "/",
|
||||
display: "standalone",
|
||||
background_color: "#f9fafb",
|
||||
theme_color: "#16a34a",
|
||||
icons: [
|
||||
{
|
||||
src: "/images/SeTrip.png",
|
||||
sizes: "512x512",
|
||||
type: "image/png",
|
||||
purpose: "any",
|
||||
},
|
||||
{
|
||||
src: "/SeTrip.ico",
|
||||
sizes: "any",
|
||||
type: "image/x-icon",
|
||||
},
|
||||
],
|
||||
};
|
||||
}
|
||||
+8
-1
@@ -7,7 +7,14 @@ export default function robots(): MetadataRoute.Robots {
|
||||
{
|
||||
userAgent: "*",
|
||||
allow: "/",
|
||||
disallow: ["/api/", "/profile", "/create-trip"],
|
||||
disallow: [
|
||||
"/api/",
|
||||
"/admin",
|
||||
"/profile",
|
||||
"/create-trip",
|
||||
"/verify",
|
||||
"/trips/*/payment",
|
||||
],
|
||||
},
|
||||
],
|
||||
sitemap: absoluteUrl("/sitemap.xml"),
|
||||
|
||||
@@ -24,6 +24,12 @@ export default async function sitemap(): Promise<MetadataRoute.Sitemap> {
|
||||
changeFrequency: "hourly",
|
||||
priority: 0.9,
|
||||
},
|
||||
{
|
||||
url: absoluteUrl("/people"),
|
||||
lastModified: now,
|
||||
changeFrequency: "daily",
|
||||
priority: 0.7,
|
||||
},
|
||||
{
|
||||
url: absoluteUrl("/register"),
|
||||
lastModified: now,
|
||||
|
||||
Reference in New Issue
Block a user