Revert "Release/2026 02 27 (pull request #3070)"

client/src/components/jobs-list/jobs-list.component.jsx

@@ -1,6 +1,6 @@
 import { BranchesOutlined, ExclamationCircleFilled, PauseCircleOutlined, SyncOutlined } from "@ant-design/icons";
 import { useQuery } from "@apollo/client/react";
-import { Button, Card, Input, Space, Tooltip } from "antd";
+import { Button, Card, Grid, Input, Space, Table, Tooltip } from "antd";
 import queryString from "query-string";
 import { useState } from "react";
 import { useTranslation } from "react-i18next";
@@ -16,7 +16,6 @@ import useLocalStorage from "../../utils/useLocalStorage";
 import AlertComponent from "../alert/alert.component";
 import ChatOpenButton from "../chat-open-button/chat-open-button.component";
 import OwnerNameDisplay from "../owner-name-display/owner-name-display.component";
-import ResponsiveTable from "../responsive-table/responsive-table.component";
 import { OwnerNameDisplayFunction } from "./../owner-name-display/owner-name-display.component";
 import { logImEXEvent } from "../../firebase/firebase.utils";
 
@@ -29,6 +28,9 @@ const mapDispatchToProps = () => ({});
 export function JobsList({ bodyshop }) {
   const searchParams = queryString.parse(useLocation().search);
   const { selected } = searchParams;
+  const selectedBreakpoint = Object.entries(Grid.useBreakpoint())
+    .filter((screen) => !!screen[1])
+    .slice(-1)[0];
   const { loading, error, data, refetch } = useQuery(QUERY_ALL_ACTIVE_JOBS, {
     variables: {
       statuses: bodyshop.md_ro_statuses.active_statuses || ["Open", "Open*"]
@@ -184,15 +186,12 @@ export function JobsList({ bodyshop }) {
         ),
       sortOrder: state.sortedInfo.columnKey === "vehicle" && state.sortedInfo.order,
       render: (text, record) => {
-        const vehicleLabel =
-          `${record.v_model_yr || ""} ${record.v_make_desc || ""} ${record.v_model_desc || ""}`.trim();
-
         return record.vehicleid ? (
           <Link to={"/manage/vehicles/" + record.vehicleid} onClick={(e) => e.stopPropagation()}>
-            <span className="ellipses">{vehicleLabel}</span>
+            {`${record.v_model_yr || ""} ${record.v_make_desc || ""} ${record.v_model_desc || ""}`}
           </Link>
         ) : (
-          <span className="ellipses">{vehicleLabel}</span>
+          <span>{`${record.v_model_yr || ""} ${record.v_make_desc || ""} ${record.v_model_desc || ""}`}</span>
         );
       }
     },
@@ -299,6 +298,15 @@ export function JobsList({ bodyshop }) {
     // },
   ];
 
+  const scrollMapper = {
+    xs: true,
+    sm: true,
+    md: true,
+    lg: "100%",
+    xl: "100%",
+    xxl: "100%"
+  };
+
   return (
     <Card
       id="active-jobs-list"
@@ -317,13 +325,15 @@ export function JobsList({ bodyshop }) {
         </Space>
       }
     >
-      <ResponsiveTable
+      <Table
         loading={loading}
         pagination={{ defaultPageSize: 50 }}
         columns={columns}
         rowKey="id"
         dataSource={jobs}
-        mobileColumnKeys={["ro_number", "owner", "status", "vehicle"]}
+        scroll={{
+          x: selectedBreakpoint ? scrollMapper[selectedBreakpoint[0]] : "100%"
+        }}
         rowSelection={{
           onSelect: (record) => {
             handleOnRowClick(record);