From cdf7bcf839b4fb6e7b190d123805d3ff03c45bc1 Mon Sep 17 00:00:00 2001 From: Dave Richer Date: Tue, 9 Jul 2024 15:57:51 -0400 Subject: [PATCH] - clear stage. Signed-off-by: Dave Richer --- .../production-board-kanban.component.jsx | 17 ++- .../production-board-kanban.styles.scss | 31 +++- .../components/Lane/LaneFooter.jsx | 4 +- .../trello-board/controllers/Lane.jsx | 7 +- .../trello-board/styles/Base.js | 4 - package-lock.json | 144 +++++++++--------- package.json | 6 +- 7 files changed, 119 insertions(+), 94 deletions(-) diff --git a/client/src/components/production-board-kanban/production-board-kanban.component.jsx b/client/src/components/production-board-kanban/production-board-kanban.component.jsx index 069104924..5cd109af6 100644 --- a/client/src/components/production-board-kanban/production-board-kanban.component.jsx +++ b/client/src/components/production-board-kanban/production-board-kanban.component.jsx @@ -17,7 +17,7 @@ import ProductionBoardFilters from "../production-board-filters/production-board import ProductionListDetailComponent from "../production-list-detail/production-list-detail.component"; import CardColorLegend from "../production-board-kanban-card/production-board-kanban-card-color-legend.component"; import "./production-board-kanban.styles.scss"; -import { createBoardData, createFakeBoardData } from "./production-board-kanban.utils.js"; +import { createBoardData } from "./production-board-kanban.utils.js"; import ProductionBoardKanbanSettings from "./production-board-kanban.settings.component.jsx"; import cloneDeep from "lodash/cloneDeep"; import isEqual from "lodash/isEqual"; @@ -37,7 +37,7 @@ const mapDispatchToProps = (dispatch) => ({ ) }); -export function ProductionBoardKanbanComponent({ data, bodyshop, refetch, insertAuditTrail, associationSettings }) { +function ProductionBoardKanbanComponent({ data, bodyshop, refetch, insertAuditTrail, associationSettings }) { const [boardLanes, setBoardLanes] = useState({ lanes: [] }); const [filter, setFilter] = useState({ search: "", employeeId: null }); const [loading, setLoading] = useState(true); @@ -45,15 +45,18 @@ export function ProductionBoardKanbanComponent({ data, bodyshop, refetch, insert const [orientation, setOrientation] = useState("vertical"); const { t } = useTranslation(); + const client = useApolloClient(); useEffect(() => { if (associationSettings) { - setLoading(false); + setLoading(true); setOrientation(associationSettings?.kanban_settings?.orientation ? "vertical" : "horizontal"); + setLoading(false); } }, [associationSettings]); useEffect(() => { + setIsMoving(true); const newBoardData = createBoardData( [...bodyshop.md_ro_statuses.production_statuses, ...(bodyshop.md_ro_statuses.additional_board_statuses || [])], data, @@ -75,8 +78,6 @@ export function ProductionBoardKanbanComponent({ data, bodyshop, refetch, insert setIsMoving(false); }, [data, bodyshop.md_ro_statuses, filter]); - const client = useApolloClient(); - const getCardByID = useCallback((data, cardId) => { for (const lane of data.lanes) { for (const card of lane.cards) { @@ -213,9 +214,11 @@ export function ProductionBoardKanbanComponent({ data, bodyshop, refetch, insert [associationSettings] ); - const handleSettingsChange = (newSettings) => { + const handleSettingsChange = useCallback((newSettings) => { + setLoading(true); setOrientation(newSettings.orientation ? "vertical" : "horizontal"); - }; + setLoading(false); + }, []); if (loading) { return ; diff --git a/client/src/components/production-board-kanban/production-board-kanban.styles.scss b/client/src/components/production-board-kanban/production-board-kanban.styles.scss index 360b4aaae..25dc472ad 100644 --- a/client/src/components/production-board-kanban/production-board-kanban.styles.scss +++ b/client/src/components/production-board-kanban/production-board-kanban.styles.scss @@ -1,25 +1,40 @@ .react-trello-board { padding: 5px; } -.item .is-dragging { - box-shadow: 2px 2px grey; - rotate: 5deg; -} .height-preserving-container:empty { min-height: calc(var(--child-height)); box-sizing: border-box; } +.height-preserving-container { +} + .react-trello-column-header { font-weight: bold; - background-color: #e3e3e3; - .icon { - margin-right: 5px; - } + cursor: pointer; + background-color: #d0d0d0; + border-radius: 5px 5px 0 0; } + .production-alert { background: transparent; border: none; } +.react-trello-footer { + background-color: #d0d0d0; + border-radius: 0 0 5px 5px; +} + +.grid-item { + margin: 1px; // TODO: (Note) THis is where we set the margin for vertical +} + +.lane-title { + vertical-align: middle; + + .icon { + margin-right: 8px; /* Adjust the spacing as needed */ + } +} diff --git a/client/src/components/production-board-kanban/trello-board/components/Lane/LaneFooter.jsx b/client/src/components/production-board-kanban/trello-board/components/Lane/LaneFooter.jsx index ccf6dcdcb..802de2c99 100644 --- a/client/src/components/production-board-kanban/trello-board/components/Lane/LaneFooter.jsx +++ b/client/src/components/production-board-kanban/trello-board/components/Lane/LaneFooter.jsx @@ -3,7 +3,9 @@ import { LaneFooter } from "../../styles/Base"; import { CollapseBtn, ExpandBtn } from "../../styles/Elements"; const LaneFooterComponent = ({ onClick, collapsed }) => ( - {collapsed ? : } + + {collapsed ? : } + ); export default LaneFooterComponent; diff --git a/client/src/components/production-board-kanban/trello-board/controllers/Lane.jsx b/client/src/components/production-board-kanban/trello-board/controllers/Lane.jsx index 153ea0629..633bae6c0 100644 --- a/client/src/components/production-board-kanban/trello-board/controllers/Lane.jsx +++ b/client/src/components/production-board-kanban/trello-board/controllers/Lane.jsx @@ -8,7 +8,7 @@ import { Virtuoso, VirtuosoGrid } from "react-virtuoso"; import HeightPreservingItem from "../components/Lane/HeightPreservingItem.jsx"; import { Section } from "../styles/Base.js"; import LaneFooter from "../components/Lane/LaneFooter.jsx"; -import { UnorderedListOutlined } from "@ant-design/icons"; +import { EyeOutlined, EyeInvisibleOutlined } from "@ant-design/icons"; import { createStructuredSelector } from "reselect"; import { selectBodyshop } from "../../../../redux/user/user.selectors.js"; import { selectTechnician } from "../../../../redux/tech/tech.selectors.js"; @@ -262,7 +262,10 @@ const Lane = ({ return (
- {title} + + {collapsed ? : } + {title} +
{renderDragContainer()} diff --git a/client/src/components/production-board-kanban/trello-board/styles/Base.js b/client/src/components/production-board-kanban/trello-board/styles/Base.js index 0c66a54fc..aa338588a 100644 --- a/client/src/components/production-board-kanban/trello-board/styles/Base.js +++ b/client/src/components/production-board-kanban/trello-board/styles/Base.js @@ -5,12 +5,10 @@ const getBoardWrapperStyles = (props) => { return ``; } if (props.orientation === "horizontal") { - // TODO: The white-space: nowrap; would be a good place to offer further customization return ` white-space: nowrap; `; } - return ""; }; const getSectionStyles = (props) => { @@ -64,7 +62,6 @@ export const StyleHorizontal = styled.div` } .react-trello-column-header { - border-radius: 5px; min-height: 15px; padding: 4px; white-space: nowrap; @@ -90,7 +87,6 @@ export const StyleHorizontal = styled.div` export const StyleVertical = styled.div` .react-trello-column-header { - border-radius: 5px; min-height: 15px; padding: 5px; white-space: nowrap; diff --git a/package-lock.json b/package-lock.json index 03441783c..c094d4b77 100644 --- a/package-lock.json +++ b/package-lock.json @@ -32,7 +32,7 @@ "graylog2": "^0.2.1", "inline-css": "^4.0.2", "intuit-oauth": "^4.1.2", - "json-2-csv": "^5.5.1", + "json-2-csv": "^5.5.4", "lodash": "^4.17.21", "moment": "^2.30.1", "moment-timezone": "^0.5.45", @@ -40,9 +40,9 @@ "node-mailjet": "^6.0.5", "node-persist": "^4.0.1", "nodemailer": "^6.9.14", - "phone": "^3.1.48", + "phone": "^3.1.49", "recursive-diff": "^1.0.9", - "rimraf": "^5.0.7", + "rimraf": "^6.0.0", "soap": "^1.0.4", "socket.io": "^4.7.5", "ssh2-sftp-client": "^10.0.3", @@ -3959,9 +3959,9 @@ } }, "node_modules/foreground-child": { - "version": "3.1.1", - "resolved": "https://registry.npmjs.org/foreground-child/-/foreground-child-3.1.1.tgz", - "integrity": "sha512-TMKDUnIte6bfb5nWv7V/caI169OHgvwjb7V4WkeUvbQQdjr5rWKqHFiKWb/fcOwB+CzBT+qbWjvj+DVwRskpIg==", + "version": "3.2.1", + "resolved": "https://registry.npmjs.org/foreground-child/-/foreground-child-3.2.1.tgz", + "integrity": "sha512-PXUUyLqrR2XCWICfv6ukppP96sdFwWbNEnfEMt7jNsISjMsvaLNinAHNDYyvkyU+SZG2BTSbT5NjG+vZslfGTA==", "dependencies": { "cross-spawn": "^7.0.0", "signal-exit": "^4.0.1" @@ -4184,6 +4184,42 @@ "node": ">= 6" } }, + "node_modules/glob": { + "version": "11.0.0", + "resolved": "https://registry.npmjs.org/glob/-/glob-11.0.0.tgz", + "integrity": "sha512-9UiX/Bl6J2yaBbxKoEBRm4Cipxgok8kQYcOPEhScPwebu2I0HoQOuYdIO6S3hLuWoZgpDpwQZMzTFxgpkyT76g==", + "dependencies": { + "foreground-child": "^3.1.0", + "jackspeak": "^4.0.1", + "minimatch": "^10.0.0", + "minipass": "^7.1.2", + "package-json-from-dist": "^1.0.0", + "path-scurry": "^2.0.0" + }, + "bin": { + "glob": "dist/esm/bin.mjs" + }, + "engines": { + "node": "20 || >=22" + }, + "funding": { + "url": "https://github.com/sponsors/isaacs" + } + }, + "node_modules/glob/node_modules/minimatch": { + "version": "10.0.1", + "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-10.0.1.tgz", + "integrity": "sha512-ethXTt3SGGR+95gudmqJ1eNhRO7eGEGIgYA9vnPatK4/etz2MEVDno5GMCibdMTuBMyElzIlgxMna3K94XDIDQ==", + "dependencies": { + "brace-expansion": "^2.0.1" + }, + "engines": { + "node": "20 || >=22" + }, + "funding": { + "url": "https://github.com/sponsors/isaacs" + } + }, "node_modules/globals": { "version": "11.12.0", "resolved": "https://registry.npmjs.org/globals/-/globals-11.12.0.tgz", @@ -4593,14 +4629,14 @@ "integrity": "sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==" }, "node_modules/jackspeak": { - "version": "2.3.6", - "resolved": "https://registry.npmjs.org/jackspeak/-/jackspeak-2.3.6.tgz", - "integrity": "sha512-N3yCS/NegsOBokc8GAdM8UcmfsKiSS8cipheD/nivzr700H+nsMOxJjQnvwOcRYVuFkdH0wGUvW2WbXGmrZGbQ==", + "version": "4.0.1", + "resolved": "https://registry.npmjs.org/jackspeak/-/jackspeak-4.0.1.tgz", + "integrity": "sha512-cub8rahkh0Q/bw1+GxP7aeSe29hHHn2V4m29nnDlvCdlgU+3UGxkZp7Z53jLUdpX3jdTO0nJZUDl3xvbWc2Xog==", "dependencies": { "@isaacs/cliui": "^8.0.2" }, "engines": { - "node": ">=14" + "node": "20 || >=22" }, "funding": { "url": "https://github.com/sponsors/isaacs" @@ -4707,9 +4743,9 @@ } }, "node_modules/json-2-csv": { - "version": "5.5.1", - "resolved": "https://registry.npmjs.org/json-2-csv/-/json-2-csv-5.5.1.tgz", - "integrity": "sha512-KgAtAXTQopRwe90gh8SgjRSxgt9bUWbGAPMo9W0TZLA8SqiQH7khtagFfeEUjG3NBPwJu/+9uX5pMvunKaPvrQ==", + "version": "5.5.4", + "resolved": "https://registry.npmjs.org/json-2-csv/-/json-2-csv-5.5.4.tgz", + "integrity": "sha512-gB24IF5SvZn7QhEh6kp9QwFhRnI3FVEEXAGyq0xtPxqOQ4odYU3PU9pFKRoR1SGABxunQlBP6VFv0c8EnLbsLQ==", "dependencies": { "deeks": "3.1.0", "doc-path": "4.1.1" @@ -5042,9 +5078,9 @@ } }, "node_modules/minipass": { - "version": "7.0.4", - "resolved": "https://registry.npmjs.org/minipass/-/minipass-7.0.4.tgz", - "integrity": "sha512-jYofLM5Dam9279rdkWzqHozUo4ybjdZmCsDHePy5V/PbBcVMiSZR97gmAy45aqi8CK1lG2ECd356FU86avfwUQ==", + "version": "7.1.2", + "resolved": "https://registry.npmjs.org/minipass/-/minipass-7.1.2.tgz", + "integrity": "sha512-qOOzS1cBTWYF4BH8fVePDBOO9iptMnGUEZwNc/cMWnTV2nVLZ7VoNWEPHkYczZA0pdoA7dl6e7FL659nX9S2aw==", "engines": { "node": ">=16 || 14 >=14.17" } @@ -5345,6 +5381,11 @@ "node": ">= 8" } }, + "node_modules/package-json-from-dist": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/package-json-from-dist/-/package-json-from-dist-1.0.0.tgz", + "integrity": "sha512-dATvCeZN/8wQsGywez1mzHtTlP22H8OEfPrVMLNr4/eGa+ijtLn/6M5f0dY8UKNrC2O9UCU6SSoG3qRKnt7STw==" + }, "node_modules/parse5": { "version": "7.1.2", "resolved": "https://registry.npmjs.org/parse5/-/parse5-7.1.2.tgz", @@ -5394,26 +5435,26 @@ } }, "node_modules/path-scurry": { - "version": "1.10.1", - "resolved": "https://registry.npmjs.org/path-scurry/-/path-scurry-1.10.1.tgz", - "integrity": "sha512-MkhCqzzBEpPvxxQ71Md0b1Kk51W01lrYvlMzSUaIzNsODdd7mqhiimSZlr+VegAz5Z6Vzt9Xg2ttE//XBhH3EQ==", + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/path-scurry/-/path-scurry-2.0.0.tgz", + "integrity": "sha512-ypGJsmGtdXUOeM5u93TyeIEfEhM6s+ljAhrk5vAvSx8uyY/02OvrZnA0YNGUrPXfpJMgI1ODd3nwz8Npx4O4cg==", "dependencies": { - "lru-cache": "^9.1.1 || ^10.0.0", - "minipass": "^5.0.0 || ^6.0.2 || ^7.0.0" + "lru-cache": "^11.0.0", + "minipass": "^7.1.2" }, "engines": { - "node": ">=16 || 14 >=14.17" + "node": "20 || >=22" }, "funding": { "url": "https://github.com/sponsors/isaacs" } }, "node_modules/path-scurry/node_modules/lru-cache": { - "version": "10.2.0", - "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-10.2.0.tgz", - "integrity": "sha512-2bIM8x+VAf6JT4bKAljS1qUWgMsqZRPGJS6FSahIMPVvctcNhyVp7AJu7quxOW9jwkryBReKZY5tY5JYv2n/7Q==", + "version": "11.0.0", + "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-11.0.0.tgz", + "integrity": "sha512-Qv32eSV1RSCfhY3fpPE2GNZ8jgM9X7rdAfemLWqTUxwiyIC4jJ6Sy0fZ8H+oLWevO6i4/bizg7c8d8i6bxrzbA==", "engines": { - "node": "14 || >=16.14" + "node": "20 || >=22" } }, "node_modules/path-to-regexp": { @@ -5422,9 +5463,9 @@ "integrity": "sha512-5DFkuoqlv1uYQKxy8omFBeJPQcdoE07Kv2sferDCrAq1ohOU+MSDswDIbnx3YAM60qIOnYa53wBhXW0EbMonrQ==" }, "node_modules/phone": { - "version": "3.1.48", - "resolved": "https://registry.npmjs.org/phone/-/phone-3.1.48.tgz", - "integrity": "sha512-/yJHHnRkJUwzsOJFrflKyDonacyun5VvUu1ybTSTJv1+dRItjkRNeSL3m8XHmvhsDX9I4i4gtZPZESMFhuy73Q==", + "version": "3.1.49", + "resolved": "https://registry.npmjs.org/phone/-/phone-3.1.49.tgz", + "integrity": "sha512-S+rHWXSQrllK5eQwz0sDbwfxQ2PzennWPgsP/jdpEPH3k7P5IBJZYjvYfU8e/RF5AwKCgOtzbTGTGJcBSLJVVw==", "engines": { "node": ">=12" } @@ -5721,52 +5762,17 @@ } }, "node_modules/rimraf": { - "version": "5.0.7", - "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-5.0.7.tgz", - "integrity": "sha512-nV6YcJo5wbLW77m+8KjH8aB/7/rxQy9SZ0HY5shnwULfS+9nmTtVXAJET5NdZmCzA4fPI/Hm1wo/Po/4mopOdg==", + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-6.0.0.tgz", + "integrity": "sha512-u+yqhM92LW+89cxUQK0SRyvXYQmyuKHx0jkx4W7KfwLGLqJnQM5031Uv1trE4gB9XEXBM/s6MxKlfW95IidqaA==", "dependencies": { - "glob": "^10.3.7" + "glob": "^11.0.0" }, "bin": { "rimraf": "dist/esm/bin.mjs" }, "engines": { - "node": ">=14.18" - }, - "funding": { - "url": "https://github.com/sponsors/isaacs" - } - }, - "node_modules/rimraf/node_modules/glob": { - "version": "10.3.10", - "resolved": "https://registry.npmjs.org/glob/-/glob-10.3.10.tgz", - "integrity": "sha512-fa46+tv1Ak0UPK1TOy/pZrIybNNt4HCv7SDzwyfiOZkvZLEbjsZkJBPtDHVshZjbecAoAGSC20MjLDG/qr679g==", - "dependencies": { - "foreground-child": "^3.1.0", - "jackspeak": "^2.3.5", - "minimatch": "^9.0.1", - "minipass": "^5.0.0 || ^6.0.2 || ^7.0.0", - "path-scurry": "^1.10.1" - }, - "bin": { - "glob": "dist/esm/bin.mjs" - }, - "engines": { - "node": ">=16 || 14 >=14.17" - }, - "funding": { - "url": "https://github.com/sponsors/isaacs" - } - }, - "node_modules/rimraf/node_modules/minimatch": { - "version": "9.0.3", - "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.3.tgz", - "integrity": "sha512-RHiac9mvaRw0x3AYRgDC1CxAP7HTcNrrECeA8YYJeWnpo+2Q5CegtZjaotWTWxDG3UeGA1coE05iH1mPjT/2mg==", - "dependencies": { - "brace-expansion": "^2.0.1" - }, - "engines": { - "node": ">=16 || 14 >=14.17" + "node": "20 || >=22" }, "funding": { "url": "https://github.com/sponsors/isaacs" diff --git a/package.json b/package.json index 5c6ae5542..d0fa9fdf4 100644 --- a/package.json +++ b/package.json @@ -42,7 +42,7 @@ "graylog2": "^0.2.1", "inline-css": "^4.0.2", "intuit-oauth": "^4.1.2", - "json-2-csv": "^5.5.1", + "json-2-csv": "^5.5.4", "lodash": "^4.17.21", "moment": "^2.30.1", "moment-timezone": "^0.5.45", @@ -50,9 +50,9 @@ "node-mailjet": "^6.0.5", "node-persist": "^4.0.1", "nodemailer": "^6.9.14", - "phone": "^3.1.48", + "phone": "^3.1.49", "recursive-diff": "^1.0.9", - "rimraf": "^5.0.7", + "rimraf": "^6.0.0", "soap": "^1.0.4", "socket.io": "^4.7.5", "ssh2-sftp-client": "^10.0.3",