admin/bodyshop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feature/IO-3587-Commision-Cut - Additional Testing / Test Harness improvements

Browse Source
This commit is contained in:
Dave
2026-03-18 16:50:57 -04:00
parent 782fa8a1c7
commit 3f03157834
13 changed files with 2227 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
client/src/components/shop-teams/shop-employee-teams.form.component.jsx
View File

@@ -36,14 +36,20 @@ import {
} from "../../graphql/employee_teams.queries";
import EmployeeSearchSelectComponent from "../employee-search-select/employee-search-select.component";
import { useNotification } from "../../contexts/Notifications/notificationContext.jsx";
import {
LABOR_TYPES,
getSplitTotal,
hasExactSplitTotal,
normalizeEmployeeTeam,
normalizeTeamMember,
validateEmployeeTeamMembers
} from "./shop-employee-teams.form.utils.js";
const mapStateToProps = createStructuredSelector({
bodyshop: selectBodyshop
});
const mapDispatchToProps = () => ({});
const LABOR_TYPES = ["LAA", "LAB", "LAD", "LAE", "LAF", "LAG", "LAM", "LAR", "LAS", "LAU", "LA1", "LA2", "LA3", "LA4"];
const PAYOUT_METHOD_OPTIONS = [
{ labelKey: "employee_teams.options.hourly", value: "hourly" },
{ labelKey: "employee_teams.options.commission_percentage", value: "commission" }
@@ -57,23 +63,6 @@ const TEAM_MEMBER_PRIMARY_FIELD_COLS = {
const TEAM_MEMBER_RATE_FIELD_COLS = { xs: 24, sm: 12, md: 8, lg: 6, xxl: 4 };
const normalizeTeamMember = (teamMember = {}) => ({
...teamMember,
payout_method: teamMember.payout_method || "hourly",
labor_rates: teamMember.labor_rates || {},
commission_rates: teamMember.commission_rates || {}
});
const normalizeEmployeeTeam = (employeeTeam = {}) => ({
...employeeTeam,
employee_team_members: (employeeTeam.employee_team_members || []).map(normalizeTeamMember)
});
const getSplitTotal = (teamMembers = []) =>
teamMembers.reduce((sum, member) => sum + Number(member?.percentage || 0), 0);
const hasExactSplitTotal = (teamMembers = []) => Math.abs(getSplitTotal(teamMembers) - 100) < 0.00001;
const getPayoutMethodTagColor = (payoutMethod) => (payoutMethod === "commission" ? "gold" : "blue");
const getEmployeeDisplayName = (employees = [], employeeId) => {
@@ -170,32 +159,11 @@ export function ShopEmployeeTeamsFormComponent({ bodyshop }) {
};
const handleFinish = async ({ employee_team_members = [], ...values }) => {
const normalizedTeamMembers = employee_team_members.map((teamMember) => {
const nextTeamMember = normalizeTeamMember({ ...teamMember });
delete nextTeamMember.__typename;
return nextTeamMember;
});
const { normalizedTeamMembers, errorKey } = validateEmployeeTeamMembers(employee_team_members);
if (normalizedTeamMembers.length === 0) {
if (errorKey) {
notification.error({
title: t("employee_teams.errors.minimum_one_member")
});
return;
}
const employeeIds = normalizedTeamMembers.map((teamMember) => teamMember.employeeid).filter(Boolean);
const duplicateEmployeeIds = employeeIds.filter((employeeId, index) => employeeIds.indexOf(employeeId) !== index);
if (duplicateEmployeeIds.length > 0) {
notification.error({
title: t("employee_teams.errors.duplicate_member")
});
return;
}
if (!hasExactSplitTotal(normalizedTeamMembers)) {
notification.error({
title: t("employee_teams.errors.allocation_total_exact")
title: t(errorKey)
});
return;
}

247
client/src/components/shop-teams/shop-employee-teams.form.component.test.jsx Normal file
View File

@@ -0,0 +1,247 @@
import { fireEvent, render, screen, waitFor } from "@testing-library/react";
import { beforeEach, describe, expect, it, vi } from "vitest";
import { INSERT_EMPLOYEE_TEAM, UPDATE_EMPLOYEE_TEAM } from "../../graphql/employee_teams.queries";
import { LABOR_TYPES } from "./shop-employee-teams.form.utils.js";
import { ShopEmployeeTeamsFormComponent } from "./shop-employee-teams.form.component.jsx";
const insertEmployeeTeamMock = vi.fn();
const updateEmployeeTeamMock = vi.fn();
const useQueryMock = vi.fn();
const useMutationMock = vi.fn();
const navigateMock = vi.fn();
const notification = {
error: vi.fn(),
success: vi.fn()
};
vi.mock("@apollo/client/react", () => ({
useQuery: (...args) => useQueryMock(...args),
useMutation: (...args) => useMutationMock(...args)
}));
vi.mock("react-router-dom", () => ({
useLocation: () => ({
search: "?employeeTeamId=new"
}),
useNavigate: () => navigateMock
}));
vi.mock("react-i18next", () => ({
useTranslation: () => ({
t: (key, values = {}) => {
const translations = {
"employee_teams.fields.name": "Team Name",
"employee_teams.fields.active": "Active",
"employee_teams.fields.max_load": "Max Load",
"employee_teams.fields.employeeid": "Employee",
"employee_teams.fields.allocation_percentage": "Allocation %",
"employee_teams.fields.payout_method": "Payout Method",
"employee_teams.fields.allocation": "Allocation",
"employee_teams.fields.employeeid_label": "Employee",
"employee_teams.options.hourly": "Hourly",
"employee_teams.options.commission": "Commission",
"employee_teams.options.commission_percentage": "Commission",
"employee_teams.actions.newmember": "New Team Member",
"employee_teams.errors.minimum_one_member": "Add at least one team member.",
"employee_teams.errors.duplicate_member": "Team members must be unique.",
"employee_teams.errors.allocation_total_exact": "Allocation must total exactly 100%.",
"general.actions.save": "Save",
"employees.successes.save": "Saved"
};
if (key === "employee_teams.labels.allocation_total") {
return `Allocation Total: ${values.total}%`;
}
if (key.startsWith("joblines.fields.lbr_types.")) {
return key.split(".").pop();
}
return translations[key] || key;
}
})
}));
vi.mock("../../contexts/Notifications/notificationContext.jsx", () => ({
useNotification: () => notification
}));
vi.mock("../../firebase/firebase.utils", () => ({
logImEXEvent: vi.fn()
}));
vi.mock("../employee-search-select/employee-search-select.component", () => ({
default: ({ id, value, onChange, options = [] }) => (
<select
aria-label="Employee"
id={id}
value={value ?? ""}
onChange={(event) => onChange?.(event.target.value || undefined)}
>
<option value="">Select Employee</option>
{options.map((option) => (
<option key={option.id} value={option.id}>
{[option.first_name, option.last_name].filter(Boolean).join(" ")}
</option>
))}
</select>
)
}));
vi.mock("../form-items-formatted/currency-form-item.component", () => ({
default: ({ id, value, onChange }) => (
<input
data-testid="currency-input"
id={id}
type="text"
value={value ?? ""}
onChange={(event) => onChange?.(event.target.value === "" ? null : Number(event.target.value))}
/>
)
}));
vi.mock("../layout-form-row/layout-form-row.component", () => ({
default: ({ title, extra, children }) => (
<div>
{title}
{extra}
{children}
</div>
)
}));
vi.mock("../form-list-move-arrows/form-list-move-arrows.component", () => ({
default: () => null
}));
const bodyshop = {
id: "shop-1",
employees: [
{
id: "emp-1",
first_name: "Avery",
last_name: "Johnson"
},
{
id: "emp-2",
first_name: "Morgan",
last_name: "Lee"
}
]
};
const fillHourlyRates = (value) => {
LABOR_TYPES.forEach((laborType) => {
fireEvent.change(screen.getByLabelText(laborType), {
target: { value: String(value) }
});
});
};
const addBaseTeamMember = ({ employeeId = "emp-1", percentage = 100, rate = 25 } = {}) => {
fireEvent.click(screen.getByRole("button", { name: "New Team Member" }));
fireEvent.change(screen.getByLabelText("Employee"), {
target: { value: employeeId }
});
fireEvent.change(screen.getByRole("spinbutton", { name: "Allocation %" }), {
target: { value: String(percentage) }
});
fillHourlyRates(rate);
};
describe("ShopEmployeeTeamsFormComponent", () => {
beforeEach(() => {
vi.clearAllMocks();
useQueryMock.mockReturnValue({
error: null,
data: null,
loading: false
});
useMutationMock.mockImplementation((mutation) => {
if (mutation === UPDATE_EMPLOYEE_TEAM) {
return [updateEmployeeTeamMock];
}
if (mutation === INSERT_EMPLOYEE_TEAM) {
return [insertEmployeeTeamMock];
}
return [vi.fn()];
});
insertEmployeeTeamMock.mockResolvedValue({
data: {
insert_employee_teams_one: {
id: "team-1"
}
}
});
});
it("switches a new team member from hourly rates to commission percentages", async () => {
render(<ShopEmployeeTeamsFormComponent bodyshop={bodyshop} />);
addBaseTeamMember();
expect(screen.getAllByTestId("currency-input")).toHaveLength(LABOR_TYPES.length);
fireEvent.mouseDown(screen.getByRole("combobox", { name: "Payout Method" }));
fireEvent.click(screen.getByText("Commission"));
await waitFor(() => {
expect(screen.queryAllByTestId("currency-input")).toHaveLength(0);
});
});
it("submits a valid new hourly team with normalized member data", async () => {
render(<ShopEmployeeTeamsFormComponent bodyshop={bodyshop} />);
fireEvent.change(screen.getByRole("textbox", { name: "Team Name" }), {
target: { value: "Commission Crew" }
});
fireEvent.change(screen.getByRole("spinbutton", { name: "Max Load" }), {
target: { value: "8" }
});
addBaseTeamMember({
employeeId: "emp-1",
percentage: 100,
rate: 27.5
});
fireEvent.click(screen.getByRole("button", { name: "Save" }));
await waitFor(() => {
expect(insertEmployeeTeamMock).toHaveBeenCalledWith({
variables: {
employeeTeam: {
name: "Commission Crew",
max_load: 8,
employee_team_members: {
data: [
{
employeeid: "emp-1",
percentage: 100,
payout_method: "hourly",
labor_rates: Object.fromEntries(LABOR_TYPES.map((laborType) => [laborType, 27.5])),
commission_rates: {}
}
]
},
bodyshopid: "shop-1"
}
},
refetchQueries: ["QUERY_TEAMS"]
});
});
expect(notification.success).toHaveBeenCalledWith({
title: "Saved"
});
expect(navigateMock).toHaveBeenCalledWith({
search: "employeeTeamId=team-1"
});
});
});

70
client/src/components/shop-teams/shop-employee-teams.form.utils.js Normal file
View File

@@ -0,0 +1,70 @@
export const LABOR_TYPES = [
"LAA",
"LAB",
"LAD",
"LAE",
"LAF",
"LAG",
"LAM",
"LAR",
"LAS",
"LAU",
"LA1",
"LA2",
"LA3",
"LA4"
];
export const normalizeTeamMember = (teamMember = {}) => ({
...teamMember,
payout_method: teamMember.payout_method || "hourly",
labor_rates: teamMember.labor_rates || {},
commission_rates: teamMember.commission_rates || {}
});
export const normalizeEmployeeTeam = (employeeTeam = {}) => ({
...employeeTeam,
employee_team_members: (employeeTeam.employee_team_members || []).map(normalizeTeamMember)
});
export const getSplitTotal = (teamMembers = []) =>
teamMembers.reduce((sum, member) => sum + Number(member?.percentage || 0), 0);
export const hasExactSplitTotal = (teamMembers = []) => Math.abs(getSplitTotal(teamMembers) - 100) < 0.00001;
export const validateEmployeeTeamMembers = (employeeTeamMembers = []) => {
const normalizedTeamMembers = employeeTeamMembers.map((teamMember) => {
const nextTeamMember = normalizeTeamMember({ ...teamMember });
delete nextTeamMember.__typename;
return nextTeamMember;
});
if (normalizedTeamMembers.length === 0) {
return {
normalizedTeamMembers,
errorKey: "employee_teams.errors.minimum_one_member"
};
}
const employeeIds = normalizedTeamMembers.map((teamMember) => teamMember.employeeid).filter(Boolean);
const duplicateEmployeeIds = employeeIds.filter((employeeId, index) => employeeIds.indexOf(employeeId) !== index);
if (duplicateEmployeeIds.length > 0) {
return {
normalizedTeamMembers,
errorKey: "employee_teams.errors.duplicate_member"
};
}
if (!hasExactSplitTotal(normalizedTeamMembers)) {
return {
normalizedTeamMembers,
errorKey: "employee_teams.errors.allocation_total_exact"
};
}
return {
normalizedTeamMembers,
errorKey: null
};
};

86
client/src/components/shop-teams/shop-employee-teams.form.utils.test.js Normal file
View File

@@ -0,0 +1,86 @@
import { describe, expect, it } from "vitest";
import {
getSplitTotal,
hasExactSplitTotal,
normalizeTeamMember,
validateEmployeeTeamMembers
} from "./shop-employee-teams.form.utils.js";
describe("shop employee team form utilities", () => {
it("normalizes missing payout defaults for a team member", () => {
expect(
normalizeTeamMember({
employeeid: "emp-1",
percentage: 100
})
).toEqual({
employeeid: "emp-1",
percentage: 100,
payout_method: "hourly",
labor_rates: {},
commission_rates: {}
});
});
it("returns a minimum-member validation error when no team members are provided", () => {
expect(validateEmployeeTeamMembers([])).toEqual({
normalizedTeamMembers: [],
errorKey: "employee_teams.errors.minimum_one_member"
});
});
it("rejects duplicate employees in the same team", () => {
const result = validateEmployeeTeamMembers([
{ employeeid: "emp-1", percentage: 50, labor_rates: { LAA: 25 } },
{ employeeid: "emp-1", percentage: 50, labor_rates: { LAA: 30 } }
]);
expect(result.errorKey).toBe("employee_teams.errors.duplicate_member");
});
it("rejects team allocations that do not add up to exactly one hundred percent", () => {
const result = validateEmployeeTeamMembers([
{ employeeid: "emp-1", percentage: 60, labor_rates: { LAA: 25 } },
{ employeeid: "emp-2", percentage: 30, labor_rates: { LAA: 30 } }
]);
expect(getSplitTotal(result.normalizedTeamMembers)).toBe(90);
expect(hasExactSplitTotal(result.normalizedTeamMembers)).toBe(false);
expect(result.errorKey).toBe("employee_teams.errors.allocation_total_exact");
});
it("accepts a valid mixed hourly and commission team and strips graph metadata", () => {
const result = validateEmployeeTeamMembers([
{
__typename: "employee_team_members",
employeeid: "emp-1",
percentage: 40,
labor_rates: { LAA: 28.5 }
},
{
employeeid: "emp-2",
percentage: 60,
payout_method: "commission",
commission_rates: { LAA: 35 }
}
]);
expect(result.errorKey).toBeNull();
expect(result.normalizedTeamMembers).toEqual([
{
employeeid: "emp-1",
percentage: 40,
payout_method: "hourly",
labor_rates: { LAA: 28.5 },
commission_rates: {}
},
{
employeeid: "emp-2",
percentage: 60,
payout_method: "commission",
labor_rates: {},
commission_rates: { LAA: 35 }
}
]);
});
});