Tria/edr-platform
1
0
Fork 0
mirror of https://github.com/Tria-plc/edr-platform.git synced 2026-08-26 18:42:49 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: implement PDF regeneration for contracts and enhance document upload handling in clearance sections

Browse Source
This commit is contained in:
Marshal
2026-06-28 20:12:45 +00:00
parent 1b37914201
commit fc1adce909
5 changed files with 362 additions and 269 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
apps/edr-freight-api/src/modules/contracts/contract-transition.service.ts
View File

@@ -302,6 +302,26 @@ export class ContractTransitionService {
return { view, html, signatures: view.signatures };
}
/**
* Rebuild the stored `contract` PDF from the current aggregate (now including
* the latest signatures) so the downloaded/viewed file matches the live HTML
* view. Best-effort — a Chromium hiccup must never fail the signing
* transaction; the doc still re-renders live on /contract/view.
*/
private async regenerateContractPdf(
contractId: string,
reference: string,
): Promise<void> {
try {
const { view } = await this.documentViewModelBuilder.build(contractId);
await this.upsertContractPdf(contractId, reference, view);
} catch (err) {
this.logger.warn(
`Signed contract PDF regen deferred for ${reference}: ${err}. It re-renders live on view.`,
);
}
}
/** Render the contract PDF and upsert it as the `contract` file on the contract. */
private async upsertContractPdf(
contractId: string,
@@ -458,6 +478,7 @@ export class ContractTransitionService {
status: 'SIGNED_CUSTOMER',
customerSignedAt: new Date(),
} as never);
await this.regenerateContractPdf(contractId, contract.reference);
return this.contractsService.findById(contractId);
}
@@ -517,6 +538,7 @@ export class ContractTransitionService {
}
await this.contractsRepository.update(contractId, updates as never);
await this.regenerateContractPdf(contractId, contract.reference);
return this.contractsService.findById(contractId);
}

39
apps/edr-freight-web/backoffice/src/App.tsx
View File

