[Frontend] Build Shipment Detail Page with Role-Based Action Buttons

[mftee]

Description:
Build the shipment detail page showing all shipment information, parties, and a sidebar status timeline. The page renders context-aware action buttons based on the user's role and the current shipment status.

Create frontend/app/(dashboard)/shipments/[id]/page.tsx.

Acceptance Criteria:

• 'use client' directive; uses useParams<{ id: string }>()
• Loads shipment and history in parallel: Promise.all([shipmentApi.getById(id), shipmentApi.getHistory(id)])
• Shows loading skeleton while fetching; shows "not found" state with back button if null
• Layout: 3-column grid (left 2 cols: details + actions; right 1 col: timeline) on lg+
• Details cards: Cargo (description, weight, volume, price), Parties (shipper name, carrier name or "—")
• Action buttons (in their own <Card>):
  • PENDING + not shipper → "Accept Job" button (carrier)
  • ACCEPTED + assigned carrier → "Mark Picked Up" button
  • IN_TRANSIT + assigned carrier → "Mark Delivered" button
  • DELIVERED + shipper → "Confirm Delivery" button
  • PENDING or ACCEPTED + (shipper or carrier or admin) → "Cancel" outline button
  • IN_TRANSIT or DELIVERED + (shipper or carrier) → "Raise Dispute" destructive button
  • DISPUTED + admin → "Resolve: Complete" and "Resolve: Cancel" buttons
  • COMPLETED or CANCELLED → "No further actions" message
• All actions: call API, toast.success/error, then re-fetch (reload())
• Action buttons disabled while actionLoading is true
• <StatusTimeline history={history} /> in the right column