auth, trips and join trips

2026-04-16 14:51:54 +07:00
parent de0d1c5413
commit 237caad488
49 changed files with 11343 additions and 334 deletions
@@ -0,0 +1,66 @@
+import Link from "next/link";
+import { tripService } from "@/server/services/trip.service";
+import { TripCard } from "@/features/trip/components/trip-card";
+
+export default async function TripsPage() {
+  const trips = await tripService.getOpenTrips();
+
+  return (
+    <div className="mx-auto max-w-6xl px-4 py-8">
+      <div className="mb-8 flex items-center justify-between">
+        <div>
+          <h1 className="text-2xl font-bold text-neutral-800">
+            Open Trip Pendakian
+          </h1>
+          <p className="mt-1 text-sm text-neutral-500">
+            {trips.length} trip tersedia — pilih dan langsung join
+          </p>
+        </div>
+        <Link
+          href="/create-trip"
+          className="rounded-xl bg-primary-600 px-4 py-2 text-sm font-semibold text-white shadow-md shadow-primary-600/20 hover:bg-primary-700"
+        >
+          + Buat Trip
+        </Link>
+      </div>
+
+      {trips.length === 0 ? (
+        <div className="rounded-2xl border-2 border-dashed border-neutral-200 bg-white p-14 text-center">
+          <div className="mx-auto mb-4 flex h-16 w-16 items-center justify-center rounded-full bg-primary-50 text-3xl">
+            🏕️
+          </div>
+          <p className="mb-1 text-lg font-bold text-neutral-800">
+            Belum ada trip tersedia
+          </p>
+          <p className="mb-6 text-sm text-neutral-500">
+            Jadilah yang pertama membuat open trip pendakian!
+          </p>
+          <Link
+            href="/create-trip"
+            className="inline-block rounded-xl bg-primary-600 px-6 py-2.5 text-sm font-semibold text-white shadow-lg shadow-primary-600/25 hover:bg-primary-700"
+          >
+            Buat Trip Baru
+          </Link>
+        </div>
+      ) : (
+        <div className="grid gap-4 sm:grid-cols-2 lg:grid-cols-3">
+          {trips.map((trip) => (
+            <TripCard
+              key={trip.id}
+              id={trip.id}
+              title={trip.title}
+              mountain={trip.mountain}
+              location={trip.location}
+              date={trip.date}
+              price={trip.price}
+              maxParticipants={trip.maxParticipants}
+              participantCount={trip._count.participants}
+              organizerName={trip.organizer.name}
+              status={trip.status}
+            />
+          ))}
+        </div>
+      )}
+    </div>
+  );
+}