@burdenoff/microfe-movethewheels 2026.930.4 → 2026.1010.1

package/src/movethewheels/components/consolidation/ConsolidationReportsWorkbench.tsx

@@ -0,0 +1,233 @@
+import { useEffect, useRef, useState } from 'react';
+import {
+  ConsolidationObservationsDocument,
+  ConsolidationObservationDocument,
+  type ConsolidationObservationQuery,
+  RecordConsolidationObservationDocument,
+  type ConsolidationObservationsQuery,
+  type ConsolidationPlanQuery,
+  type MtwConsolidationReportKind,
+  type RecordMtwConsolidationObservationInput,
+} from '../../../generated/consolidation-operations';
+import { useConditionApi, useConditionQuery } from '../../hooks/useContainerCondition';
+import type { useConsolidationAction } from '../../hooks/useConsolidationAction';
+import { ConsolidationReportForm, type ConsolidationReportPin } from './ConsolidationReportForm';
+import { ConsolidationReportHistory } from './ConsolidationHistory';
+import { ConsolidationManifestWorkbench } from './ConsolidationManifestWorkbench';
+import { ProcedureField as Field } from '../logistics-procedure/ProcedureFields';
+import { findConsolidationReportHead } from '../../utils/consolidationReportHead';
+import { assertConsolidationPredecessor } from '../../utils/consolidationPins';
+import { ReusePager, ReuseState, reuseCard, reuseSelect } from '../ReuseControls';
+import { Button } from '../ui';
+type Report = ConsolidationObservationsQuery['mtwConsolidationObservationPage']['items'][number];
+export function ConsolidationReportsWorkbench({
+  plan,
+  actions,
+}: {
+  plan: ConsolidationPlanQuery['mtwConsolidationPlan'];
+  actions: ReturnType<typeof useConsolidationAction>;
+}) {
+  const request = useConditionApi(),
+    active = useRef(true);
+  useEffect(() => {
+    active.current = true;
+    return () => {
+      active.current = false;
+    };
+  }, []);
+  const [lotId, setLot] = useState(''),
+    [kind, setKind] = useState<MtwConsolidationReportKind>('RECEIPT_REPORT'),
+    [issueReference, setIssue] = useState(''),
+    [offset, setOffset] = useState(0),
+    [selectedReport, setSelectedReport] = useState(''),
+    [checking, setChecking] = useState(false),
+    [error, setError] = useState<string | null>(null),
+    [draft, setDraft] = useState<{
+      pin: ConsolidationReportPin;
+      head: Report | null;
+      generation: string;
+    } | null>(null);
+  const history = useConditionQuery<ConsolidationObservationsQuery>(
+    ConsolidationObservationsDocument,
+    { planId: plan.id, pagination: { limit: 10, offset } },
+    actions.revision
+  );
+  const selected = useConditionQuery<ConsolidationObservationQuery>(
+    ConsolidationObservationDocument,
+    selectedReport ? { planId: plan.id, id: selectedReport } : null,
+    actions.revision
+  );
+  const labels = Object.fromEntries(
+      plan.facts.lots.map((lot) => [
+        lot.id,
+        `${lot.supplierReference} · ${lot.lotReference} · ${lot.unitReference ?? 'Unknown unit'}`,
+      ])
+    ),
+    lot = plan.facts.lots.find((row) => row.id === lotId),
+    paused = checking || actions.busy || actions.uncertain;
+  const review = async () => {
+    if (!lot || paused) return;
+    setChecking(true);
+    setError(null);
+    try {
+      const head =
+        kind === 'ISSUE' ? null : await findConsolidationReportHead(request, plan.id, lot.id, kind);
+      if (!active.current) return;
+      setDraft({
+        head,
+        generation: crypto.randomUUID(),
+        pin: {
+          planId: plan.id,
+          lotId: lot.id,
+          kind,
+          issueReference: kind === 'ISSUE' ? issueReference.trim() : null,
+          expectedPreviousVersionId: head?.id ?? null,
+          expectedVersion: head?.version ?? 0,
+          unitReference: lot.unitReference ?? null,
+          unitRevision: lot.unitRevision ?? null,
+        },
+      });
+    } catch (f) {
+      setError(f instanceof Error ? f.message : 'Unable to review history.');
+    } finally {
+      setChecking(false);
+    }
+  };
+  const save = async (input: Omit<RecordMtwConsolidationObservationInput, 'idempotencyKey'>) => {
+    if (!draft || paused) throw new Error('Review the current report chain first.');
+    setChecking(true);
+    try {
+      const head =
+        draft.pin.kind === 'ISSUE'
+          ? null
+          : await findConsolidationReportHead(request, plan.id, draft.pin.lotId, draft.pin.kind);
+      if (!active.current) throw new Error('Context changed. Nothing was sent.');
+      assertConsolidationPredecessor(draft.head, head);
+      const result = await actions.run(
+        RecordConsolidationObservationDocument,
+        { ...input },
+        'Reported observation recorded.'
+      );
+      if (result) {
+        setDraft(null);
+        setOffset(0);
+      }
+    } finally {
+      setChecking(false);
+    }
+  };
+  return (
+    <>
+      <section className={reuseCard}>
+        <h2 className="text-lg font-semibold">Record a cumulative total or issue</h2>
+        <fieldset disabled={paused} className="space-y-3">
+          <label className="block">
+            Supplier lot
+            <select
+              className={reuseSelect}
+              value={lotId}
+              onChange={(e) => {
+                setLot(e.target.value);
+                setDraft(null);
+              }}
+            >
+              <option value="">Choose a captured lot</option>
+              {plan.facts.lots.map((row) => (
+                <option key={row.id} value={row.id}>
+                  {labels[row.id]}
+                </option>
+              ))}
+            </select>
+          </label>
+          <label className="block">
+            Report kind
+            <select
+              className={reuseSelect}
+              value={kind}
+              onChange={(e) => {
+                setKind(
+                  e.target.value === 'ISSUE'
+                    ? 'ISSUE'
+                    : e.target.value === 'STUFFING_REPORT'
+                      ? 'STUFFING_REPORT'
+                      : 'RECEIPT_REPORT'
+                );
+                setDraft(null);
+              }}
+            >
+              <option value="RECEIPT_REPORT">Cumulative receipt total</option>
+              <option value="STUFFING_REPORT">Cumulative stuffing total</option>
+              <option value="ISSUE">Unresolved reported issue</option>
+            </select>
+          </label>
+          {kind === 'ISSUE' && (
+            <Field
+              label="Unique issue reference"
+              value={issueReference}
+              onChange={(value) => {
+                setIssue(value);
+                setDraft(null);
+              }}
+            />
+          )}
+          <Button
+            disabled={!lot || paused || (kind === 'ISSUE' && !issueReference.trim())}
+            onClick={() => void review()}
+          >
+            Review current total and open form
+          </Button>
+        </fieldset>
+        {draft && lot && (
+          <ConsolidationReportForm
+            key={draft.generation}
+            pin={draft.pin}
+            lot={lot}
+            busy={paused}
+            onSave={async (input) => {
+              try {
+                await save(input);
+              } catch (f) {
+                setError(f instanceof Error ? f.message : 'Unable to record report.');
+                throw f;
+              }
+            }}
+          />
+        )}{' '}
+        {error && <p role="alert">{error}</p>}
+        <ReuseState loading={history.loading} error={history.error} />
+        <div className="flex flex-wrap gap-2">
+          {history.data?.mtwConsolidationObservationPage.items.map((row) => (
+            <Button
+              key={row.id}
+              variant="outline"
+              disabled={paused}
+              onClick={() => setSelectedReport(row.id)}
+            >
+              View {labels[row.lotId]} · report {row.receiptSequence}
+            </Button>
+          ))}
+        </div>
+        <ConsolidationReportHistory
+          rows={history.data?.mtwConsolidationObservationPage.items ?? []}
+          labels={labels}
+        />
+        <ReusePager
+          offset={offset}
+          page={history.data?.mtwConsolidationObservationPage}
+          busy={paused}
+          onChange={setOffset}
+        />
+        <ReuseState loading={selected.loading} error={selected.error} />
+        {selected.data && (
+          <section aria-label="Selected exact report">
+            <ConsolidationReportHistory
+              rows={[selected.data.mtwConsolidationObservation]}
+              labels={labels}
+            />
+          </section>
+        )}
+      </section>
+      <ConsolidationManifestWorkbench plan={plan} actions={actions} labels={labels} />
+    </>
+  );
+}

