Compare commits

..

No commits in common. "93dfffd74eb87e6caad137c3859c76b157bf2ca9" and "0f261d6c16e686c3452085fa7b8f2f8217d05842" have entirely different histories.

8 changed files with 46 additions and 188 deletions

View file

@ -36,7 +36,7 @@ test.describe("Vendor operations", () => {
workOrderNumber: "WO-501",
triggeredAt: "2026-07-23T12:00:00Z",
scheduledAt: "2026-07-25T12:00:00Z",
action: { label: "Choose vendor", href: "/workorders/edit/501?assignVendor=1" },
action: { label: "Choose vendor", href: "/workorders/501?assignVendor=1" },
},
{
id: "vendor-conflict-801-802",
@ -75,7 +75,7 @@ test.describe("Vendor operations", () => {
await expect(page.getByRole("heading", { name: "Vendor Conflict" })).toBeVisible();
await expect(page.getByRole("link", { name: "Choose vendor" })).toHaveAttribute(
"href",
"/workorders/edit/501?assignVendor=1",
"/workorders/501?assignVendor=1",
);
await expect(page.getByRole("link", { name: "WO-501" })).toHaveAttribute(
"href",
@ -92,12 +92,11 @@ test.describe("Vendor operations", () => {
const requestedUrls: string[] = [];
await page.route("**/api/vendor-operations/insights*", async (route) => {
requestedUrls.push(route.request().url());
const { pathname } = new URL(route.request().url());
if (pathname.endsWith(".csv")) {
if (route.request().url().endsWith(".csv")) {
await route.fulfill({ status: 200, contentType: "text/csv", body: "Vendor,Completed\n" });
return;
}
if (pathname.endsWith(".pdf")) {
if (route.request().url().endsWith(".pdf")) {
await route.fulfill({ status: 200, contentType: "application/pdf", body: "%PDF-1.4" });
return;
}
@ -119,37 +118,16 @@ test.describe("Vendor operations", () => {
await page.goto("/vendors/insights");
await expect(page.getByRole("cell", { name: "Gateway Plumbing" })).toBeVisible();
await page.getByLabel("From", { exact: true }).fill("2026-01-01");
await page.getByLabel("To", { exact: true }).fill("2026-01-31");
await page.getByLabel("Trade", { exact: true }).fill("Plumbing");
const insightsQueryHas = (name: string, value: string) =>
requestedUrls.some(
(url) =>
new URL(url).pathname.endsWith("/insights") &&
new URL(url).searchParams.get(name) === value,
);
await expect.poll(() => insightsQueryHas("from", "2026-01-01")).toBe(true);
await expect.poll(() => insightsQueryHas("to", "2026-01-31")).toBe(true);
await expect.poll(() => insightsQueryHas("trade", "Plumbing")).toBe(true);
await page.getByLabel("Trade").fill("Plumbing");
await expect
.poll(() =>
requestedUrls.some((url) => new URL(url).searchParams.get("trade") === "Plumbing"),
)
.toBe(true);
await page.getByRole("button", { name: "Export CSV" }).click();
await page.getByRole("button", { name: "Export PDF" }).click();
const exportRequest = (format: "csv" | "pdf") =>
requestedUrls.find((url) => new URL(url).pathname.endsWith(`/insights.${format}`));
const exportHasFilters = (url: string | undefined) => {
if (!url) return false;
const params = new URL(url).searchParams;
return (
params.get("from") === "2026-01-01" &&
params.get("to") === "2026-01-31" &&
params.get("trade") === "Plumbing"
);
};
await expect.poll(() => exportHasFilters(exportRequest("csv"))).toBe(true);
await expect.poll(() => exportHasFilters(exportRequest("pdf"))).toBe(true);
await expect.poll(() => requestedUrls.some((url) => url.endsWith("insights.csv"))).toBe(true);
await expect.poll(() => requestedUrls.some((url) => url.endsWith("insights.pdf"))).toBe(true);
});
test("reorders and saves preferred vendors for a site", async ({ page }) => {
@ -251,17 +229,7 @@ test.describe("Vendor operations", () => {
);
await page.route("**/api/vendor-operations/work-orders/900/assignment", async (route) => {
assignment = route.request().postDataJSON();
await fulfillJson(route, {
availabilityStatus: "Available",
conflicts: [
{
workOrderId: 502,
workOrderNumber: "WO-502",
start: "2026-07-25T12:00:00Z",
end: "2026-07-25T14:00:00Z",
},
],
});
await fulfillJson(route, {});
});
await page.route("**/api/WorkOrder/GetWorkorderById*", (route) =>
fulfillJson(route, {
@ -295,48 +263,11 @@ test.describe("Vendor operations", () => {
.poll(() => assignment)
.toEqual({
vendorId: 7,
scheduledStart: "2026-07-25T09:00:00.000Z",
scheduledEnd: "2026-07-25T11:00:00.000Z",
estimatedArrivalAt: "2026-07-25T08:30:00.000Z",
scheduledStart: "2026-07-25T12:00:00.000Z",
scheduledEnd: "2026-07-25T14:00:00.000Z",
estimatedArrivalAt: "2026-07-25T11:30:00.000Z",
etaManualOverride: true,
});
await expect(page.getByText(/scheduling conflict/i)).toBeVisible();
await expect(page).toHaveURL(/\/workorders\/900$/);
});
test("focuses the Vendor & Time section when arriving from a no-vendor alert", async ({
page,
}) => {
await authenticate(page);
await page.route("**/api/Contact/GetLocations", (route) =>
fulfillJson(route, { data: [{ Id: 10, Name: "St. Louis HQ" }] }),
);
await page.route("**/api/Employee/Dropdown", (route) => fulfillJson(route, { data: [] }));
await page.route("**/api/DropdownOptions/ByCategory/**", (route) =>
fulfillJson(route, { data: [] }),
);
await page.route("**/api/vendor-operations/availability*", (route) =>
fulfillJson(route, { data: [] }),
);
await page.route("**/api/WorkOrder/GetWorkorderById*", (route) =>
fulfillJson(route, {
data: {
Id: 501,
WorkerOrderTitle: "Boiler repair",
LocationId: 10,
Priority: "Sev 1",
Status: "Open",
Comments: [],
AuditLog: [],
Dispatches: [],
},
}),
);
await page.goto("/workorders/edit/501?assignVendor=1");
const vendorSection = page.getByRole("region", { name: "Vendor & Time" });
await expect(vendorSection).toBeVisible();
await expect(vendorSection).toBeFocused();
});
});

View file

@ -10,9 +10,6 @@ export default defineConfig({
use: {
// Port 4173 isolates Playwright from the app's normal port 3000 server.
baseURL: "http://localhost:4173",
// Pin the browser timezone to UTC so date-to-ISO assertions (e.g. the fixed
// 09:00-11:00 schedule window) are deterministic regardless of host locale.
timezoneId: "UTC",
trace: "on-first-retry",
},
projects: [

View file

@ -69,13 +69,13 @@ export default function VendorInsightsPage() {
/>
<Button
variant="outlined"
onClick={() => void vendorOperationsApi.downloadInsights("csv", params)}
onClick={() => void vendorOperationsApi.downloadInsights("csv")}
>
Export CSV
</Button>
<Button
variant="outlined"
onClick={() => void vendorOperationsApi.downloadInsights("pdf", params)}
onClick={() => void vendorOperationsApi.downloadInsights("pdf")}
>
Export PDF
</Button>

View file

@ -20,31 +20,22 @@ import {
useWorkOrderVendors,
} from "@/domain/work-orders/use-cases/use-work-order-detail";
const EMPTY_PREFERENCES: SiteVendorPreference[] = [];
export default function VendorPreferencesPage() {
const queryClient = useQueryClient();
const [locationId, setLocationId] = useState<string | number>("");
const [draft, setDraft] = useState<SiteVendorPreference[]>([]);
const [isDirty, setIsDirty] = useState(false);
const [trade, setTrade] = useState("");
const [vendorId, setVendorId] = useState<number | null>(null);
const { data: locations = [] } = useWorkOrderLocations();
const { data: vendors = [] } = useWorkOrderVendors(trade || undefined);
const queryKey = ["vendor-operations", "site-preferences", locationId];
const { data: serverPreferences = EMPTY_PREFERENCES, error } = useQuery({
const { data = [], error } = useQuery({
queryKey,
queryFn: () => vendorOperationsApi.sitePreferences(locationId),
enabled: locationId !== "",
});
// A background refetch must not clobber in-flight edits, so only adopt server
// data while the draft is clean (initial load, site change, or after a save).
useEffect(() => {
if (!isDirty) {
setDraft(serverPreferences);
}
}, [isDirty, serverPreferences]);
useEffect(() => setDraft(data), [data]);
const vendorOptions = useMemo(
() =>
@ -60,13 +51,8 @@ export default function VendorPreferencesPage() {
locationId,
draft.map((item, sortOrder) => ({ vendorId: item.vendorId, trade: item.trade, sortOrder })),
),
onMutate: async () => {
await queryClient.cancelQueries({ queryKey });
},
onSuccess: (savedPreferences) => {
queryClient.setQueryData(queryKey, savedPreferences);
setDraft(savedPreferences);
setIsDirty(false);
onSuccess: () => {
void queryClient.invalidateQueries({ queryKey });
toast.success("Preferred vendors updated");
},
onError: (mutationError: Error) => toast.error(mutationError.message),
@ -80,7 +66,6 @@ export default function VendorPreferencesPage() {
[next[index], next[target]] = [next[target]!, next[index]!];
return next.map((item, sortOrder) => ({ ...item, sortOrder }));
});
setIsDirty(true);
};
const add = () => {
@ -99,18 +84,6 @@ export default function VendorPreferencesPage() {
},
]);
setVendorId(null);
setIsDirty(true);
};
const remove = (index: number) => {
setDraft((current) => current.filter((_, row) => row !== index));
setIsDirty(true);
};
const selectLocation = (nextLocationId: string | number) => {
setLocationId(nextLocationId);
setDraft(EMPTY_PREFERENCES);
setIsDirty(false);
};
return (
@ -129,7 +102,7 @@ export default function VendorPreferencesPage() {
options={locations}
getOptionLabel={(option) => option.name}
value={locations.find((location) => location.id === locationId) ?? null}
onChange={(_event, option) => selectLocation(option?.id ?? "")}
onChange={(_event, option) => setLocationId(option?.id ?? "")}
renderInput={(params) => <TextField {...params} label="Site" />}
/>
</Paper>
@ -186,7 +159,7 @@ export default function VendorPreferencesPage() {
</IconButton>
<IconButton
aria-label={`Remove ${item.vendorName}`}
onClick={() => remove(index)}
onClick={() => setDraft((current) => current.filter((_, row) => row !== index))}
>
<Trash2 size={18} />
</IconButton>

View file

@ -1,8 +1,8 @@
import { useEffect, useMemo, useRef, useState } from "react";
import { useEffect, useMemo, useState } from "react";
import { useQuery } from "@tanstack/react-query";
import { Controller, useForm, useWatch } from "react-hook-form";
import { zodResolver } from "@hookform/resolvers/zod";
import { Link as RouterLink, useNavigate, useParams, useSearchParams } from "react-router";
import { Link as RouterLink, useNavigate, useParams } from "react-router";
import {
Alert,
Autocomplete,
@ -51,16 +51,13 @@ function SectionTitle({ children }: { children: string }) {
export default function WorkOrderFormPage() {
const { id } = useParams();
const navigate = useNavigate();
const [searchParams] = useSearchParams();
const isEdit = Boolean(id);
const assignVendorRequested = searchParams.get("assignVendor") === "1";
const { data: detail, isLoading: isLoadingDetail, error: detailError } = useWorkOrderDetail(id);
const { data: locations = [], isLoading: isLoadingLocations } = useWorkOrderLocations();
const { data: employees = [] } = useWorkOrderEmployeesDropdown();
const { data: problems = [] } = useDropdownOptionsByCategory("Problem");
const saveMutation = useSaveWorkOrder();
const vendorSectionRef = useRef<HTMLDivElement>(null);
const [selectedVendorId, setSelectedVendorId] = useState<number | null>(null);
const [estimatedArrivalAt, setEstimatedArrivalAt] = useState("");
const [etaManualOverride, setEtaManualOverride] = useState(false);
@ -119,16 +116,6 @@ export default function WorkOrderFormPage() {
const isSaving = saveMutation.isPending;
const isLoading = isEdit && isLoadingDetail;
useEffect(() => {
if (assignVendorRequested && !isLoading) {
const node = vendorSectionRef.current;
if (node) {
node.scrollIntoView({ behavior: "smooth", block: "start" });
node.focus();
}
}
}, [assignVendorRequested, isLoading]);
const onSubmit = (values: WorkOrderFormSchemaValues) => {
saveMutation.mutate({
workOrderId: isEdit ? id : undefined,
@ -244,7 +231,7 @@ export default function WorkOrderFormPage() {
</Stack>
</Box>
<Box ref={vendorSectionRef} role="region" aria-label="Vendor & Time" tabIndex={-1}>
<Box>
<SectionTitle>Vendor & Time</SectionTitle>
<Stack direction={{ xs: "column", md: "row" }} spacing={2}>
<Autocomplete

View file

@ -1,7 +1,6 @@
import { api, apiGet, apiPut } from "@/api/api";
import type {
SiteVendorPreference,
VendorAssignmentResult,
VendorAvailability,
VendorAssignmentPayload,
VendorInsight,
@ -18,16 +17,8 @@ function searchParams(values: Record<string, string | number | undefined>) {
);
}
type InsightParams = {
from?: string;
to?: string;
locationId?: string | number;
trade?: string;
vendorId?: string | number;
};
async function saveDownload(path: string, fileName: string, params: InsightParams): Promise<void> {
const blob = await api.get(`${base}/${path}`, { searchParams: searchParams(params) }).blob();
async function saveDownload(path: string, fileName: string): Promise<void> {
const blob = await api.get(`${base}/${path}`).blob();
const url = URL.createObjectURL(blob);
const anchor = document.createElement("a");
anchor.href = url;
@ -57,7 +48,13 @@ export const vendorOperationsApi = {
return response.data ?? response.Data ?? [];
},
insights: async (params: InsightParams): Promise<VendorInsight[]> => {
insights: async (params: {
from?: string;
to?: string;
locationId?: string | number;
trade?: string;
vendorId?: string | number;
}): Promise<VendorInsight[]> => {
const response = await apiGet<{ data?: VendorInsight[]; Data?: VendorInsight[] }>(
`${base}/insights`,
{ searchParams: searchParams(params) },
@ -65,8 +62,8 @@ export const vendorOperationsApi = {
return response.data ?? response.Data ?? [];
},
downloadInsights: (format: "csv" | "pdf", params: InsightParams) =>
saveDownload(`insights.${format}`, `vendor-insights.${format}`, params),
downloadInsights: (format: "csv" | "pdf") =>
saveDownload(`insights.${format}`, `vendor-insights.${format}`),
sitePreferences: (locationId: string | number) =>
apiGet<SiteVendorPreference[]>(`${base}/sites/${locationId}/preferred-vendors`),
@ -77,5 +74,5 @@ export const vendorOperationsApi = {
) => apiPut<SiteVendorPreference[]>(`${base}/sites/${locationId}/preferred-vendors`, preferences),
assignVendor: (workOrderId: string | number, payload: VendorAssignmentPayload) =>
apiPut<VendorAssignmentResult>(`${base}/work-orders/${workOrderId}/assignment`, payload),
apiPut<void>(`${base}/work-orders/${workOrderId}/assignment`, payload),
};

View file

@ -67,13 +67,3 @@ export interface VendorAssignmentPayload {
estimatedArrivalAt?: string;
etaManualOverride: boolean;
}
export interface VendorAssignmentResult {
availabilityStatus: "Available" | "Unavailable" | "Unknown";
conflicts: Array<{
workOrderId: number;
workOrderNumber?: string;
start: string;
end: string;
}>;
}

View file

@ -3,10 +3,7 @@ import { useNavigate } from "react-router";
import { toast } from "react-toastify";
import { vendorOperationsApi } from "@/domain/vendor-operations/api/vendor-operations-api";
import type {
VendorAssignmentPayload,
VendorAssignmentResult,
} from "@/domain/vendor-operations/types/vendor-operations";
import type { VendorAssignmentPayload } from "@/domain/vendor-operations/types/vendor-operations";
import { workOrdersApi } from "@/domain/work-orders/api/work-orders-api";
import type { WorkOrderFormSchemaValues } from "@/domain/work-orders/schemas/work-order-schema";
import { queryKeys } from "@/infra/query-key/query-key";
@ -17,11 +14,6 @@ type SaveWorkOrderInput = {
vendorAssignment?: VendorAssignmentPayload;
};
type SaveWorkOrderResult = {
workOrderId: string | number;
assignment?: VendorAssignmentResult;
};
class PartialWorkOrderSaveError extends Error {
constructor(
public readonly workOrderId: string | number,
@ -37,37 +29,28 @@ export function useSaveWorkOrder() {
const queryClient = useQueryClient();
return useMutation({
mutationFn: async ({
workOrderId,
values,
vendorAssignment,
}: SaveWorkOrderInput): Promise<SaveWorkOrderResult> => {
mutationFn: async ({ workOrderId, values, vendorAssignment }: SaveWorkOrderInput) => {
const savedWorkOrder = workOrderId
? await workOrdersApi.update(workOrderId, values)
: await workOrdersApi.create(values);
let assignment: VendorAssignmentResult | undefined;
if (vendorAssignment) {
try {
assignment = await vendorOperationsApi.assignVendor(savedWorkOrder.id, vendorAssignment);
await vendorOperationsApi.assignVendor(savedWorkOrder.id, vendorAssignment);
} catch (error) {
throw new PartialWorkOrderSaveError(savedWorkOrder.id, error);
}
}
return { workOrderId: savedWorkOrder.id, assignment };
return savedWorkOrder;
},
onSuccess: ({ workOrderId, assignment }) => {
onSuccess: (savedWorkOrder) => {
void queryClient.invalidateQueries({ queryKey: queryKeys.workOrders.all });
void queryClient.invalidateQueries({
queryKey: queryKeys.workOrders.detail(workOrderId),
queryKey: queryKeys.workOrders.detail(savedWorkOrder.id),
});
toast.success("Work order saved successfully");
if (assignment?.conflicts.length) {
const count = assignment.conflicts.length;
toast.warning(`Vendor assigned with ${count} scheduling conflict${count > 1 ? "s" : ""}.`);
}
navigate(`/workorders/${workOrderId}`);
navigate(`/workorders/${savedWorkOrder.id}`);
},
onError: (error) => {
if (error instanceof PartialWorkOrderSaveError) {