@@ -35,8 +35,6 @@ import NewBookingPage from "./pages/bookings/NewBookingPage";
import ContractRequestsPage from "./pages/contracts/ContractRequestsPage";
import ContractRequestDetailPage from "./pages/contracts/ContractRequestDetailPage";
import ContractViewPage from "./pages/contracts/ContractViewPage";
import ContractClearanceListPage from "./pages/contracts/ContractClearanceListPage";
import ContractClearanceDetailPage from "./pages/contracts/ContractClearanceDetailPage";
import GlCreateBookingForm from "./components/contracts/GlCreateBookingForm";
import BookingMilestonesPage from "./pages/contracts/BookingMilestonesPage";
import CustomerDetailPage from "./pages/customers/CustomerDetailPage";
@@ -134,18 +132,6 @@ const buildSidebarSections = (demoItems: SidebarItem[]): SidebarSection[] => [
icon: <ShieldCheck />,
permission: FREIGHT_PERMS.bookings.reviewDocuments,
},
{
label: "Contract Clearance",
href: "/dashboard/contracts/clearance",
icon: <ShieldCheck />,
permission: FREIGHT_PERMS.contracts.clearanceReview,
},
{
label: "Self-Clearance Review",
href: "/dashboard/contracts/ops-clearance",
icon: <ShieldCheck />,
permission: FREIGHT_PERMS.contracts.opsClearanceReview,
},
{
label: "Train Schedules",
href: "/dashboard/operations/train-scheduling-v2",
@@ -467,34 +453,15 @@ const App = () => {
/>
<Route
path="contracts/clearance"
element={
<RequirePermission permission={FREIGHT_PERMS.contracts.clearanceReview}>
<ContractClearanceListPage />
</RequirePermission>
}
element={<Navigate to="/dashboard/clearance" replace />}
/>
<Route
path="contracts/ops-clearance"
element={
<RequirePermission
permission={FREIGHT_PERMS.contracts.opsClearanceReview}
>
<ContractClearanceListPage opsMode />
</RequirePermission>
}
element={<Navigate to="/dashboard/clearance?mode=ops" replace />}
/>
<Route
path="contracts/clearance/:id"
element={
<RequirePermission
permission={[
FREIGHT_PERMS.contracts.clearanceReview,
FREIGHT_PERMS.contracts.opsClearanceReview,
]}
>
<ContractClearanceDetailPage />
</RequirePermission>
}
element={<Navigate to="/dashboard/clearance" replace />}
/>
<Route
path="contracts/:id/create-booking"

179
apps/edr-freight-web/backoffice/src/components/bookings/detail/ClearanceReviewSection.tsx
View File

@@ -68,7 +68,7 @@ export function ClearanceReviewSection({
const qc = useQueryClient();
const [queryNotes, setQueryNotes] = useState<Record<string, string>>({});
const [openQuery, setOpenQuery] = useState<Record<string, boolean>>({});
const [outputFiles, setOutputFiles] = useState<Record<string, File>>({});
const [uploadingKey, setUploadingKey] = useState<string | null>(null);
const { view, viewer } = useFileViewer();
const { data: clearance, isLoading } = useQuery({
@@ -100,13 +100,17 @@ export function ClearanceReviewSection({
});
const outputMutation = useMutation({
mutationFn: () => bookingsService.uploadClearanceOutput(bookingId, outputFiles),
mutationFn: (files: Record<string, File>) =>
bookingsService.uploadClearanceOutput(bookingId, files),
onSuccess: () => {
toast.success("Output documents uploaded");
setOutputFiles({});
toast.success("Document uploaded");
setUploadingKey(null);
refresh();
},
onError: () => toast.error("Upload failed"),
onError: () => {
toast.error("Upload failed");
setUploadingKey(null);
},
});
const finalizeMutation = useMutation({
@@ -223,99 +227,100 @@ export function ClearanceReviewSection({
<SectionCard
icon={Upload}
title="Customs output documents"
subtitle="Upload the cleared/customs paperwork to hand back to the customer."
subtitle="Upload each document individually — changes save immediately."
accent="edr-green"
>
<Stack gap={10}>
{glDocs.map((doc) => (
<Group key={doc.fileKey} justify="space-between" wrap="nowrap">
<Group gap={8} wrap="nowrap" style={{ minWidth: 0 }}>
<FileText size={16} color="var(--mantine-color-edr-green-6)" />
<Text fz="13px" c="edr-text" truncate>
{doc.label}
{doc.required ? " *" : ""}
</Text>
</Group>
<Group gap={8} wrap="nowrap">
{doc.file ? (
<>
{isViewable({
name: doc.file.name,
url: fileViewUrl(doc.file.id),
}) && (
<Tooltip label="View">
{glDocs.map((doc) => {
const isUploading =
uploadingKey === doc.fileKey && outputMutation.isPending;
return (
<Group key={doc.fileKey} justify="space-between" wrap="nowrap">
<Group gap={8} wrap="nowrap" style={{ minWidth: 0 }}>
<FileText size={16} color="var(--mantine-color-edr-green-6)" />
<Text fz="13px" c="edr-text" truncate>
{doc.label}
{doc.required ? " *" : ""}
</Text>
</Group>
<Group gap={8} wrap="nowrap">
{doc.file ? (
<>
{isViewable({
name: doc.file.name,
url: fileViewUrl(doc.file.id),
}) && (
<Tooltip label="View">
<Box
component="button"
type="button"
onClick={() =>
view({
name: doc.file!.name,
url: fileViewUrl(doc.file!.id),
})
}
c="edr-green"
style={{
display: "flex",
background: "transparent",
border: "none",
cursor: "pointer",
}}
>
<Eye size={15} />
</Box>
</Tooltip>
)}
<Tooltip label="Download">
<Box
component="button"
type="button"
onClick={() =>
view({
name: doc.file!.name,
url: fileViewUrl(doc.file!.id),
})
}
component="a"
href={fileViewUrl(doc.file.id, true)}
c="edr-green"
style={{
display: "flex",
background: "transparent",
border: "none",
cursor: "pointer",
}}
style={{ display: "flex" }}
>
<Eye size={15} />
<Download size={15} />
</Box>
</Tooltip>
)}
<Tooltip label="Download">
<Box
component="a"
href={fileViewUrl(doc.file.id, true)}
c="edr-green"
style={{ display: "flex" }}
>
<Download size={15} />
</Box>
</Tooltip>
</>
) : (
<Text fz="12px" c="edr-muted">
Not uploaded
</Text>
)}
<FileButton
onChange={(f) =>
f && setOutputFiles((o) => ({ ...o, [doc.fileKey]: f }))
}
accept="application/pdf,image/*"
>
{(props) => (
<Button
{...props}
size="compact-xs"
variant="light"
color="edr-green"
leftSection={<Upload size={13} />}
>
{outputFiles[doc.fileKey] ? "Selected" : "Upload"}
</Button>
</>
) : (
<Text fz="12px" c="edr-muted">
Not uploaded
</Text>
)}
</FileButton>
<FileButton
onChange={(f) => {
if (!f) return;
setUploadingKey(doc.fileKey);
outputMutation.mutate({ [doc.fileKey]: f });
}}
accept="application/pdf,image/*"
disabled={isUploading}
>
{(props) => (
<Button
{...props}
size="compact-xs"
variant="light"
color="edr-green"
leftSection={
isUploading ? (
<Loader size={12} color="edr-green" />
) : (
<Upload size={13} />
)
}
loading={isUploading}
>
{doc.file ? "Replace" : "Upload"}
</Button>
)}
</FileButton>
</Group>
</Group>
</Group>
))}
);
})}
</Stack>
<Group justify="flex-end" mt="md">
<Button
variant="light"
color="edr-green"
radius="md"
leftSection={<Upload size={15} />}
disabled={Object.keys(outputFiles).length === 0}
loading={outputMutation.isPending}
onClick={() => outputMutation.mutate()}
>
Upload output documents
</Button>
</Group>
</SectionCard>
)}

186
apps/edr-freight-web/backoffice/src/components/contracts/ContractClearanceReviewSection.tsx
View File

@@ -92,7 +92,7 @@ export function ContractClearanceReviewSection({
}: ContractClearanceReviewSectionProps) {
const [queryNotes, setQueryNotes] = useState<Record<string, string>>({});
const [openQuery, setOpenQuery] = useState<Record<string, boolean>>({});
const [outputFiles, setOutputFiles] = useState<Record<string, File>>({});
const [uploadingKey, setUploadingKey] = useState<string | null>(null);
const { view, viewer } = useFileViewer();
const reviewerTeam = selfClear ? "Operations" : "Global Logistics";
@@ -242,110 +242,106 @@ export function ContractClearanceReviewSection({
<SectionCard
icon={Upload}
title="GL output documents"
subtitle="Upload IM4/IM5/EX3/EX8/T1 and other cleared paperwork."
subtitle="Upload each document individually — changes save immediately."
accent="edr-green"
>
<Stack gap={10}>
{glDocs.map((doc) => (
<Group key={doc.fileKey} justify="space-between" wrap="nowrap">
<Group gap={8} wrap="nowrap" style={{ minWidth: 0 }}>
<FileText size={16} color="var(--mantine-color-edr-green-6)" />
<Text fz="13px" c="edr-text" truncate>
{doc.label}
{doc.required ? " *" : ""}
</Text>
</Group>
<Group gap={8} wrap="nowrap">
{doc.file ? (
<>
{isViewable({
name: doc.file.name,
url: fileViewUrl(doc.file.id),
}) && (
<Tooltip label="View">
{glDocs.map((doc) => {
const isUploading =
uploadingKey === doc.fileKey && uploadOutputDocuments.isPending;
return (
<Group key={doc.fileKey} justify="space-between" wrap="nowrap">
<Group gap={8} wrap="nowrap" style={{ minWidth: 0 }}>
<FileText size={16} color="var(--mantine-color-edr-green-6)" />
<Text fz="13px" c="edr-text" truncate>
{doc.label}
{doc.required ? " *" : ""}
</Text>
</Group>
<Group gap={8} wrap="nowrap">
{doc.file ? (
<>
{isViewable({
name: doc.file.name,
url: fileViewUrl(doc.file.id),
}) && (
<Tooltip label="View">
<Box
component="button"
type="button"
onClick={() =>
view({
name: doc.file!.name,
url: fileViewUrl(doc.file!.id),
})
}
c="edr-green"
style={{
display: "flex",
background: "transparent",
border: "none",
cursor: "pointer",
}}
>
<Eye size={15} />
</Box>
</Tooltip>
)}
<Tooltip label="Download">
<Box
component="button"
type="button"
onClick={() =>
view({
name: doc.file!.name,
url: fileViewUrl(doc.file!.id),
})
}
component="a"
href={fileViewUrl(doc.file.id, true)}
c="edr-green"
style={{
display: "flex",
background: "transparent",
border: "none",
cursor: "pointer",
}}
style={{ display: "flex" }}
>
<Eye size={15} />
<Download size={15} />
</Box>
</Tooltip>
)}
<Tooltip label="Download">
<Box
component="a"
href={fileViewUrl(doc.file.id, true)}
c="edr-green"
style={{ display: "flex" }}
>
<Download size={15} />
</Box>
</Tooltip>
</>
) : (
<Text fz="12px" c="edr-muted">
Not uploaded
</Text>
)}
{!readOnly && (
<FileButton
onChange={(f) =>
f && setOutputFiles((o) => ({ ...o, [doc.fileKey]: f }))
}
accept="application/pdf,image/*"
>
{(props) => (
<Button
{...props}
size="compact-xs"
variant="light"
color="edr-green"
leftSection={<Upload size={13} />}
>
{outputFiles[doc.fileKey] ? "Selected" : "Upload"}
</Button>
)}
</FileButton>
)}
</>
) : (
<Text fz="12px" c="edr-muted">
Not uploaded
</Text>
)}
{!readOnly && (
<FileButton
onChange={(f) => {
if (!f) return;
setUploadingKey(doc.fileKey);
uploadOutputDocuments.mutate(
{ [doc.fileKey]: f },
{ onSuccess: () => { setUploadingKey(null); onChanged?.(); },
onError: () => setUploadingKey(null) },
);
}}
accept="application/pdf,image/*"
disabled={isUploading}
>
{(props) => (
<Button
{...props}
size="compact-xs"
variant="light"
color="edr-green"
leftSection={
isUploading ? (
<Loader size={12} color="edr-green" />
) : (
<Upload size={13} />
)
}
loading={isUploading}
>
{doc.file ? "Replace" : "Upload"}
</Button>
)}
</FileButton>
)}
</Group>
</Group>
</Group>
))}
);
})}
</Stack>
{!readOnly && (
<Group justify="flex-end" mt="md">
<Button
variant="light"
color="edr-green"
radius="md"
leftSection={<Upload size={15} />}
disabled={Object.keys(outputFiles).length === 0}
loading={uploadOutputDocuments.isPending}
onClick={() =>
uploadOutputDocuments.mutate(outputFiles, {
onSuccess: () => {
setOutputFiles({});
onChanged?.();
},
})
}
>
Upload output documents
</Button>
</Group>
)}
</SectionCard>
)}

205
apps/edr-freight-web/backoffice/src/pages/bookings/DocumentClearanceListPage.tsx
View File

@@ -1,6 +1,6 @@
import { useCallback, useMemo, useState } from "react";
import { useQuery } from "@tanstack/react-query";
import { useNavigate } from "react-router-dom";
import { useNavigate, useSearchParams } from "react-router-dom";
import {
ActionIcon,
Badge,
@@ -20,7 +20,9 @@ import {
import {
ArrowRight,
Calendar,
CheckCircle,
ChevronRight,
History,
Inbox,
LayoutGrid,
RefreshCw,
@@ -46,12 +48,16 @@ import { bookingTable } from "@/components/bookings/booking-ui.styles";
import { bookingsService } from "@/services/bookings.service";
import type { BookingDetail } from "@/types/booking";
import {
CLEARANCE_REVIEW_STATUS,
CLEARANCE_TABS,
type ClearanceTabKey,
} from "@/features/clearance/clearance-tabs.config";
type ViewMode = "table" | "cards";
type PageTab = "queue" | "history";
type ClearanceMode = "gl" | "ops";
const CLEARANCE_REVIEW_STATUS = "DOCUMENTS_UNDER_REVIEW";
const CLEARANCE_HISTORY_STATUS = "CLEARANCE_READY";
interface ClearanceRow {
id: string;
@@ -62,6 +68,7 @@ interface ClearanceRow {
originLabel: string;
destinationLabel: string;
scheduledDate: string;
updatedAt: string;
hasCustoms: boolean;
}
@@ -85,6 +92,7 @@ function toClearanceRow(booking: BookingDetail): ClearanceRow {
originLabel: labelFromRef(booking.originYard),
destinationLabel: labelFromRef(booking.destinationYard),
scheduledDate: booking.scheduledDate,
updatedAt: booking.updatedAt ?? "",
hasCustoms: Boolean(
booking.customsClearingEnabled ?? booking.serviceType?.includesCustoms,
),
@@ -102,12 +110,6 @@ function formatDate(iso?: string): string {
});
}
/**
* Icon-only chip for a booking's trade direction — Truck for import, ShipWheel
* for export — on a light background, matching the "awaiting review" badge
* styling. Keeps the cards within the white / light-gray / green palette and
* drops the text label in favour of a tooltip.
*/
function DirectionIcon({ direction }: { direction: string }) {
const isImport = direction === "IMPORT";
const Icon = isImport ? Truck : ShipWheel;
@@ -129,33 +131,55 @@ function DirectionIcon({ direction }: { direction: string }) {
export default function DocumentClearanceListPage() {
const navigate = useNavigate();
const [searchParams, setSearchParams] = useSearchParams();
// "mode=ops" query param lets the old ops-clearance redirect land on the right tab
const initialMode: ClearanceMode =
searchParams.get("mode") === "ops" ? "ops" : "gl";
const [clearanceMode, setClearanceMode] = useState<ClearanceMode>(initialMode);
const [pageTab, setPageTab] = useState<PageTab>("queue");
const [activeTab, setActiveTab] = useState<ClearanceTabKey>("all");
const [query, setQuery] = useState("");
const [view, setView] = useState<ViewMode>("table");
const { pagination, setPagination } = usePagination({ pageSize: 10 });
const isHistory = pageTab === "history";
const { data, isLoading, isError, isFetching, refetch } = useQuery({
queryKey: ["clearance", "list"],
queryKey: ["clearance", "list", clearanceMode, isHistory],
queryFn: () =>
bookingsService.list({ status: CLEARANCE_REVIEW_STATUS, pageSize: 200 }),
bookingsService.list({
status: isHistory ? CLEARANCE_HISTORY_STATUS : CLEARANCE_REVIEW_STATUS,
pageSize: 200,
}),
});
// GL clears customs bookings only; non-customs clearance is reviewed by
// Marketing on the booking detail. Scope the queue defensively so a staff or
// marketing user opening this page still sees the customs queue.
const allRows = useMemo(
() => (data?.items ?? []).map(toClearanceRow).filter((r) => r.hasCustoms),
[data?.items],
);
const allRows = useMemo(() => {
const rows = (data?.items ?? []).map(toClearanceRow);
const filtered =
clearanceMode === "gl"
? rows.filter((r) => r.hasCustoms)
: rows.filter((r) => !r.hasCustoms);
// Per-tab counts drive the badge on each tab.
const tabCounts = useMemo(() => {
return {
if (isHistory) {
// Latest cleared first — fall back to updatedAt
return [...filtered].sort((a, b) => {
const ta = new Date(a.updatedAt || 0).getTime();
const tb = new Date(b.updatedAt || 0).getTime();
return tb - ta;
});
}
return filtered;
}, [data?.items, clearanceMode, isHistory]);
const tabCounts = useMemo(
() => ({
all: allRows.length,
import: allRows.filter((r) => r.tradeDirection === "IMPORT").length,
export: allRows.filter((r) => r.tradeDirection === "EXPORT").length,
} satisfies Record<ClearanceTabKey, number>;
}, [allRows]);
}),
[allRows],
);
const rows = useMemo(() => {
const q = query.trim().toLowerCase();
@@ -185,6 +209,35 @@ export default function DocumentClearanceListPage() {
[navigate],
);
const handleModeChange = (mode: ClearanceMode) => {
setClearanceMode(mode);
setPageTab("queue");
setActiveTab("all");
setPagination({ pageIndex: 0, pageSize: pagination.pageSize });
// clear the ?mode= param after first use
setSearchParams({});
};
const statusBadge = isHistory ? (
<Badge
variant="light"
color="edr-green"
radius="sm"
leftSection={<CheckCircle size={13} />}
>
{tabCounts.all} cleared
</Badge>
) : (
<Badge
variant="light"
color="edr-green"
radius="sm"
leftSection={<ShieldCheck size={13} />}
>
{tabCounts.all} awaiting review
</Badge>
);
const columns: ColumnDef<ClearanceRow>[] = useMemo(
() => [
{
@@ -249,11 +302,16 @@ export default function DocumentClearanceListPage() {
{
id: "status",
header: () => <span className={bookingTable.headerCell}>Status</span>,
cell: () => (
<Badge size="sm" variant="light" color="edr-green" radius="sm">
Under review
</Badge>
),
cell: ({ row }) =>
isHistory ? (
<Badge size="sm" variant="light" color="edr-green" radius="sm">
Cleared
</Badge>
) : (
<Badge size="sm" variant="light" color="yellow" radius="sm">
Under review
</Badge>
),
},
{
id: "go",
@@ -265,7 +323,7 @@ export default function DocumentClearanceListPage() {
),
},
],
[],
[isHistory],
);
return (
@@ -274,16 +332,7 @@ export default function DocumentClearanceListPage() {
<PageHeader
title="Document Clearance"
subtitle="Review customer documents, raise queries, and finalize clearance for each booking."
meta={
<Badge
variant="light"
color="edr-green"
radius="sm"
leftSection={<ShieldCheck size={13} />}
>
{tabCounts.all} awaiting review
</Badge>
}
meta={statusBadge}
action={
<ActionIcon
variant="default"
@@ -298,13 +347,56 @@ export default function DocumentClearanceListPage() {
}
/>
{/* Mode toggle: GL Customs vs Self-Clearance (Operations) */}
<Group>
<SegmentedControl
value={clearanceMode}
onChange={(v) => handleModeChange(v as ClearanceMode)}
data={[
{ value: "gl", label: "GL Clearance" },
{ value: "ops", label: "Self-Clearance" },
]}
radius="md"
color="edr-green"
/>
<SegmentedControl
value={pageTab}
onChange={(v) => {
setPageTab(v as PageTab);
setActiveTab("all");
setPagination({ pageIndex: 0, pageSize: pagination.pageSize });
}}
data={[
{
value: "queue",
label: (
<Group gap={6} wrap="nowrap">
<Inbox size={14} />
<span>Queue</span>
</Group>
),
},
{
value: "history",
label: (
<Group gap={6} wrap="nowrap">
<History size={14} />
<span>History</span>
</Group>
),
},
]}
radius="md"
/>
</Group>
<KpiStrip
loading={isLoading}
items={[
{
label: "Awaiting review",
label: isHistory ? "Cleared" : "Awaiting review",
value: tabCounts.all,
icon: Inbox,
icon: isHistory ? CheckCircle : Inbox,
color: "edr-green",
},
{
@@ -370,10 +462,7 @@ export default function DocumentClearanceListPage() {
value={query}
onChange={(e) => {
setQuery(e.currentTarget.value);
setPagination({
pageIndex: 0,
pageSize: pagination.pageSize,
});
setPagination({ pageIndex: 0, pageSize: pagination.pageSize });
}}
rightSection={
query ? (
@@ -430,9 +519,7 @@ export default function DocumentClearanceListPage() {
<DataTable<ClearanceRow, unknown>
columns={columns}
data={pagedRows}
status={
isLoading ? "loading" : isError ? "error" : "success"
}
status={isLoading ? "loading" : isError ? "error" : "success"}
onRowClick={(row) => openDetail(row.id)}
pagination={{
pageIndex: pagination.pageIndex,
@@ -454,6 +541,7 @@ export default function DocumentClearanceListPage() {
<ClearanceCardGrid
rows={pagedRows}
loading={isLoading}
isHistory={isHistory}
onOpen={openDetail}
/>
)}
@@ -467,10 +555,12 @@ export default function DocumentClearanceListPage() {
function ClearanceCardGrid({
rows,
loading,
isHistory,
onOpen,
}: {
rows: ClearanceRow[];
loading: boolean;
isHistory: boolean;
onOpen: (id: string) => void;
}) {
if (loading) {
@@ -495,7 +585,12 @@ function ClearanceCardGrid({
return (
<SimpleGrid cols={{ base: 1, sm: 2, xl: 3 }} spacing="md" p="md">
{rows.map((r) => (
<ClearanceCard key={r.id} row={r} onOpen={() => onOpen(r.id)} />
<ClearanceCard
key={r.id}
row={r}
isHistory={isHistory}
onOpen={() => onOpen(r.id)}
/>
))}
</SimpleGrid>
);
@@ -503,9 +598,11 @@ function ClearanceCardGrid({
function ClearanceCard({
row,
isHistory,
onOpen,
}: {
row: ClearanceRow;
isHistory: boolean;
onOpen: () => void;
}) {
return (
@@ -543,9 +640,15 @@ function ClearanceCard({
</Group>
</Box>
</Group>
<Badge size="sm" variant="light" color="edr-green" radius="sm">
Under review
</Badge>
{isHistory ? (
<Badge size="sm" variant="light" color="edr-green" radius="sm">
Cleared
</Badge>
) : (
<Badge size="sm" variant="light" color="yellow" radius="sm">
Under review
</Badge>
)}
</Group>
<Box