package/src/movethewheels/components/consolidation/ConsolidationSummary.tsx

@@ -0,0 +1,84 @@
+import type { ConsolidationPreviewQuery } from '../../../generated/consolidation-operations';
+export function ConsolidationSummary({
+  snapshot,
+  labels,
+}: {
+  snapshot: ConsolidationPreviewQuery['previewMtwConsolidationManifest'];
+  labels: Record<string, string>;
+}) {
+  return (
+    <section className="space-y-3">
+      <h3 className="font-semibold">Reported reconciliation</h3>
+      <p>
+        Receipt sequence {snapshot.observationSequence} · {snapshot.unresolvedIssueCount} unresolved
+        reported issues
+      </p>
+      <p>
+        These comparisons do not reserve goods, confirm stuffing, establish fit or authorize customs
+        or carrier acceptance.
+      </p>
+      {snapshot.rows.map((row) => (
+        <article key={row.lotId} className="min-w-0 space-y-2 rounded-lg border p-3">
+          <h4 className="break-words font-medium">{labels[row.lotId] ?? 'Captured lot'}</h4>
+          <dl className="grid gap-2 sm:grid-cols-2">
+            {(
+              [
+                'plannedQuantity',
+                'reportedAvailableQuantity',
+                'receivedQuantity',
+                'stuffedQuantity',
+                'availabilityDeficit',
+                'receiptDeficit',
+                'receiptExcess',
+                'stuffingExcess',
+                'receivedMinusStuffed',
+              ] as const
+            ).map((key) => (
+              <div key={key}>
+                <dt>
+                  {
+                    {
+                      plannedQuantity: 'Planned',
+                      reportedAvailableQuantity: 'Reported available',
+                      receivedQuantity: 'Cumulative received report',
+                      stuffedQuantity: 'Cumulative stuffing report',
+                      availabilityDeficit: 'Availability shortfall',
+                      receiptDeficit: 'Receipt shortfall',
+                      receiptExcess: 'Receipt excess',
+                      stuffingExcess: 'Stuffing excess',
+                      receivedMinusStuffed: 'Received minus stuffed',
+                    }[key]
+                  }
+                </dt>
+                <dd>{row[key] ?? 'Unknown'}</dd>
+              </div>
+            ))}
+          </dl>
+          {row.unknownReasons.length > 0 && (
+            <p>
+              Missing facts:{' '}
+              {row.unknownReasons
+                .map((value) => value.toLowerCase().replaceAll('_', ' '))
+                .join('; ')}
+            </p>
+          )}
+          <details>
+            <summary>Exact report references</summary>
+            <p className="break-all">
+              Receipt: {row.receiptObservationId ?? 'None'}; stuffing:{' '}
+              {row.stuffingObservationId ?? 'None'}
+            </p>
+          </details>
+        </article>
+      ))}
+      {snapshot.reviewReasons.length > 0 && (
+        <p>
+          Review:{' '}
+          {snapshot.reviewReasons
+            .map((value) => value.toLowerCase().replaceAll('_', ' '))
+            .join('; ')}
+        </p>
+      )}
+    </section>
+  );
+}

