create review and profile

features/trip/components/join-trip-button.tsx

@@ -12,6 +12,8 @@ interface JoinTripButtonProps {
   isJoined: boolean;
   isFull: boolean;
   tripStatus: string;
+  /** Tanggal berangkat sudah lewat (hari kalender UTC) */
+  isDeparturePast?: boolean;
 }
 
 export function JoinTripButton({
@@ -21,6 +23,7 @@ export function JoinTripButton({
   isJoined,
   isFull,
   tripStatus,
+  isDeparturePast,
 }: JoinTripButtonProps) {
   const router = useRouter();
   const [loading, setLoading] = useState(false);
@@ -45,6 +48,24 @@ export function JoinTripButton({
     );
   }
 
+  if (isJoined && isDeparturePast) {
+    return (
+      <div className="rounded-xl bg-neutral-100 px-3 py-3 text-center text-sm font-medium leading-relaxed text-neutral-600">
+        Kamu terdaftar di trip ini. Setelah tanggal berangkat lewat,{" "}
+        <span className="font-semibold text-neutral-700">pembatalan ditutup</span>
+        . Jika trip sudah selesai, isi ulasan di bagian bawah halaman.
+      </div>
+    );
+  }
+
+  if (isDeparturePast && !isJoined) {
+    return (
+      <div className="rounded-xl bg-neutral-100 py-3 text-center text-sm font-medium text-neutral-500">
+        Trip sudah lewat tanggal berangkat
+      </div>
+    );
+  }
+
   if (tripStatus !== "OPEN" && !isJoined) {
     return (
       <div className="rounded-xl bg-neutral-100 py-3 text-center text-sm font-medium text-neutral-500">

features/trip/components/trip-filter.tsx

@@ -90,8 +90,12 @@ export function TripFilter() {
         {/* Date range */}
         <div className="sm:w-64">
           <label className="mb-1.5 block text-xs font-medium text-neutral-500">
-            Rentang tanggal berangkat
+            Rentang tanggal (UTC)
           </label>
+          <p className="mb-1 text-[10px] leading-snug text-neutral-400 sm:text-xs">
+            Menampilkan trip yang jadwalnya overlap rentang ini: multi hari pakai
+            tanggal pulang; satu hari pakai tanggal berangkat saja.
+          </p>
           <div className="relative">
             <span className="absolute left-3 top-1/2 z-10 -translate-y-1/2 text-neutral-400">
               <svg