feat(bookings): two-level clearance charges (port + misc) billed to customer with invoices

apps/edr-freight-web/backoffice/src/pages/contracts/GlClearanceDetailPage.tsx

@@ -20,6 +20,7 @@ import {
   AlertTriangle,
   ClipboardList,
   FileText,
+  History,
   Receipt,
   Share2,
   Upload,
@@ -38,6 +39,7 @@ import { ContractClearanceReviewSection } from "@/components/contracts/ContractC
 import { ClearanceWorkflowFilesPanel } from "@/components/contracts/ClearanceWorkflowFilesPanel";
 import { GlExchangePanel } from "@/components/contracts/GlExchangePanel";
 import { ClearanceChargesTab } from "@/components/contracts/ClearanceChargesTab";
+import { ClearanceHistoryTab } from "@/components/contracts/ClearanceHistoryTab";
 import {
   GlClearanceUploadModal,
   type GlClearanceUploadKind,
@@ -254,6 +256,11 @@ export default function GlClearanceDetailPage() {
                 Customer charges
               </Tabs.Tab>
             ) : null}
+            {data.kind === "booking" ? (
+              <Tabs.Tab value="history" leftSection={<History size={14} />}>
+                History
+              </Tabs.Tab>
+            ) : null}
             {incidentBookingId ? (
               <Tabs.Tab value="incidents" leftSection={<AlertTriangle size={14} />}>
                 Incidents
@@ -382,6 +389,12 @@ export default function GlClearanceDetailPage() {
             </Tabs.Panel>
           ) : null}
 
+          {data.kind === "booking" ? (
+            <Tabs.Panel value="history">
+              <ClearanceHistoryTab bookingId={id!} />
+            </Tabs.Panel>
+          ) : null}
+
           {incidentBookingId ? (
             <Tabs.Panel value="incidents">
               <SectionCard icon={AlertTriangle} title="Incident reports" accent="edr-green">