diff --git a/client/src/components/job-parts-queue-count/job-parts-queue-count.component.jsx b/client/src/components/job-parts-queue-count/job-parts-queue-count.component.jsx index 6921d4305..771d36f36 100644 --- a/client/src/components/job-parts-queue-count/job-parts-queue-count.component.jsx +++ b/client/src/components/job-parts-queue-count/job-parts-queue-count.component.jsx @@ -3,14 +3,11 @@ import { Tooltip } from "antd"; import { connect } from "react-redux"; import { createStructuredSelector } from "reselect"; import { selectBodyshop } from "../../redux/user/user.selectors"; -import { useTranslation } from "react-i18next"; const mapStateToProps = createStructuredSelector({ bodyshop: selectBodyshop }); -const mapDispatchToProps = () => ({ - //setUserLanguage: language => dispatch(setUserLanguage(language)) -}); +const mapDispatchToProps = () => ({}); const colorMap = { gray: { bg: "#fafafa", border: "#d9d9d9", text: "#000000" }, @@ -21,8 +18,9 @@ const colorMap = { orange: { bg: "#fff7e6", border: "#ffd591", text: "#d46b08" } }; -function CompactTag({ color = "gray", children }) { +function CompactTag({ color = "gray", children, tooltip = "" }) { const colors = colorMap[color] || colorMap.gray; + return ( - {children} + {children} ); } @@ -49,15 +46,20 @@ function CompactTag({ color = "gray", children }) { export default connect(mapStateToProps, mapDispatchToProps)(JobPartsQueueCount); export function JobPartsQueueCount({ bodyshop, parts }) { - const { t } = useTranslation(); const partsStatus = useMemo(() => { if (!parts) return null; + const statusKeys = ["default_bo", "default_ordered", "default_received", "default_returned"]; + return parts.reduce( (acc, val) => { if (val.part_type === "PAS" || val.part_type === "PASL") return acc; - acc.total = acc.total + val.count; - acc[val.status] = acc[val.status] + val.count; + + acc.total += val.count; + + // NOTE: if val.status is null, object key becomes "null" + acc[val.status] = (acc[val.status] ?? 0) + val.count; + return acc; }, { @@ -68,28 +70,38 @@ export function JobPartsQueueCount({ bodyshop, parts }) { ); }, [bodyshop, parts]); - if (!parts) return null; - return ( -
- - {partsStatus.total} - - - {partsStatus["null"]} - + if (!parts || !partsStatus) return null; - - {partsStatus[bodyshop.md_order_statuses.default_bo]} - - - {partsStatus[bodyshop.md_order_statuses.default_ordered]} - - - {partsStatus[bodyshop.md_order_statuses.default_received]} - - - {partsStatus[bodyshop.md_order_statuses.default_returned]} - + return ( +
+ + {partsStatus.total} + + + + {partsStatus["null"]} + + + + {partsStatus[bodyshop.md_order_statuses.default_bo]} + + + + {partsStatus[bodyshop.md_order_statuses.default_ordered]} + + + {partsStatus[bodyshop.md_order_statuses.default_received]} + + + {partsStatus[bodyshop.md_order_statuses.default_returned]} +
); } diff --git a/client/src/components/job-parts-received/job-parts-received.component.jsx b/client/src/components/job-parts-received/job-parts-received.component.jsx index 27ca915b2..dc6c42cbc 100644 --- a/client/src/components/job-parts-received/job-parts-received.component.jsx +++ b/client/src/components/job-parts-received/job-parts-received.component.jsx @@ -83,7 +83,7 @@ export function JobPartsReceived({ trigger={["click"]} placement={popoverPlacement} content={ -
+
}