package/src/movethewheels/components/consolidation/OriginalConsolidationHistory.tsx

@@ -0,0 +1,133 @@
+import { useState } from 'react';
+import {
+  ConsolidationPlansDocument,
+  ConsolidationPlanDocument,
+  ConsolidationObservationsDocument,
+  ConsolidationObservationDocument,
+  ConsolidationManifestsDocument,
+  ConsolidationManifestDocument,
+  type ConsolidationPlansQuery,
+  type ConsolidationPlanQuery,
+  type ConsolidationObservationsQuery,
+  type ConsolidationObservationQuery,
+  type ConsolidationManifestsQuery,
+  type ConsolidationManifestQuery,
+} from '../../../generated/consolidation-operations';
+import { useConditionQuery } from '../../hooks/useContainerCondition';
+import type { OriginalConsolidationHistoryTarget } from '../../utils/consolidationHistoryTarget';
+import { ReusePager, ReuseState, reuseSelect } from '../ReuseControls';
+import { Button } from '../ui';
+import {
+  ConsolidationPlanHistory,
+  ConsolidationReportHistory,
+  ConsolidationManifestHistory,
+} from './ConsolidationHistory';
+
+/** Read the retained request's history without changing its input, key or draft selections. */
+export function OriginalConsolidationHistory({
+  target,
+  revision,
+  refresh,
+}: {
+  target: OriginalConsolidationHistoryTarget;
+  revision: number;
+  refresh: () => void;
+}) {
+  const [offset, setOffset] = useState(0);
+  const [selected, setSelected] = useState('');
+  const pagination = { limit: 5, offset };
+  const plans = useConditionQuery<ConsolidationPlansQuery>(
+    ConsolidationPlansDocument,
+    target.kind === 'plan'
+      ? { shipmentId: target.shipmentId, planReference: target.planReference, pagination }
+      : null,
+    revision
+  );
+  const plan = useConditionQuery<ConsolidationPlanQuery>(
+    ConsolidationPlanDocument,
+    target.kind === 'plan' && selected ? { shipmentId: target.shipmentId, id: selected } : null,
+    revision
+  );
+  const reports = useConditionQuery<ConsolidationObservationsQuery>(
+    ConsolidationObservationsDocument,
+    target.kind === 'observation' ? { planId: target.planId, pagination } : null,
+    revision
+  );
+  const report = useConditionQuery<ConsolidationObservationQuery>(
+    ConsolidationObservationDocument,
+    target.kind === 'observation' && selected ? { planId: target.planId, id: selected } : null,
+    revision
+  );
+  const manifests = useConditionQuery<ConsolidationManifestsQuery>(
+    ConsolidationManifestsDocument,
+    target.kind === 'manifest' ? { planId: target.planId, pagination } : null,
+    revision
+  );
+  const manifest = useConditionQuery<ConsolidationManifestQuery>(
+    ConsolidationManifestDocument,
+    target.kind === 'manifest' && selected ? { planId: target.planId, id: selected } : null,
+    revision
+  );
+  const page =
+    target.kind === 'plan'
+      ? plans.data?.mtwConsolidationPlanPage
+      : target.kind === 'observation'
+        ? reports.data?.mtwConsolidationObservationPage
+        : manifests.data?.mtwConsolidationManifestPage;
+  const reads = [plans, plan, reports, report, manifests, manifest];
+  const loading = reads.some((read) => read.loading);
+  const error = reads.find((read) => read.error)?.error ?? null;
+  return (
+    <section className="min-w-0 space-y-3 rounded-lg border p-4">
+      <h2 className="font-semibold">Original request history (read only)</h2>
+      <p className="break-all">
+        {target.kind === 'plan'
+          ? `Shipment ${target.shipmentId}; plan reference ${target.planReference}`
+          : `Original plan ${target.planId}; ${target.kind} history`}
+      </p>
+      <p>
+        Reading a record does not confirm or clear the unresolved save. Compare its revisions and
+        attribution before deciding whether to retry.
+      </p>
+      <Button variant="outline" disabled={loading} onClick={refresh}>
+        Refresh original request history
+      </Button>
+      <ReuseState loading={loading} error={error}>
+        <label className="block">
+          Original request recorded version
+          <select
+            className={reuseSelect}
+            value={selected}
+            disabled={loading}
+            onChange={(event) => setSelected(event.target.value)}
+          >
+            <option value="">Choose a recorded version</option>
+            {selected && !page?.items.some((row) => row.id === selected) && (
+              <option value={selected}>Selected record (outside this page)</option>
+            )}
+            {page?.items.map((row) => (
+              <option key={row.id} value={row.id}>
+                Version {row.version} · {row.id}
+              </option>
+            ))}
+          </select>
+        </label>
+        <ReusePager page={page} offset={offset} onChange={setOffset} busy={loading} />
+        {page?.total === 0 && <p>No recorded versions found for the original request.</p>}
+        {plan.data && <ConsolidationPlanHistory plan={plan.data.mtwConsolidationPlan} />}
+        {report.data && (
+          <ConsolidationReportHistory
+            rows={[report.data.mtwConsolidationObservation]}
+            labels={{}}
+          />
+        )}
+        {manifest.data && (
+          <ConsolidationManifestHistory
+            manifest={manifest.data.mtwConsolidationManifest}
+            labels={{}}
+          />
+        )}
+      </ReuseState>
+    </section>
+  );
+}

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

