feat: implement public order details page with submission view, order actions, and sidebar branding updates

src/app/(app)/my-orders/[id]/page.tsx

@@ -1,7 +1,7 @@
 'use client'
 
 import { useEffect, useState } from 'react'
-import { useParams, useRouter } from 'next/navigation'
+import { useParams, useRouter, notFound } from 'next/navigation'
 import { getOrderDetail, updateSubmissionPayment, updateOrderStatus, updateOrder, deleteOrder, getSessionUser, getBalancesAsCreator } from '@/app/actions'
 import { Card, CardContent } from '@/components/ui/card'
 import { Button, buttonVariants } from '@/components/ui/button'
@@ -23,12 +23,14 @@ import {
   ToggleLeft,
   AlertCircle,
   Pencil,
+  Sparkles,
   ShoppingBag,
   PlusCircle,
   MinusCircle,
   Trash2,
   AlertTriangle
 } from 'lucide-react'
+import { ShareButton } from '@/components/ShareButton'
 import Link from 'next/link'
 
 export default function OrderDetailPage() {
@@ -104,17 +106,7 @@ export default function OrderDetailPage() {
   }
 
   if (!order) {
-    return (
-      <div className="text-center p-12 bg-white dark:bg-slate-900 rounded-3xl border border-slate-200 dark:border-slate-800">
-        <p className="text-slate-500 font-medium">Order tidak ditemukan.</p>
-        <Link 
-          href="/my-orders" 
-          className={cn(buttonVariants(), "mt-4 bg-[#1B2CC1] hover:bg-[#15229E] text-white font-bold rounded-xl")}
-        >
-          Kembali ke Jasa Order
-        </Link>
-      </div>
-    )
+    notFound()
   }
 
   const isCreator = userId === order.creator_id
@@ -254,6 +246,11 @@ export default function OrderDetailPage() {
               <span className="text-xs text-slate-400 font-medium">
                 {format(new Date(order.date), 'dd MMM yyyy')}
               </span>
+              {order.allow_custom && (
+                <div className="inline-flex items-center gap-1 text-[10px] font-semibold text-[#1B2CC1] bg-blue-50 dark:bg-blue-950/40 px-2 py-0.5 rounded-md">
+                  <Sparkles className="w-3 h-3" /> Custom Item Aktif
+                </div>
+              )}
             </div>
             <h1 className="text-xl sm:text-2xl font-black text-slate-900 dark:text-white tracking-tight leading-tight">
               {order.title}
@@ -306,6 +303,14 @@ export default function OrderDetailPage() {
                 </Button>
               )}
 
+              {order.status === 'OPEN' && (
+                <ShareButton 
+                  orderId={order.id}
+                  className="h-8.5 text-xs font-bold rounded-xl border-slate-200 dark:border-slate-700 text-slate-700 dark:text-slate-300 gap-1.5"
+                  showText={true}
+                />
+              )}
+
               {/* Status Change Buttons */}
               {order.status === 'DRAFT' && isToday(new Date(order.date)) && (
                 <Button