@burdenoff/microfe-movethewheels 2026.1016.2 → 2026.1016.4

package/src/generated/wspace-types.ts

@@ -1,11 +1,5 @@
-// @ts-nocheck
 export type Maybe<T> = T | null;
 export type InputMaybe<T> = Maybe<T>;
-export type Exact<T extends { [key: string]: unknown }> = { [K in keyof T]: T[K] };
-export type MakeOptional<T, K extends keyof T> = Omit<T, K> & { [SubKey in K]?: Maybe<T[SubKey]> };
-export type MakeMaybe<T, K extends keyof T> = Omit<T, K> & { [SubKey in K]: Maybe<T[SubKey]> };
-export type MakeEmpty<T extends { [key: string]: unknown }, K extends keyof T> = { [_ in K]?: never };
-export type Incremental<T> = T | { [P in keyof T]?: P extends ' $fragmentName' | '__typename' ? T[P] : never };
 /** All built-in and custom scalars, mapped to their actual values */
 export type Scalars = {
   ID: { input: string; output: string; }
@@ -25,8 +19,8 @@ export type Scalars = {
   JSONObject: { input: Record<string, unknown>; output: Record<string, unknown>; }
   /** Upload scalar (file upload) */
   Upload: { input: File; output: File; }
-  _ScalarsPlaceholder: { input: any; output: any; }
-  _SecurityMainPlaceholder: { input: any; output: any; }
+  _ScalarsPlaceholder: { input: unknown; output: unknown; }
+  _SecurityMainPlaceholder: { input: unknown; output: unknown; }
 };
 
 export type A2AConnection = {

package/src/movethewheels/MoveTheWheelsRoot.tsx

@@ -265,6 +265,12 @@ const NavRegistrar: FC<Pick<MoveTheWheelsRootProps, 'registerNavItems' | 'basePa
           icon: <DollarSign size={16} />,
           order: 9,
           children: [
+            {
+              id: 'mtw-freight-invoice-comparisons',
+              label: tr('movethewheels.root.nav.freightInvoices', 'Freight invoice comparisons'),
+              path: joinPath(basePath, 'finance/freight-invoice-comparisons'),
+              icon: <DollarSign size={16} />,
+            },
             {
               id: 'mtw-freight-estimates',
               label: tr('movethewheels.root.nav.freightEstimates', 'Freight cost estimates'),

package/src/movethewheels/MoveTheWheelsRoutes.tsx

@@ -75,6 +75,7 @@ const RouteDetailsPage = lazy(() => import('./pages/RouteDetailsPage'));
 const AnalyticsPage = lazy(() => import('./pages/AnalyticsPage'));
 const FinancePage = lazy(() => import('./pages/FinancePage'));
 const FreightEstimatePage = lazy(() => import('./pages/FreightEstimatePage'));
+const FreightInvoicePage = lazy(() => import('./pages/FreightInvoicePage'));
 const ConsolidationPage = lazy(() => import('./pages/ConsolidationPage'));
 const LogisticsProceduresPage = lazy(() => import('./pages/LogisticsProceduresPage'));
 const MarketplacePage = lazy(() => import('./pages/MarketplacePage'));
@@ -169,6 +170,7 @@ export function MoveTheWheelsRoutes() {
         {/* Finance */}
         <Route path="finance" element={<FinancePage />} />
         <Route path="finance/freight-estimates" element={<FreightEstimatePage />} />
+        <Route path="finance/freight-invoice-comparisons" element={<FreightInvoicePage />} />
 
         {/* Marketplace */}
         <Route path="marketplace" element={<MarketplacePage />} />

package/src/movethewheels/components/ContainerEvidencePicker.tsx

@@ -1,6 +1,8 @@
 import { useState } from 'react';
 import {
   ContainerEvidenceFilesDocument,
+  InvoiceEvidenceVersionsDocument,
+  type InvoiceEvidenceVersionsQuery,
   ContainerEvidenceVersionsDocument,
   type ContainerEvidenceFilesQuery,
   type ContainerEvidenceVersionsQuery,
@@ -16,11 +18,13 @@ export interface SelectedEvidence extends MtwContainerEvidenceInput {
 export function ContainerEvidencePicker({
   value,
   onChange,
+  currentOnly = false,
   description = 'Choose exact versions from shared Files. Evidence integrity does not confirm the issuer or certify the container.',
 }: {
   value: SelectedEvidence[];
   onChange: (value: SelectedEvidence[]) => void;
   description?: string;
+  currentOnly?: boolean;
 }) {
   const [fileId, setFileId] = useState('');
   const [fileOffset, setFileOffset] = useState(0);
@@ -28,8 +32,8 @@ export function ContainerEvidencePicker({
   const files = useConditionQuery<ContainerEvidenceFilesQuery>(ContainerEvidenceFilesDocument, {
     pagination: { limit: 25, offset: fileOffset },
   });
-  const versions = useConditionQuery<ContainerEvidenceVersionsQuery>(
-    ContainerEvidenceVersionsDocument,
+  const versions = useConditionQuery<ContainerEvidenceVersionsQuery | InvoiceEvidenceVersionsQuery>(
+    currentOnly ? InvoiceEvidenceVersionsDocument : ContainerEvidenceVersionsDocument,
     fileId ? { fileId, pagination: { limit: 25, offset: versionOffset } } : null
   );
   return (
@@ -87,7 +91,9 @@ export function ContainerEvidencePicker({
       {versions.loading && <p role="status">Loading file versions…</p>}
       {versions.data?.getFileVersions.versions.map((version) => {
         const selected = value.some((item) => item.versionId === version.id);
-        const valid = /^[a-fA-F0-9]{64}$/.test(version.sha256Hash ?? '');
+        const current =
+          !currentOnly || ('isCurrentVersion' in version && version.isCurrentVersion === true);
+        const valid = current && /^[a-fA-F0-9]{64}$/.test(version.sha256Hash ?? '');
         const label = `${version.name} — version ${version.versionLabel ?? version.versionNumber}`;
         return (
           <label key={version.id} className="flex gap-2 text-sm">
@@ -104,7 +110,9 @@ export function ContainerEvidencePicker({
               }
             />
             {label}
-            {!valid && ' (integrity fingerprint unavailable)'}
+            {!current
+              ? ' (not confirmed current)'
+              : !valid && ' (integrity fingerprint unavailable)'}
           </label>
         );
       })}

package/src/movethewheels/components/FleetAlertsPanel.tsx

@@ -99,7 +99,7 @@ export function FleetAlertsPanel({
           <p className="text-sm text-text-secondary">
             {t(
               'movethewheels.fleet.alerts.allClear',
-              'All clear — every licence is valid and no vehicle is due for service.'
+              'No recorded fleet alerts. This does not certify legal driving eligibility or duty-hours availability.'
             )}
           </p>
         </CardContent>
@@ -133,7 +133,9 @@ export function FleetAlertsPanel({
                     showDot={false}
                   />
                   <span className="flex-1 min-w-0">
-                    <span className="block text-sm font-medium truncate">{alert.message}</span>
+                    <span className="block text-sm font-medium whitespace-normal break-words">
+                      {alert.message}
+                    </span>
                     {detail && <span className="block text-xs text-text-secondary">{detail}</span>}
                   </span>
                   <ChevronRight size={16} aria-hidden="true" className="shrink-0" />

package/src/movethewheels/components/freight-cost/FreightCommercialEditor.tsx

@@ -0,0 +1,236 @@
+import { useState } from 'react';
+import { OptionalFields } from '@burdenoff/fe-libs/ui';
+import {
+  FreightCommercialLegsDocument,
+  type FreightCommercialLegsQuery,
+} from '../../../generated/freight-cost-operations';
+import { useConditionQuery } from '../../hooks/useContainerCondition';
+import {
+  commercialSlots,
+  commercialCanonical,
+  newCommercialEditor,
+  type CommercialEditorState,
+} from '../../utils/freightCommercial';
+import { FreightCommercialFactEditor } from './FreightCommercialFactEditor';
+import { Button } from '../ui';
+import { ReuseState } from '../ReuseControls';
+import type { SelectedEvidence } from '../ContainerEvidencePicker';
+
+export function FreightCommercialEditor({
+  value,
+  onChange,
+  shipmentId,
+  evidence,
+}: {
+  value: CommercialEditorState | null;
+  onChange: (value: CommercialEditorState | null) => void;
+  shipmentId: string;
+  evidence: SelectedEvidence[];
+}) {
+  return (
+    <OptionalFields
+      title="Commercial context (optional)"
+      description="Source declarations only. Off by default; no quote acceptance or completeness is inferred."
+      defaultOpen={false}
+    >
+      <label className="flex min-h-11 items-center gap-2">
+        <input
+          type="checkbox"
+          checked={value !== null}
+          onChange={(event) => onChange(event.target.checked ? newCommercialEditor() : null)}
+        />
+        Include commercial context
+      </label>
+      {value && (
+        <CommercialFields
+          value={value}
+          onChange={onChange}
+          shipmentId={shipmentId}
+          evidence={evidence}
+        />
+      )}
+    </OptionalFields>
+  );
+}
+function CommercialFields({
+  value,
+  onChange,
+  shipmentId,
+  evidence,
+}: {
+  value: CommercialEditorState;
+  onChange: (value: CommercialEditorState) => void;
+  shipmentId: string;
+  evidence: SelectedEvidence[];
+}) {
+  const [revision, setRevision] = useState(0);
+  const [offset, setOffset] = useState(0);
+  const legs = useConditionQuery<FreightCommercialLegsQuery>(
+    FreightCommercialLegsDocument,
+    { shipmentId, pagination: { limit: 25, offset } },
+    revision
+  );
+  const current = legs.data?.shipment?.id === shipmentId ? legs.data.shipment.legs : undefined;
+  // Only this page is loaded. Off-page pins retain their original revisions; the server checks all selected pins.
+  const matching =
+    !!current &&
+    current.every(
+      (leg) =>
+        leg.shipmentId === shipmentId &&
+        !value.selectedLegs.some(
+          (pin) => pin.id === leg.id && pin.expectedUpdatedAt !== leg.updatedAt
+        )
+    );
+  const changePage = (next: number) => {
+    onChange({ ...value, reviewed: null });
+    setOffset(next);
+  };
+  return (
+    <div className="min-w-0 space-y-5">
+      <p className="text-sm">
+        All eight facts start Unknown: “Not recorded for this cost version”. Edit that explanation
+        when useful. Sourced and not-applicable declarations require explicit provenance; shipment
+        details are never copied into these facts.
+      </p>
+      <section className="space-y-3 rounded border p-3">
+        <h3 className="font-semibold">Review selected shipment legs</h3>
+        <p className="text-sm">
+          Select only the legs covered by this source. No selection does not mean all legs. Review
+          the loaded selection explicitly before saving.
+        </p>
+        <ReuseState loading={legs.loading} error={legs.error} />
+        {current?.map((leg) => {
+          const selected = value.selectedLegs.some((pin) => pin.id === leg.id);
+          return (
+            <label key={leg.id} className="flex min-h-11 items-center gap-2">
+              <input
+                type="checkbox"
+                checked={selected}
+                disabled={!selected && value.selectedLegs.length >= 16}
+                onChange={() =>
+                  onChange({
+                    ...value,
+                    reviewed: null,
+                    selectedLegs: selected
+                      ? value.selectedLegs.filter((pin) => pin.id !== leg.id)
+                      : [...value.selectedLegs, { id: leg.id, expectedUpdatedAt: leg.updatedAt }],
+                  })
+                }
+              />
+              <span>
+                Leg {leg.legNumber} — {leg.mode}; carrier {leg.carrierName ?? 'not recorded'};
+                updated {leg.updatedAt}
+              </span>
+            </label>
+          );
+        })}
+        {current?.length === 0 && <p>No legs on this loaded page.</p>}
+        <p className="text-sm">
+          Leg page {Math.floor(offset / 25) + 1}; at most 25 records per page. Off-page selections
+          keep their original revisions.
+        </p>
+        <div className="flex flex-wrap gap-3">
+          <Button
+            type="button"
+            variant="outline"
+            disabled={offset === 0 || legs.loading}
+            onClick={() => changePage(Math.max(0, offset - 25))}
+          >
+            Previous leg page
+          </Button>
+          <Button
+            type="button"
+            variant="outline"
+            disabled={legs.loading || !!legs.error || current?.length !== 25}
+            onClick={() => changePage(offset + 25)}
+          >
+            Next leg page
+          </Button>
+        </div>
+        {value.selectedLegs.map((pin) => (
+          <div key={pin.id} className="flex flex-wrap items-center gap-2 break-all text-sm">
+            <p>
+              Selected leg {pin.id}; pinned revision {pin.expectedUpdatedAt}.
+            </p>
+            <Button
+              type="button"
+              variant="outline"
+              onClick={() =>
+                onChange({
+                  ...value,
+                  reviewed: null,
+                  selectedLegs: value.selectedLegs.filter((row) => row.id !== pin.id),
+                })
+              }
+            >
+              Remove selected leg {pin.id}
+            </Button>
+          </div>
+        ))}
+        <p>{value.selectedLegs.length} of 16 legs selected.</p>
+        {!matching && value.selectedLegs.length > 0 && (
+          <p role="alert">
+            A selected leg on this page changed or the page does not match this shipment. Explicitly
+            remove it and review the current selection; no revision is rebound automatically.
+          </p>
+        )}
+        <div className="flex flex-wrap gap-3">
+          <Button
+            type="button"
+            variant="outline"
+            onClick={() => {
+              onChange({ ...value, reviewed: null });
+              setRevision((n) => n + 1);
+            }}
+          >
+            Refresh legs for review
+          </Button>
+          <Button
+            type="button"
+            variant="outline"
+            disabled={legs.loading || !!legs.error || !matching}
+            onClick={() =>
+              onChange({ ...value, reviewed: commercialCanonical(value.selectedLegs) })
+            }
+          >
+            I reviewed this leg selection
+          </Button>
+        </div>
+        {value.reviewed === commercialCanonical(value.selectedLegs) && matching && (
+          <p role="status">
+            This explicit selection of IDs and revisions is reviewed. The server checks every
+            selected leg on save, including off-page pins.
+          </p>
+        )}
+      </section>
+      {(
+        [
+          ['origin', 'destination'],
+          ['carrier', 'service', 'cargo'],
+          ['weight', 'volume', 'equipment'],
+        ] as const
+      ).map((group, index) => (
+        <section key={group[0]} className="space-y-3">
+          <h3 className="font-semibold">
+            {['Locations', 'Carrier, service and cargo', 'Measurements and equipment'][index]}
+          </h3>
+          <div className="grid min-w-0 gap-3 md:grid-cols-2">
+            {group.map((slot) => (
+              <FreightCommercialFactEditor
+                key={slot}
+                slot={slot}
+                value={value.facts[slot]}
+                evidence={evidence}
+                onChange={(fact) => onChange({ ...value, facts: { ...value.facts, [slot]: fact } })}
+              />
+            ))}
+          </div>
+        </section>
+      ))}
+      <p className="text-sm">
+        {commercialSlots.length} declared facts. Owner shipment and leg snapshots are recorded
+        separately by the server.
+      </p>
+    </div>
+  );
+}

package/src/movethewheels/components/freight-cost/FreightCommercialFactEditor.tsx

@@ -0,0 +1,258 @@
+import { useState } from 'react';
+import { Button } from '../ui';
+import { FreightSelect, FreightText } from './FreightFields';
+import { freightInstant, freightLocalTime } from '../../utils/freightDraft';
+import {
+  newCommercialFact,
+  type CommercialSlot,
+  type CommercialFactDraft,
+} from '../../utils/freightCommercial';
+import type { SelectedEvidence } from '../ContainerEvidencePicker';
+
+export function FreightCommercialFactEditor({
+  slot,
+  value,
+  onChange,
+  evidence,
+}: {
+  slot: CommercialSlot;
+  value: CommercialFactDraft;
+  onChange: (value: CommercialFactDraft) => void;
+  evidence: SelectedEvidence[];
+}) {
+  const [editingReason, setEditingReason] = useState(false);
+  const label = slot[0].toUpperCase() + slot.slice(1);
+  const patch = (values: Partial<CommercialFactDraft>) => onChange({ ...value, ...values });
+  return (
+    <fieldset className="min-w-0 space-y-3 rounded border p-3">
+      <legend className="px-1 font-semibold">{label}</legend>
+      <FreightSelect
+        label={`${label} status`}
+        value={value.status}
+        onChange={(status) => {
+          if (status === 'UNKNOWN' || status === 'SOURCED' || status === 'NOT_APPLICABLE') {
+            setEditingReason(false);
+            onChange(newCommercialFact(status));
+          }
+        }}
+      >
+        <option value="UNKNOWN">Unknown — not recorded</option>
+        <option value="SOURCED">Sourced</option>
+        <option value="NOT_APPLICABLE">Not applicable</option>
+      </FreightSelect>
+      {value.status === 'UNKNOWN' && !editingReason && (
+        <div className="flex flex-wrap items-center gap-2">
+          <p>{value.reason}</p>
+          <Button type="button" variant="outline" onClick={() => setEditingReason(true)}>
+            Edit {label.toLowerCase()} reason
+          </Button>
+        </div>
+      )}
+      {(value.status === 'NOT_APPLICABLE' || (value.status === 'UNKNOWN' && editingReason)) && (
+        <FreightText
+          label={`${label} reason`}
+          value={value.reason}
+          required
+          onChange={(reason) => patch({ reason })}
+        />
+      )}
+      {value.status === 'SOURCED' && (
+        <CommercialFactValue slot={slot} label={label} value={value} patch={patch} />
+      )}
+      {value.status !== 'UNKNOWN' && (
+        <CommercialFactSource label={label} value={value} patch={patch} evidence={evidence} />
+      )}
+    </fieldset>
+  );
+}
+
+interface FactFieldsProps {
+  label: string;
+  value: CommercialFactDraft;
+  patch: (values: Partial<CommercialFactDraft>) => void;
+}
+function CommercialFactValue({
+  slot,
+  label,
+  value,
+  patch,
+}: FactFieldsProps & { slot: CommercialSlot }) {
+  return (
+    <>
+      {(slot === 'origin' || slot === 'destination') && (
+        <>
+          <FreightSelect
+            label={`${label} label kind`}
+            value={value.kind}
+            onChange={(kind) => patch({ kind })}
+          >
+            <option value="">Choose a label kind</option>
+            {[
+              'ADDRESS_LABEL',
+              'PORT_LABEL',
+              'TERMINAL_LABEL',
+              'POSTCODE_LABEL',
+              'CUSTOM_LABEL',
+            ].map((kind) => (
+              <option key={kind} value={kind}>
+                {kind.replaceAll('_', ' ').toLowerCase()}
+              </option>
+            ))}
+          </FreightSelect>
+          <FreightText
+            label={`${label} jurisdiction label (optional)`}
+            value={value.jurisdiction}
+            onChange={(jurisdiction) => patch({ jurisdiction })}
+          />
+        </>
+      )}
+      {slot === 'carrier' && (
+        <FreightText
+          label="Carrier reference"
+          value={value.reference}
+          required
+          onChange={(reference) => patch({ reference })}
+        />
+      )}
+      {slot !== 'weight' && slot !== 'volume' && (
+        <FreightText
+          label={
+            slot === 'cargo'
+              ? 'Cargo classification label'
+              : slot === 'equipment'
+                ? 'Equipment type label'
+                : `${label} label`
+          }
+          value={value.label}
+          required
+          onChange={(label) => patch({ label })}
+        />
+      )}
+      {slot === 'cargo' && (
+        <FreightText
+          label="Cargo description"
+          value={value.description}
+          required
+          onChange={(description) => patch({ description })}
+        />
+      )}
+      {(slot === 'weight' || slot === 'volume') && (
+        <>
+          <FreightText
+            label={`${label} amount`}
+            value={value.amount}
+            required
+            onChange={(amount) =>
+              patch({ amount, zeroReason: amount === '0' ? value.zeroReason : '' })
+            }
+          />
+          <FreightSelect
+            label={`${label} recorded unit`}
+            value={value.unit}
+            onChange={(unit) => patch({ unit })}
+          >
+            <option value="">Choose a unit</option>
+            {(slot === 'weight' ? ['KG', 'TONNE', 'LB'] : ['M3', 'FT3']).map((unit) => (
+              <option key={unit} value={unit}>
+                {unit}
+              </option>
+            ))}
+          </FreightSelect>
+          {value.amount === '0' && (
+            <FreightText
+              label={`${label} recorded zero reason`}
+              value={value.zeroReason}
+              required
+              onChange={(zeroReason) => patch({ zeroReason })}
+            />
+          )}
+          <p className="text-sm">Record the source unit. No conversion is inferred.</p>
+        </>
+      )}
+      {slot === 'equipment' && (
+        <FreightText
+          label="Equipment count"
+          value={value.count}
+          required
+          onChange={(count) => patch({ count })}
+        />
+      )}
+    </>
+  );
+}
+function CommercialFactSource({
+  label,
+  value,
+  patch,
+  evidence,
+}: FactFieldsProps & { evidence: SelectedEvidence[] }) {
+  return (
+    <>
+      <h4 className="font-medium">{label} source declaration</h4>
+      <FreightText
+        label={`${label} source reference`}
+        value={value.sourceReference}
+        required
+        onChange={(sourceReference) => patch({ sourceReference })}
+      />
+      <FreightText
+        label={`${label} source revision`}
+        value={value.sourceRevision}
+        required
+        onChange={(sourceRevision) => patch({ sourceRevision })}
+      />
+      <FreightText
+        label={`${label} observed at (local time, optional)`}
+        type="datetime-local"
+        value={value.observedAt ? freightLocalTime(value.observedAt) : ''}
+        onChange={(time) => patch({ observedAt: time ? freightInstant(time) : '' })}
+      />
+      <p className="text-sm">
+        Blank observation time is recorded as Unknown. No date is inferred from the upload or file
+        check.
+      </p>
+      <p className="text-sm">
+        Choose 1–2 versions from the evidence selected below for this record. This declares the
+        source; it does not verify its authority.
+      </p>
+      {evidence.map((item) => {
+        const selected = value.evidenceLinks.some(
+          (link) => link.fileId === item.fileId && link.versionId === item.versionId
+        );
+        return (
+          <label
+            key={item.versionId}
+            className="flex min-h-11 items-center gap-2 break-words text-sm"
+          >
+            <input
+              type="checkbox"
+              checked={selected}
+              disabled={!selected && value.evidenceLinks.length >= 2}
+              onChange={() =>
+                patch({
+                  evidenceLinks: selected
+                    ? value.evidenceLinks.filter(
+                        (link) =>
+                          !(link.fileId === item.fileId && link.versionId === item.versionId)
+                      )
+                    : [...value.evidenceLinks, { fileId: item.fileId, versionId: item.versionId }],
+                })
+              }
+            />
+            {item.label}
+          </label>
+        );
+      })}
+      {!evidence.length && <p>Select an exact Files version in Evidence for this record.</p>}
+      {value.evidenceLinks.some(
+        (link) =>
+          !evidence.some((item) => item.fileId === link.fileId && item.versionId === link.versionId)
+      ) && (
+        <p role="alert">
+          A linked evidence version was removed. Select the fact status again and review its source
+          links before saving.
+        </p>
+      )}
+    </>
+  );
+}