@@ -0,0 +1,224 @@
+import { useRef, useState } from 'react';
+import type {
+  MtwFreightFactsInput,
+  PreviewFreightCostsQuery,
+} from '../../../generated/freight-cost-operations';
+import { ContainerEvidencePicker, type SelectedEvidence } from '../ContainerEvidencePicker';
+import { Button } from '../ui';
+import { FreightCurrency, FreightSelect, FreightText } from './FreightFields';
+import { FreightLineEditor } from './FreightLineEditor';
+import { FreightScopeEditor } from './FreightScopeEditor';
+import { FreightFxEditor } from './FreightFxEditor';
+import { FreightTotals } from './FreightTotals';
+import {
+  freightInstant,
+  freightLocalTime,
+  newFreightFacts,
+  newFreightLine,
+} from '../../utils/freightDraft';
+export function FreightDraftForm({
+  disabled,
+  onPreview,
+  onSave,
+}: {
+  disabled: boolean;
+  onPreview: (
+    facts: MtwFreightFactsInput
+  ) => Promise<PreviewFreightCostsQuery['previewMtwFreightTotal']>;
+  onSave: (facts: MtwFreightFactsInput, evidence: SelectedEvidence[]) => Promise<void>;
+}) {
+  const [facts, setFacts] = useState(newFreightFacts);
+  const [evidence, setEvidence] = useState<SelectedEvidence[]>([]);
+  const [preview, setPreview] = useState<{
+    body: string;
+    value: PreviewFreightCostsQuery['previewMtwFreightTotal'];
+  } | null>(null);
+  const [error, setError] = useState<string | null>(null);
+  const [previewing, setPreviewing] = useState(false);
+  const pendingPreview = useRef(false);
+  const body = JSON.stringify(facts);
+  const currentPreview = preview?.body === body ? preview.value : null;
+  const patch = (values: Partial<MtwFreightFactsInput>) => setFacts({ ...facts, ...values });
+  const previewNow = async () => {
+    if (pendingPreview.current) return;
+    pendingPreview.current = true;
+    setPreviewing(true);
+    setError(null);
+    const original = structuredClone(facts);
+    try {
+      const value = await onPreview(original);
+      setPreview({ body: JSON.stringify(original), value });
+    } catch (failure) {
+      setError(failure instanceof Error ? failure.message : 'Unable to preview these costs.');
+    } finally {
+      pendingPreview.current = false;
+      setPreviewing(false);
+    }
+  };
+  return (
+    <form
+      className="space-y-6"
+      onSubmit={(event) => {
+        event.preventDefault();
+        if (!currentPreview) {
+          void previewNow();
+          return;
+        }
+        setError(null);
+        void onSave(structuredClone(facts), structuredClone(evidence)).catch((failure) =>
+          setError(failure instanceof Error ? failure.message : 'Unable to save this cost record.')
+        );
+      }}
+    >
+      <fieldset disabled={disabled || previewing} className="space-y-5">
+        <legend className="text-lg font-semibold">Sourced cost draft</legend>
+        <div className="grid gap-3 md:grid-cols-2">
+          <FreightText
+            label="Estimate title"
+            value={facts.title}
+            required
+            onChange={(title) => patch({ title })}
+          />
+          <FreightSelect
+            label="Record type"
+            value={facts.kind}
+            onChange={(kind) => {
+              if (kind === 'ESTIMATE' || kind === 'QUOTE') patch({ kind });
+            }}
+          >
+            <option value="ESTIMATE">Estimate</option>
+            <option value="QUOTE">Reported quote</option>
+          </FreightSelect>
+          <FreightText
+            label="Commercial source"
+            value={facts.sourceReference}
+            required
+            onChange={(sourceReference) => patch({ sourceReference })}
+          />
+          <FreightText
+            label="Source version"
+            value={facts.sourceRevision}
+            required
+            onChange={(sourceRevision) => patch({ sourceRevision })}
+          />
+        </div>
+        <FreightText
+          label="Shipment and services covered by this source"
+          value={facts.commercialScope}
+          required
+          onChange={(commercialScope) => patch({ commercialScope })}
+        />
+        <p className="text-sm">
+          Dates use your local time zone: {Intl.DateTimeFormat().resolvedOptions().timeZone}. They
+          are recorded as exact UTC instants.
+        </p>
+        <FreightText
+          label="Price applies at"
+          type="datetime-local"
+          value={freightLocalTime(facts.pricingAt)}
+          required
+          onChange={(value) => {
+            if (value) patch({ pricingAt: freightInstant(value) });
+          }}
+        />
+        <section className="space-y-4">
+          <h3 className="font-semibold">Cost items</h3>
+          <p className="text-sm">
+            Blank amounts are unknown. Currency codes and decimal places are recorded conventions.
+          </p>
+          {facts.lines.map((line) => (
+            <FreightLineEditor
+              key={line.id}
+              line={line}
+              others={facts.lines}
+              onChange={(updated) =>
+                patch({ lines: facts.lines.map((item) => (item.id === line.id ? updated : item)) })
+              }
+              onRemove={() => patch({ lines: facts.lines.filter((item) => item.id !== line.id) })}
+            />
+          ))}
+          <Button
+            type="button"
+            variant="outline"
+            disabled={facts.lines.length >= 100}
+            onClick={() => patch({ lines: [...facts.lines, newFreightLine()] })}
+          >
+            Add cost item
+          </Button>
+        </section>
+        <details className="space-y-4 rounded border p-4">
+          <summary className="min-h-11 cursor-pointer font-medium">
+            Review cost scope, dates and conversion
+          </summary>
+          <FreightScopeEditor
+            value={facts.requirements}
+            onChange={(requirements) => patch({ requirements })}
+          />
+          <section className="space-y-3">
+            <h3 className="font-semibold">Recorded quote dates</h3>
+            {(['quotedAt', 'validFrom', 'validUntil'] as const).map((field) => (
+              <FreightText
+                key={field}
+                label={
+                  field === 'quotedAt'
+                    ? 'Quote received at'
+                    : field === 'validFrom'
+                      ? 'Quote valid from'
+                      : 'Quote valid until'
+                }
+                type="datetime-local"
+                value={facts[field] ? freightLocalTime(facts[field]) : ''}
+                onChange={(value) => patch({ [field]: value ? freightInstant(value) : null })}
+              />
+            ))}
+          </section>
+          <FreightSelect
+            label="Reporting total"
+            value={facts.reportingCurrency ? 'RECORDED' : 'UNKNOWN'}
+            onChange={(value) =>
+              patch({
+                reportingCurrency:
+                  value === 'RECORDED' ? { code: 'USD', minorUnitDigits: 2 } : null,
+              })
+            }
+          >
+            <option value="UNKNOWN">No reporting currency yet</option>
+            <option value="RECORDED">Use a recorded currency convention</option>
+          </FreightSelect>
+          {facts.reportingCurrency && (
+            <FreightCurrency
+              label="Reporting currency convention"
+              value={facts.reportingCurrency}
+              onChange={(reportingCurrency) => patch({ reportingCurrency })}
+            />
+          )}
+          <FreightFxEditor value={facts.fx} onChange={(fx) => patch({ fx })} />
+        </details>
+        <ContainerEvidencePicker
+          value={evidence}
+          onChange={setEvidence}
+          description="Choose the exact source document versions. A readable document supports this reported record; it does not accept a quote or confirm capacity."
+        />
+      </fieldset>
+      {error && <p role="alert">{error}</p>}
+      {currentPreview && (
+        <FreightTotals value={currentPreview} currency={facts.reportingCurrency} />
+      )}
+      <Button
+        type="submit"
+        disabled={
+          disabled ||
+          previewing ||
+          facts.lines.length === 0 ||
+          (!!currentPreview && evidence.length === 0)
+        }
+      >
+        {previewing
+          ? 'Previewing…'
+          : currentPreview
+            ? 'Save immutable cost version'
+            : 'Preview costs and missing facts'}
+      </Button>
+    </form>
+  );
+}