From 9b3a094907fb32cab28cbe3ee11e4c6fc98fe223 Mon Sep 17 00:00:00 2001 From: tumms2021389 <97188066+tumms2021389@users.noreply.github.com> Date: Thu, 5 Sep 2024 13:33:03 +0530 Subject: [PATCH] Fix for breaking changes with 24.2 (#385) --- package-lock.json | 101 +++++++++++++++--- package.json | 10 +- .../infra/RootContainer/RootContainer.tsx | 6 +- .../components/template/AppShell/AppShell.tsx | 19 ++++ .../src/components/widget/ToDo/ToDo.tsx | 85 +++++++++++++-- webpack.config.js | 58 +++++----- 6 files changed, 221 insertions(+), 58 deletions(-) diff --git a/package-lock.json b/package-lock.json index 9dc435ac..9ac4533f 100644 --- a/package-lock.json +++ b/package-lock.json @@ -15,6 +15,7 @@ "@material-ui/lab": "^4.0.0-alpha.60", "@material-ui/pickers": "^3.3.10", "@pega/auth": "^0.2.14", + "@pega/constellationjs": "^0.242.3", "@tinymce/tinymce-react": "^4.3.2", "@types/react": "^17.0.74", "dayjs": "^1.11.10", @@ -36,7 +37,6 @@ "@pega/commitlint-config": "^0.7.1", "@pega/commitlint-plugin": "^0.7.1", "@pega/configs": "^0.7.1", - "@pega/constellationjs": "24.1.0", "@pega/cspell-config": "^0.7.1", "@pega/eslint-config": "^0.7.1", "@pega/pcore-pconnect-typedefs": "~3.0.0", @@ -3228,10 +3228,12 @@ } }, "node_modules/@pega/constellationjs": { - "version": "24.1.0", - "resolved": "https://registry.npmjs.org/@pega/constellationjs/-/constellationjs-24.1.0.tgz", - "integrity": "sha512-uWo81h+sQWScU/1wqVPiaXc+gLZDeVwas1Y4Ng/1yCl6M3q8EzVCZ0MA6asgGswdTfzbSD681QKv/u4T6Fxctg==", - "dev": true + "version": "0.242.3", + "resolved": "https://registry.npmjs.org/@pega/constellationjs/-/constellationjs-0.242.3.tgz", + "integrity": "sha512-t6NIafCXoHkIxtsLdKRji6CBJO1Ja9ioTidX5qxk7nlXoXeBztY0La8k42iaB2NH0s+9GGn1QxQYrWl2crb9Zg==", + "dependencies": { + "fs-extra": "^11.2.0" + } }, "node_modules/@pega/cspell-config": { "version": "0.7.2", @@ -9265,6 +9267,27 @@ "node": ">= 0.6" } }, + "node_modules/fs-extra": { + "version": "11.2.0", + "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-11.2.0.tgz", + "integrity": "sha512-PmDi3uwK5nFuXh7XDTlVnS17xJS7vW36is2+w3xcv8SVxiB4NyATf4ctkVY5bkSjX0Y4nbvZCq1/EjtEyr9ktw==", + "dependencies": { + "graceful-fs": "^4.2.0", + "jsonfile": "^6.0.1", + "universalify": "^2.0.0" + }, + "engines": { + "node": ">=14.14" + } + }, + "node_modules/fs-extra/node_modules/universalify": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/universalify/-/universalify-2.0.1.tgz", + "integrity": "sha512-gptHNQghINnc/vTGIk0SOFGFNXw7JVrlRUtConJRlvaw6DuX0wO5Jeko9sWrMBhh+PsYAZ7oXAiOnf/UKogyiw==", + "engines": { + "node": ">= 10.0.0" + } + }, "node_modules/fs-monkey": { "version": "1.0.6", "resolved": "https://registry.npmjs.org/fs-monkey/-/fs-monkey-1.0.6.tgz", @@ -9759,8 +9782,7 @@ "node_modules/graceful-fs": { "version": "4.2.11", "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.11.tgz", - "integrity": "sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==", - "dev": true + "integrity": "sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==" }, "node_modules/graphemer": { "version": "1.4.0", @@ -12687,6 +12709,25 @@ "node": ">=6" } }, + "node_modules/jsonfile": { + "version": "6.1.0", + "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz", + "integrity": "sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==", + "dependencies": { + "universalify": "^2.0.0" + }, + "optionalDependencies": { + "graceful-fs": "^4.1.6" + } + }, + "node_modules/jsonfile/node_modules/universalify": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/universalify/-/universalify-2.0.1.tgz", + "integrity": "sha512-gptHNQghINnc/vTGIk0SOFGFNXw7JVrlRUtConJRlvaw6DuX0wO5Jeko9sWrMBhh+PsYAZ7oXAiOnf/UKogyiw==", + "engines": { + "node": ">= 10.0.0" + } + }, "node_modules/jsonparse": { "version": "1.3.1", "resolved": "https://registry.npmjs.org/jsonparse/-/jsonparse-1.3.1.tgz", @@ -21299,10 +21340,12 @@ } }, "@pega/constellationjs": { - "version": "24.1.0", - "resolved": "https://registry.npmjs.org/@pega/constellationjs/-/constellationjs-24.1.0.tgz", - "integrity": "sha512-uWo81h+sQWScU/1wqVPiaXc+gLZDeVwas1Y4Ng/1yCl6M3q8EzVCZ0MA6asgGswdTfzbSD681QKv/u4T6Fxctg==", - "dev": true + "version": "0.242.3", + "resolved": "https://registry.npmjs.org/@pega/constellationjs/-/constellationjs-0.242.3.tgz", + "integrity": "sha512-t6NIafCXoHkIxtsLdKRji6CBJO1Ja9ioTidX5qxk7nlXoXeBztY0La8k42iaB2NH0s+9GGn1QxQYrWl2crb9Zg==", + "requires": { + "fs-extra": "^11.2.0" + } }, "@pega/cspell-config": { "version": "0.7.2", @@ -25890,6 +25933,23 @@ "integrity": "sha512-zJ2mQYM18rEFOudeV4GShTGIQ7RbzA7ozbU9I/XBpm7kqgMywgmylMwXHxZJmkVoYkna9d2pVXVXPdYTP9ej8Q==", "dev": true }, + "fs-extra": { + "version": "11.2.0", + "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-11.2.0.tgz", + "integrity": "sha512-PmDi3uwK5nFuXh7XDTlVnS17xJS7vW36is2+w3xcv8SVxiB4NyATf4ctkVY5bkSjX0Y4nbvZCq1/EjtEyr9ktw==", + "requires": { + "graceful-fs": "^4.2.0", + "jsonfile": "^6.0.1", + "universalify": "^2.0.0" + }, + "dependencies": { + "universalify": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/universalify/-/universalify-2.0.1.tgz", + "integrity": "sha512-gptHNQghINnc/vTGIk0SOFGFNXw7JVrlRUtConJRlvaw6DuX0wO5Jeko9sWrMBhh+PsYAZ7oXAiOnf/UKogyiw==" + } + } + }, "fs-monkey": { "version": "1.0.6", "resolved": "https://registry.npmjs.org/fs-monkey/-/fs-monkey-1.0.6.tgz", @@ -26253,8 +26313,7 @@ "graceful-fs": { "version": "4.2.11", "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.11.tgz", - "integrity": "sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==", - "dev": true + "integrity": "sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==" }, "graphemer": { "version": "1.4.0", @@ -28419,6 +28478,22 @@ "integrity": "sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg==", "dev": true }, + "jsonfile": { + "version": "6.1.0", + "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz", + "integrity": "sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==", + "requires": { + "graceful-fs": "^4.1.6", + "universalify": "^2.0.0" + }, + "dependencies": { + "universalify": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/universalify/-/universalify-2.0.1.tgz", + "integrity": "sha512-gptHNQghINnc/vTGIk0SOFGFNXw7JVrlRUtConJRlvaw6DuX0wO5Jeko9sWrMBhh+PsYAZ7oXAiOnf/UKogyiw==" + } + } + }, "jsonparse": { "version": "1.3.1", "resolved": "https://registry.npmjs.org/jsonparse/-/jsonparse-1.3.1.tgz", diff --git a/package.json b/package.json index 351c6640..9686b020 100644 --- a/package.json +++ b/package.json @@ -35,10 +35,10 @@ "build:dev:ci": "npm run ci && npm run build:dev", "build:prod": "run-p -l lint build-prod-only", "build:prod:ci": "npm run ci && npm run build:prod", - "start-dev": "webpack serve", - "start-dev-https": "webpack serve --https", - "start-prod": "http-server ./dist --port 3502 --gzip --brotli --cors --proxy http://localhost:3502?", - "start-prod-https": "http-server ./dist --port 3502 --gzip --brotli --cors --ssl --cert private.pem --key private.key --proxy https://localhost:3502?", + "start-dev": "webpack serve --mode='development'", + "start-dev-https": "webpack serve --server-type https --mode='development'", + "start-prod": "http-server ./dist --port 3502 --ext html -c-1 --gzip --brotli --cors --proxy http://localhost:3502?", + "start-prod-https": "http-server ./dist --port 3502 --ext html -c-1 --gzip --brotli --cors --ssl --cert private.pem --key private.key --proxy https://localhost:3502?", "test": "node scripts/playwright-message.js && playwright test --project=chromium MediaCo/portal MediaCo/embedded", "test:headed": "playwright test --headed --project=chromium MediaCo/portal MediaCo/embedded", "test-report": "playwright show-report tests/playwright-report", @@ -54,6 +54,7 @@ "@material-ui/lab": "^4.0.0-alpha.60", "@material-ui/pickers": "^3.3.10", "@pega/auth": "^0.2.14", + "@pega/constellationjs": "^0.242.3", "@tinymce/tinymce-react": "^4.3.2", "@types/react": "^17.0.74", "dayjs": "^1.11.10", @@ -75,7 +76,6 @@ "@pega/commitlint-config": "^0.7.1", "@pega/commitlint-plugin": "^0.7.1", "@pega/configs": "^0.7.1", - "@pega/constellationjs": "24.1.0", "@pega/cspell-config": "^0.7.1", "@pega/eslint-config": "^0.7.1", "@pega/pcore-pconnect-typedefs": "~3.0.0", diff --git a/packages/react-sdk-components/src/components/infra/RootContainer/RootContainer.tsx b/packages/react-sdk-components/src/components/infra/RootContainer/RootContainer.tsx index 03464ecf..825662b5 100644 --- a/packages/react-sdk-components/src/components/infra/RootContainer/RootContainer.tsx +++ b/packages/react-sdk-components/src/components/infra/RootContainer/RootContainer.tsx @@ -54,6 +54,7 @@ export default function RootContainer(props: PropsWithChildren { @@ -181,7 +181,7 @@ export default function RootContainer(props: PropsWithChildren - {rootView} + {rootView.current} {MemoizedModalViewContainer}
diff --git a/packages/react-sdk-components/src/components/template/AppShell/AppShell.tsx b/packages/react-sdk-components/src/components/template/AppShell/AppShell.tsx index cde8a6d4..4ac0d12f 100644 --- a/packages/react-sdk-components/src/components/template/AppShell/AppShell.tsx +++ b/packages/react-sdk-components/src/components/template/AppShell/AppShell.tsx @@ -92,6 +92,25 @@ export default function AppShell(props: PropsWithChildren) { setMapChildren(tempMap); }, []); + useEffect(() => { + // @ts-ignore + const caseTypesAvailableToCreateDP = PCore.getEnvironmentInfo().environmentInfoObject?.pxApplication?.pyCaseTypesAvailableToCreateDP; + if (caseTypesAvailableToCreateDP) { + const portalID = pConn.getValue('.pyOwner'); + PCore.getDataPageUtils() + .getPageDataAsync(caseTypesAvailableToCreateDP, pConn.getContextName(), { + PortalName: portalID + }) + .then(response => { + if (response?.pyCaseTypesAvailableToCreate) { + pConn.replaceState('.pyCaseTypesAvailableToCreate', response.pyCaseTypesAvailableToCreate, { + skipDirtyValidation: true + }); + } + }); + } + }, []); + const [iconURL, setIconURL] = useState(''); const [fullIconURL, setFullIconURL] = useState(''); useEffect(() => { diff --git a/packages/react-sdk-components/src/components/widget/ToDo/ToDo.tsx b/packages/react-sdk-components/src/components/widget/ToDo/ToDo.tsx index 09d6571e..3340c4c0 100644 --- a/packages/react-sdk-components/src/components/widget/ToDo/ToDo.tsx +++ b/packages/react-sdk-components/src/components/widget/ToDo/ToDo.tsx @@ -1,5 +1,5 @@ /* eslint-disable @typescript-eslint/no-shadow */ -import React, { useState } from 'react'; +import React, { useCallback, useEffect, useState } from 'react'; import { Box, Button, @@ -26,6 +26,38 @@ import { PConnProps } from '../../../types/PConnProps'; import './ToDo.css'; +const fetchMyWorkList = (datapage, fields, numberOfRecords, includeTotalCount, context) => { + return PCore.getDataPageUtils() + .getDataAsync( + datapage, + context, + {}, + { + pageNumber: 1, + pageSize: numberOfRecords + }, + { + select: Object.keys(fields).map(key => ({ field: PCore.getAnnotationUtils().getPropertyName(fields[key]) })) + }, + { + additionalApiParams: { + includeTotalCount + } + } + ) + .then(response => { + return { + ...response, + data: (Array.isArray(response?.data) ? response.data : []).map(row => + Object.keys(fields).reduce((obj, key) => { + obj[key] = row[PCore.getAnnotationUtils().getPropertyName(fields[key])]; + return obj; + }, {}) + ) + }; + }); +}; + interface ToDoProps extends PConnProps { // If any, enter additional props that only exist on this component datasource?: any; @@ -37,7 +69,7 @@ interface ToDoProps extends PConnProps { itemKey?: string; showTodoList?: boolean; type?: string; - // eslint-disable-next-line react/no-unused-prop-types + context?: string; isConfirm?: boolean; } @@ -81,12 +113,20 @@ const useStyles = makeStyles(theme => ({ })); export default function ToDo(props: ToDoProps) { - const { getPConnect, datasource = [], headerText = 'To do', showTodoList = true, myWorkList = {}, type = 'worklist', isConfirm = false } = props; + const { + getPConnect, + context, + datasource = [], + headerText = 'To do', + showTodoList = true, + myWorkList = {}, + type = 'worklist', + isConfirm = false + } = props; const CONSTS = PCore.getConstants(); const bLogging = true; - let assignmentCount = 0; const currentUser = PCore.getEnvironmentInfo().getOperatorName(); const currentUserInitials = Utils.getInitials(currentUser); const assignmentsSource = datasource?.source || myWorkList?.source; @@ -106,17 +146,34 @@ export default function ToDo(props: ToDoProps) { const showlessLocalizedValue = localizedVal('show_less', 'CosmosFields'); const showMoreLocalizedValue = localizedVal('show_more', 'CosmosFields'); const canPerform = assignments?.[0]?.canPerform === 'true' || assignments?.[0]?.canPerform === true; - // const { setOpen } = useNavBar(); + const [count, setCount] = useState(null); + + const { + WORK_BASKET: { MY_WORK_LIST } + } = PCore.getConstants(); function initAssignments(): any[] { if (assignmentsSource) { - assignmentCount = assignmentsSource.length; return topThreeAssignments(assignmentsSource); } // turn off todolist return []; } + const deferLoadWorklistItems = useCallback( + responseData => { + setCount(responseData.totalCount); + setAssignments(responseData.data); + }, + [MY_WORK_LIST] + ); + + useEffect(() => { + fetchMyWorkList(myWorkList.datapage, getPConnect().getComponentConfig()?.myWorkList.fields, 3, true, context).then(responseData => { + deferLoadWorklistItems(responseData); + }); + }, []); + const getAssignmentId = assignment => { return type === CONSTS.TODO ? assignment.ID : assignment.id; }; @@ -146,12 +203,16 @@ export default function ToDo(props: ToDoProps) { function _showMore() { setBShowMore(false); - setAssignments(assignmentsSource); + if (type === CONSTS.WORKLIST && count && count > assignments.length) { + fetchMyWorkList(myWorkList.datapage, getPConnect().getComponentConfig()?.myWorkList.fields, count, false, context).then(response => { + setAssignments(response.data); + }); + } } function _showLess() { setBShowMore(true); - setAssignments(topThreeAssignments(assignmentsSource)); + setAssignments(assignments => assignments.slice(0, 3)); } function clickGo(assignment) { @@ -223,12 +284,14 @@ export default function ToDo(props: ToDoProps) { ); }; + const getCount = () => (type === CONSTS.WORKLIST ? count ?? assignments.length : assignments.length); + const toDoContent = ( <> {showTodoList && ( + {headerText}    } @@ -267,7 +330,7 @@ export default function ToDo(props: ToDoProps) { {showTodoList && ( + {headerText}    } @@ -294,7 +357,7 @@ export default function ToDo(props: ToDoProps) { {type === CONSTS.TODO && !isConfirm && {toDoContent}} {type === CONSTS.TODO && isConfirm && <>{toDoContent}} - {assignmentCount > 3 && ( + {getCount() > 3 && ( {bShowMore ? (