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

feature/IO-3497-Ant-Design-v5-to-v6 - Orientation

Browse Source
This commit is contained in:
Dave
2026-01-09 18:29:43 -05:00
parent 30e137eaf6
commit c3da0d9035
34 changed files with 1219 additions and 900 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2031
client/package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

4
client/package.json
View File

@@ -25,7 +25,7 @@
"@sentry/vite-plugin": "^4.6.1",
"@splitsoftware/splitio-react": "^2.6.1",
"@tanem/react-nprogress": "^5.0.56",
"antd": "^5.28.1",
"antd": "^6.1.4",
"apollo-link-logger": "^2.0.1",
"apollo-link-sentry": "^4.4.0",
"autosize": "^6.0.1",
@@ -50,7 +50,7 @@
"normalize-url": "^8.1.1",
"object-hash": "^3.0.0",
"phone": "^3.1.69",
"posthog-js": "^1.315.1",
"posthog-js": "^1.316.1",
"prop-types": "^15.8.1",
"query-string": "^9.3.1",
"raf-schd": "^4.0.3",

2
client/src/components/card-payment-modal/card-payment-modal.component.jsx
View File

@@ -316,7 +316,7 @@ const CardPaymentModalComponent = ({
>
{t("job_payments.buttons.proceedtopayment")}
</Button>
<Space direction="vertical" align="center">
<Space orientation="vertical" align="center">
<Button
type="primary"
// data-ipayname="submit"

2
client/src/components/chat-conversation-list/chat-conversation-list.component.jsx
View File

@@ -95,7 +95,7 @@ function ChatConversationListComponent({ conversationList, selectedConversation,
<>
{item.label && <Tag color="blue">{item.label}</Tag>}
{item.job_conversations.length > 0 ? (
<Space direction="vertical">{names}</Space>
<Space orientation="vertical">{names}</Space>
) : (
<Space>
<PhoneFormatter>{item.phone_num}</PhoneFormatter>

2
client/src/components/chat-send-message/chat-send-message.component.jsx
View File

@@ -68,7 +68,7 @@ function ChatSendMessageComponent({ conversation, bodyshop, sendMessage, isSendi
};
return (
<Space direction="vertical" style={{ width: "100%" }} size="middle">
<Space orientation="vertical" style={{ width: "100%" }} size="middle">
{isOptedOut && (
<Tooltip title={t("consent.text_body")}>
<Alert

4
client/src/components/contract-form/contract-form.component.jsx
View File

@@ -67,7 +67,7 @@ export default function ContractFormComponent({ form, create = false, selectedJo
.isBefore(dayjs(form.getFieldValue("scheduledreturn")));
if (insuranceOver)
return (
<Space direction="vertical" style={{ color: "tomato" }}>
<Space orientation="vertical" style={{ color: "tomato" }}>
<span>
<WarningFilled style={{ marginRight: ".3rem" }} />
{t("contracts.labels.insuranceexpired")}
@@ -107,7 +107,7 @@ export default function ContractFormComponent({ form, create = false, selectedJo
.isSameOrBefore(dayjs(form.getFieldValue("scheduledreturn")));
if (mileageOver || dueForService)
return (
<Space direction="vertical" style={{ color: "tomato" }}>
<Space orientation="vertical" style={{ color: "tomato" }}>
<span>
<WarningFilled style={{ marginRight: ".3rem" }} />
{t("contracts.labels.cardueforservice")}

8
client/src/components/courtesy-car-form/courtesy-car-form.component.jsx
View File

@@ -208,7 +208,7 @@ export default function CourtesyCarCreateFormComponent({ form, saveLoading, newC
const mileageOver = nextservicekm ? nextservicekm <= form.getFieldValue("mileage") : false;
if (mileageOver)
return (
<Space direction="vertical" style={{ color: "tomato" }}>
<Space orientation="vertical" style={{ color: "tomato" }}>
<span>
<WarningFilled style={{ marginRight: ".3rem" }} />
{t("contracts.labels.cardueforservice")}
@@ -232,7 +232,7 @@ export default function CourtesyCarCreateFormComponent({ form, saveLoading, newC
if (dueForService)
return (
<Space direction="vertical" style={{ color: "tomato" }}>
<Space orientation="vertical" style={{ color: "tomato" }}>
<span>
<WarningFilled style={{ marginRight: ".3rem" }} />
{t("contracts.labels.cardueforservice")}
@@ -265,7 +265,7 @@ export default function CourtesyCarCreateFormComponent({ form, saveLoading, newC
if (dateover)
return (
<Space direction="vertical" style={{ color: "tomato" }}>
<Space orientation="vertical" style={{ color: "tomato" }}>
<span>
<WarningFilled style={{ marginRight: ".3rem" }} />
{t("contracts.labels.dateinpast")}
@@ -298,7 +298,7 @@ export default function CourtesyCarCreateFormComponent({ form, saveLoading, newC
if (dateover)
return (
<Space direction="vertical" style={{ color: "tomato" }}>
<Space orientation="vertical" style={{ color: "tomato" }}>
<span>
<WarningFilled style={{ marginRight: ".3rem" }} />
{t("contracts.labels.dateinpast")}

2
client/src/components/dms-log-events/dms-log-events.component.jsx
View File

@@ -70,7 +70,7 @@ export function DmsLogEvents({
key: idx,
color: logLevelColor(level),
children: (
<Space direction="vertical" size={4} style={{ display: "flex" }}>
<Space orientation="vertical" size={4} style={{ display: "flex" }}>
{/* Row 1: summary + inline "Details" toggle */}
<Space wrap align="start">
<Tag color={logLevelColor(level)}>{level}</Tag>

2
client/src/components/form-date-time-picker/form-date-time-picker.component.jsx
View File

@@ -89,7 +89,7 @@ const DateTimePicker = ({
return (
<div onKeyDown={handleKeyDown} id={id} style={{ width: "100%" }}>
{isSeparatedTime && (
<Space direction="vertical" style={{ width: "100%" }}>
<Space orientation="vertical" style={{ width: "100%" }}>
<DatePicker
showTime={false}
format="MM/DD/YYYY"

2
client/src/components/form-fields-changed-alert/form-fields-changed-alert.component.jsx
View File

@@ -17,7 +17,7 @@ export default function FormsFieldChanged({ form, skipPrompt }) {
const errors = form.getFieldsError().filter((e) => e.errors.length > 0);
if (form.isFieldsTouched())
return (
<Space direction="vertical" style={{ width: "100%" }}>
<Space orientation="vertical" style={{ width: "100%" }}>
<Prompt when={!skipPrompt} beforeUnload={true} message={t("general.messages.unsavedchangespopup")} />
<AlertComponent
type="warning"

2
client/src/components/form-list-move-arrows/form-list-move-arrows.component.jsx
View File

@@ -14,7 +14,7 @@ export default function FormListMoveArrows({ move, index, total }) {
};
return (
<Space direction="vertical">
<Space orientation="vertical">
<UpOutlined disabled={upDisabled} onClick={handleUp} />
<DownOutlined disabled={downDisabled} onClick={handleDown} />
</Space>

2
client/src/components/help-rescue/help-rescue.component.jsx
View File

@@ -19,7 +19,7 @@ export default function HelpRescue() {
return (
<div style={{ display: "flex", justifyContent: "center" }}>
<Space direction="vertical" align="center">
<Space orientation="vertical" align="center">
<div>{t("help.labels.rescuedesc")}</div>
<Input
size="large"

2
client/src/components/job-at-change/schedule-event.component.jsx
View File

@@ -87,7 +87,7 @@ export function ScheduleEventComponent({
});
const blockContent = (
<Space direction="vertical" wrap>
<Space orientation="vertical" wrap>
<Input
value={title}
onChange={(e) => setTitle(e.currentTarget.value)}

4
client/src/components/job-costing-statistics/job-costing-statistics.component.jsx
View File

@@ -7,11 +7,11 @@ export default function JobCostingStatistics({ summaryData, onlyGP }) {
const gpTotals = (
<>
<Space wrap direction="horizontal" size={"large"}>
<Space wrap orientation="horizontal" size={"large"}>
<Statistic value={Dinero(summaryData.totalSales).toFormat()} title={t("jobs.labels.total_sales")} />
<Statistic value={Dinero(summaryData.totalCost).toFormat()} title={t("jobs.labels.total_cost")} />
</Space>{" "}
<Space wrap direction="horizontal" size={"large"}>
<Space wrap orientation="horizontal" size={"large"}>
<Statistic value={Dinero(summaryData.gpdollars).toFormat()} title={t("jobs.labels.gpdollars")} />
<Statistic value={summaryData.gppercentFormatted} title={t("jobs.labels.gppercent")} />
</Space>

2
client/src/components/job-detail-lines/job-lines.component.jsx
View File

@@ -509,7 +509,7 @@ export function JobLinesComponent({
}}
destroyOnHidden
>
<Space direction="vertical" style={{ width: "100%" }}>
<Space orientation="vertical" style={{ width: "100%" }}>
<Typography.Text type="secondary">
{t("general.labels.selected")}: {selectedLineIds.length}
</Typography.Text>

6
client/src/components/job-lifecycle/job-lifecycle.component.jsx
View File

@@ -144,11 +144,11 @@ export function JobLifecycleComponent({ bodyshop, job, statuses }) {
<Card loading={loading} title={t("job_lifecycle.content.title")}>
{!loading ? (
lifecycleData && lifecycleData.lifecycle && lifecycleData.durations ? (
<Space direction="vertical" style={{ width: "100%" }}>
<Space orientation="vertical" style={{ width: "100%" }}>
<Card
type="inner"
title={
<Space direction="horizontal" size="small">
<Space orientation="horizontal" size="small">
<Badge status="processing" count={lifecycleData.durations.totalStatuses} />
{t("job_lifecycle.content.title_durations")}
</Space>
@@ -303,7 +303,7 @@ export function JobLifecycleComponent({ bodyshop, job, statuses }) {
type="inner"
title={
<>
<Space direction="horizontal" size="small">
<Space orientation="horizontal" size="small">
<Badge status="processing" count={lifecycleData.lifecycle.length} />
{t("job_lifecycle.content.title_transitions")}
</Space>

2
client/src/components/job-reconciliation-totals/job-reconciliation-totals.component.jsx
View File

@@ -48,7 +48,7 @@ export default function JobReconciliationTotals({ billLines, jobLines, jobLineSt
</Space>
</div>
<div>
<Space direction="horizontal">
<Space orientation="horizontal">
<Button onClick={() => reconcileByAssocLine(jobLines, jobLineState, billLines, billLineState, setErrors)}>
{t("jobs.labels.reconciliation.byassoc")}
</Button>

2
client/src/components/notification-center/notification-center.component.jsx
View File

@@ -81,7 +81,7 @@ const NotificationCenterComponent = forwardRef(
return (
<div className={`notification-center ${visible ? "visible" : ""}`} ref={ref}>
<div className="notification-header">
<Space direction="horizontal">
<Space orientation="horizontal">
<h3>{t("notifications.labels.notification-center")}</h3>
{loading && <Spin spinning={loading} size="small"></Spin>}
</Space>

2
client/src/components/parts-order-list-table/parts-order-list-table-drawer.component.jsx
View File

@@ -113,7 +113,7 @@ export function PartsOrderListTableDrawerComponent({
}, [selectedPartsOrderRecord, billQuery]);
const recordActions = (record) => (
<Space direction="horizontal" wrap>
<Space orientation="horizontal" wrap>
<Button
disabled={jobRO || record.return || record.vendor.id === bodyshop.inhousevendorid}
onClick={() => {

2
client/src/components/parts-order-list-table/parts-order-list-table.component.jsx
View File

@@ -72,7 +72,7 @@ export function PartsOrderListTableComponent({
const { refetch } = billsQuery;
const recordActions = (record, showView = false) => (
<Space direction="horizontal" wrap>
<Space orientation="horizontal" wrap>
<ShareToTeamsButton
linkText={""}
urlOverride={`${window.location.origin}/manage/jobs/${job.id}?partsorderid=${record.id}&tab=partssublet `}

2
client/src/components/parts-shop-info/parts-shop-management.component.jsx
View File

@@ -22,7 +22,7 @@ export function PartsShopManagementComponent({ form, saveLoading }) {
</Button>
}
>
<Space direction="vertical" size="large" style={{ width: "100%" }}>
<Space orientation="vertical" size="large" style={{ width: "100%" }}>
{/* Business Information Section - Limited to basic shop info only */}
<PartsBusinessInfoComponent form={form} />

2
client/src/components/payments-generate-link/payments-generate-link.component.jsx
View File

@@ -99,7 +99,7 @@ export function PaymentsGenerateLink({ bodyshop, currentUser, callback, job, ope
<CurrencyFormItemComponent />
</Form.Item>
{paymentLink && (
<Space direction="vertical">
<Space orientation="vertical">
<Space
style={{ cursor: "pointer" }}
onClick={() => {

2
client/src/components/phone-number-consent/phone-number-consent.component.jsx
View File

@@ -97,7 +97,7 @@ function PhoneNumberConsentList({ bodyshop }) {
}
return owners.map((owner) => (
<div key={owner.id}>
<Space direction="horizontal">
<Space orientation="horizontal">
<Link to={"/manage/owners/" + owner.id}>
<OwnerNameDisplay ownerObject={owner} />
</Link>

2
client/src/components/pinned-job-notes/pinned-job-notes.component.jsx
View File

@@ -13,7 +13,7 @@ function PinnedJobNotes({ job }) {
return pinnedNotes?.length ? (
<>
<Divider />
<Space direction="vertical" style={{ width: "100%" }}>
<Space orientation="vertical" style={{ width: "100%" }}>
{pinnedNotes?.map((note) => (
<Card
key={note.id}

2
client/src/components/production-list-columns/production-list-columns.date.component.jsx
View File

@@ -56,7 +56,7 @@ export default function ProductionListDate({ record, field, time, pastIndicator
key: "overlayItem1",
label: (
<Card style={{ padding: "1rem" }} onClick={(e) => e.stopPropagation()}>
<Space direction={"vertical"}>
<Space orientation={"vertical"}>
<DateTimePicker
onClick={(e) => e.stopPropagation()}
value={(record[field] && dayjs(record[field])) || null}

4
client/src/components/schedule-calendar-wrapper/scheduler-calendar-wrapper.component.jsx
View File

@@ -87,7 +87,7 @@ export function ScheduleCalendarWrapperComponent({
<span style={{ color: "var(--error-header-text)" }}>{t("appointments.labels.severalerrorsfound")}</span>
}
>
<Space direction="vertical" style={{ width: "100%" }}>
<Space orientation="vertical" style={{ width: "100%" }}>
{problemJobs.map((problem) => (
<Alert
key={problem.id}
@@ -108,7 +108,7 @@ export function ScheduleCalendarWrapperComponent({
</Collapse.Panel>
</Collapse>
) : (
<Space direction="vertical" style={{ width: "100%", marginBottom: "5px" }}>
<Space orientation="vertical" style={{ width: "100%", marginBottom: "5px" }}>
{problemJobs.map((problem) => (
<Alert
key={problem.id}

2
client/src/components/scoreboard-timetickets-stats/scoreboard-timetickets.stats.component.jsx
View File

@@ -49,7 +49,7 @@ export function ScoreboardTicketsStats({ data, jobData, bodyshop }) {
<Row gutter={[16, 16]}>
<Col md={24}>
{/* Daily Stats */}
<Space direction="vertical" size="middle" style={{ display: "flex" }}>
<Space orientation="vertical" size="middle" style={{ display: "flex" }}>
<Row gutter={[16, 16]} align="center">
{["sunday", "monday", "tuesday", "wednesday", "thursday", "friday", "saturday"].map((day) => {
if (bodyshop.workingdays[day] === true) {

2
client/src/components/shop-info/shop-info.rostatus.component.jsx
View File

@@ -338,7 +338,7 @@ export function ShopInfoROStatusComponent({ bodyshop, form }) {
<Space size="large" wrap>
{fields.map((field, index) => (
<Form.Item key={field.key}>
<Space direction="vertical">
<Space orientation="vertical">
<div style={{ display: "flex" }}>
<Form.Item
style={{ flex: 1 }}

2
client/src/components/shop-info/shop-info.scheduling.component.jsx
View File

@@ -257,7 +257,7 @@ export function ShopInfoSchedulingComponent({ form, bodyshop }) {
<InputNumber />
</Form.Item>
<Space direction="horizontal">
<Space orientation="horizontal">
<Form.Item
label={
<Space>

6
client/src/components/task-list/task-list.component.jsx
View File

@@ -187,7 +187,7 @@ function TaskListComponent({
);
}
return items.length > 0 ? <Space direction="vertical">{items}</Space> : null;
return items.length > 0 ? <Space orientation="vertical">{items}</Space> : null;
}
});
@@ -232,7 +232,7 @@ function TaskListComponent({
key: "toggleCompleted",
width: "8%",
render: (text, record) => (
<Space direction="horizontal">
<Space orientation="horizontal">
<ShareToTeamsButton
linkText=""
urlOverride={`${window.location.origin}/manage/tasks/alltasks?taskid=${record.id}`}
@@ -310,7 +310,7 @@ function TaskListComponent({
*/
const tasksExtra = useCallback(() => {
return (
<Space direction="horizontal">
<Space orientation="horizontal">
{!onlyMine && (
<Switch
checkedChildren={t("tasks.buttons.myTasks")}

2
client/src/components/tech-job-clock-out-button/tech-job-clock-out-button.component.jsx
View File

@@ -130,7 +130,7 @@ export function TechClockOffButton({
cost_center: isShiftTicket ? "timetickets.labels.shift" : technician ? technician.cost_center : null
}}
>
<Space direction="vertical">
<Space orientation="vertical">
{!isShiftTicket ? (
<div>
<Form.Item

2
client/src/components/time-ticket-modal/time-ticket-modal.component.jsx
View File

@@ -342,7 +342,7 @@ export function LaborAllocationContainer({ jobid, loading, lineTicketData, hideT
if (!lineTicketData) return null;
if (!jobid) return null;
return (
<Space direction="vertical" style={{ width: "100%" }}>
<Space orientation="vertical" style={{ width: "100%" }}>
<Card style={{ height: "100%" }} title={t("jobs.labels.employeeassignments")}>
<JobEmployeeAssignmentsContainer job={lineTicketData.jobs_by_pk} />
</Card>

2
client/src/pages/jobs-close/jobs-close.component.jsx
View File

@@ -219,7 +219,7 @@ export function JobsCloseComponent({ job, bodyshop, jobRO, insertAuditTrail, set
}
/>
<JobCloseRoGuardContainer form={form} job={job} />
<Space wrap direction="vertical" style={{ width: "100%" }}>
<Space wrap orientation="vertical" style={{ width: "100%" }}>
<FormsFieldChanged form={form} />
{!job.actual_in && job.scheduled_in && <Alert type="warning" message={t("jobs.labels.actual_in_inferred")} />}
{!job.actual_completion && job.scheduled_completion && (

2
client/src/pages/jobs-detail/jobs-detail.page.component.jsx
View File

@@ -461,7 +461,7 @@ export function JobsDetailPage({
icon: <FaTasks style={{ paddingTop: 3 }} />,
id: "job-details-tasks",
label: (
<Space direction="horizontal" align="center">
<Space orientation="horizontal" align="center">
<span>{t("jobs.labels.tasks")}</span>
{job.tasks_aggregate.aggregate.count > 0 && (
<Badge size="small" count={job.tasks_aggregate.aggregate.count} />