Add comments field to parts queue.

client/src/components/job-parts-queue-count/job-parts-queue-count.component.jsx

@@ -11,7 +11,7 @@ const mapDispatchToProps = (dispatch) => ({
 });
 export default connect(mapStateToProps, mapDispatchToProps)(JobPartsQueueCount);
 
-export function JobPartsQueueCount({ bodyshop, parts }) {
+export function JobPartsQueueCount({ bodyshop, parts, style }) {
   const partsStatus = useMemo(() => {
     if (!parts) return null;
     return parts.reduce(
@@ -36,7 +36,7 @@ export function JobPartsQueueCount({ bodyshop, parts }) {
   if (!parts) return null;
 
   return (
-    <Row>
+    <Row style={style}>
       <Col span={4}>
         <Tooltip title="Total">
           <Tag>{partsStatus.total}</Tag>

client/src/components/production-list-columns/production-list-columns.comment.component.jsx

@@ -1,6 +1,6 @@
 import Icon from "@ant-design/icons";
 import { useMutation } from "@apollo/client";
-import { Button, Input, Popover } from "antd";
+import { Button, Input, Popover, Tooltip } from "antd";
 import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { FaRegStickyNote } from "react-icons/fa";
@@ -69,10 +69,11 @@ export default function ProductionListColumnComment({ record }) {
           cursor: "pointer",
           overflow: "hidden",
           textOverflow: "ellipsis",
+          display: "inline-block",
         }}
       >
         <Icon component={FaRegStickyNote} style={{ marginRight: ".2rem" }} />
-        {record.comment || " "}
+        <Tooltip title={record.comment}>{record.comment || " "}</Tooltip>
       </div>
     </Popover>
   );

client/src/graphql/jobs.queries.js

@@ -85,6 +85,7 @@ export const QUERY_PARTS_QUEUE = gql`
       vehicleid
       ownerid
       queued_for_parts
+      comment
       joblines_status {
         count
         part_type

client/src/pages/parts-queue/parts-queue.page.component.jsx

@@ -11,6 +11,7 @@ import AlertComponent from "../../components/alert/alert.component";
 import JobPartsQueueCount from "../../components/job-parts-queue-count/job-parts-queue-count.component";
 import JobRemoveFromPartsQueue from "../../components/job-remove-from-parst-queue/job-remove-from-parts-queue.component";
 import OwnerNameDisplay from "../../components/owner-name-display/owner-name-display.component";
+import ProductionListColumnComment from "../../components/production-list-columns/production-list-columns.comment.component";
 import { QUERY_PARTS_QUEUE } from "../../graphql/jobs.queries";
 import { selectBodyshop } from "../../redux/user/user.selectors";
 import { onlyUnique } from "../../utils/arrayHelper";
@@ -228,9 +229,18 @@ export function PartsQueuePageComponent({ bodyshop }) {
       dataIndex: "partsstatus",
       key: "partsstatus",
       render: (text, record) => (
-        <JobPartsQueueCount parts={record.joblines_status} />
+        <JobPartsQueueCount
+          style={{ minWidth: "10rem" }}
+          parts={record.joblines_status}
+        />
       ),
     },
+    {
+      title: t("jobs.fields.comment"),
+      dataIndex: "comment",
+      key: "comment",
+      render: (text, record) => <ProductionListColumnComment record={record} />,
+    },
     {
       title: t("jobs.fields.queued_for_parts"),
       dataIndex: "queued_for_parts",
@@ -247,7 +257,7 @@ export function PartsQueuePageComponent({ bodyshop }) {
           value: false,
         },
       ],
-      //onFilter: (value, record) => record.queued_for_parts === value,
+      onFilter: (value, record) => record.queued_for_parts === value,
       render: (text, record) => (
         <JobRemoveFromPartsQueue
           checked={record.queued_for_parts}