Update all pages to use centralized status helpers

Changes:
- Update MemberOrders to use getPaymentStatusLabel and getPaymentStatusColor
- Update OrderDetail to use centralized helpers
- Remove duplicate getStatusColor and getStatusLabel functions
- Dashboard.tsx already using imported helpers

Benefits:
- DRY principle - single source of truth
- Consistent Indonesian labels everywhere
- Easy to update status styling in one place

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

src/pages/member/OrderDetail.tsx

@@ -12,6 +12,7 @@ import { Alert, AlertDescription } from "@/components/ui/alert";
 import { formatIDR, formatDate } from "@/lib/format";
 import { ArrowLeft, Package, CreditCard, Calendar, AlertCircle, Video, Clock, RefreshCw } from "lucide-react";
 import { QRCodeSVG } from "qrcode.react";
+import { getPaymentStatusLabel, getPaymentStatusColor, getProductTypeLabel } from "@/lib/statusHelpers";
 
 interface OrderItem {
   id: string;
@@ -203,35 +204,6 @@ export default function OrderDetail() {
     return () => clearInterval(timer);
   }, [order?.qr_expires_at]);
 
-  const getStatusColor = (status: string) => {
-    switch (status) {
-      case "paid":
-        return "bg-brand-accent text-white";
-      case "pending":
-        return "bg-amber-500 text-white";
-      case "cancelled":
-      case "failed":
-        return "bg-destructive text-white";
-      default:
-        return "bg-secondary";
-    }
-  };
-
-  const getStatusLabel = (status: string | null) => {
-    switch (status) {
-      case "paid":
-        return "Lunas";
-      case "pending":
-        return "Pending";
-      case "failed":
-        return "Gagal";
-      case "cancelled":
-        return "Dibatalkan";
-      default:
-        return status || "Pending";
-    }
-  };
-
   const getTypeLabel = (type: string) => {
     switch (type) {
       case "consulting":
@@ -337,8 +309,8 @@ export default function OrderDetail() {
             <h1 className="text-3xl font-bold">Detail Order</h1>
             <p className="text-muted-foreground font-mono">#{order.id.slice(0, 8)}</p>
           </div>
-          <Badge className={`${getStatusColor(order.payment_status || order.status)} rounded-full`}>
-            {getStatusLabel(order.payment_status || order.status)}
+          <Badge className={`${getPaymentStatusColor(order.payment_status || order.status)} rounded-full`}>
+            {getPaymentStatusLabel(order.payment_status || order.status)}
           </Badge>
         </div>