- Enhanced ActionableButton component to display the action name in the modal title

- Fixed AutoSave component to correctly structure payload body content.

Author: ricmars

package-lock.json

@@ -58,26 +58,26 @@
     "validateAll": "custom-dx-components buildAllComponents"
   },
   "dependencies": {
-    "@arcgis/core": "^4.32.10",
-    "@dagrejs/dagre": "^1.1.4",
+    "@arcgis/core": "^4.33.2",
+    "@dagrejs/dagre": "^1.1.5",
     "@fullcalendar/core": "^6.1.17",
     "@fullcalendar/daygrid": "^6.1.17",
     "@fullcalendar/react": "^6.1.17",
     "@fullcalendar/timegrid": "^6.1.17",
     "@hello-pangea/dnd": "^16.6.0",
-    "@pega/cosmos-react-core": "^7.8.0",
-    "@pega/cosmos-react-rte": "^7.8.0",
-    "@pega/cosmos-react-social": "^7.8.0",
-    "@pega/cosmos-react-work": "^7.8.0",
+    "@pega/cosmos-react-core": "^7.10.0",
+    "@pega/cosmos-react-rte": "^7.10.0",
+    "@pega/cosmos-react-social": "^7.10.0",
+    "@pega/cosmos-react-work": "^7.10.0",
     "gantt-task-react": "^0.3.9",
     "imask": "^7.6.1",
-    "jsbarcode": "^3.11.6",
+    "jsbarcode": "^3.12.1",
     "polished": "^4.3.1",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
     "react-image-magnifiers": "^1.4.0",
     "reactflow": "^11.11.4",
-    "signature_pad": "^5.0.9",
+    "signature_pad": "^5.0.10",
     "styled-components": "^5.3.11"
   },
   "devDependencies": {
@@ -104,24 +104,24 @@
     "@types/react-image-magnifiers": "^1.3.5",
     "@types/styled-components": "^5.1.34",
     "axe-playwright": "^2.1.0",
-    "cspell": "^9.0.2",
+    "cspell": "^9.1.2",
     "eslint": "^8.57.0",
-    "eslint-plugin-import": "^2.31.0",
-    "eslint-plugin-jest": "^28.13.0",
+    "eslint-plugin-import": "^2.32.0",
+    "eslint-plugin-jest": "^29.0.1",
     "eslint-plugin-jsx-a11y": "^6.10.2",
-    "eslint-plugin-mdx": "^3.4.2",
-    "eslint-plugin-prettier": "^5.4.1",
+    "eslint-plugin-mdx": "^3.5.0",
+    "eslint-plugin-prettier": "^5.5.1",
     "eslint-plugin-react": "^7.37.5",
     "eslint-plugin-react-hooks": "^5.2.0",
-    "jest": "^29.7.0",
+    "jest": "^30.0.3",
     "jest-canvas-mock": "^2.5.2",
-    "jest-environment-jsdom": "^30.0.0",
+    "jest-environment-jsdom": "^30.0.2",
     "npm-run-all": "^4.1.5",
-    "prettier": "^3.5.3",
-    "sort-package-json": "^3.2.1",
+    "prettier": "^3.6.1",
+    "sort-package-json": "^3.3.1",
     "storybook": "^7.6.19",
-    "stylelint": "16.20.0",
-    "ts-jest": "^29.3.4",
+    "stylelint": "16.21.0",
+    "ts-jest": "^29.4.0",
     "typescript": "^5.8.3"
   },
   "organization": "Pega"

package.json

@@ -20,6 +20,13 @@ const setPCore = () => {
         getLazyComponent: (f: string) => f
       };
     },
+    getConstants: () => {
+      return {
+        CASE_INFO: {
+          AVAILABLEACTIONS: ''
+        }
+      };
+    },
     getEnvironmentInfo: () => {
       return {
         getTimeZone: () => 'local'
@@ -42,12 +49,15 @@ export const Default: Story = {
               value: 'C-123'
             };
           },
+          getValue: () => [{ ID: 'pyEditDetails', name: 'Edit Details' }],
           getActionsApi: () => {
             return {
               openLocalAction: {
                 bind: () => {
                   return (name: string, options: any) => {
-                    alert(`Launch local action ${name} for ${options.caseID}`);
+                    alert(
+                      `Launch local action ID '${name}' with title '${options.name}' for ${options.caseID}`
+                    );
                   };
                 }
               }

src/components/Pega_Extensions_ActionableButton/demo.stories.tsx

@@ -11,13 +11,20 @@ type ActionableButtonProps = {
 export const PegaExtensionsActionableButton = (props: ActionableButtonProps) => {
   const { getPConnect, label, value, localAction } = props;
   if (value && localAction) {
+    const availableActions =
+      getPConnect().getValue((window as any).PCore.getConstants().CASE_INFO.AVAILABLEACTIONS) || [];
+    const targetAction = availableActions.find(
+      (action: { ID: string }) => action.ID === localAction
+    );
+    const actionName = targetAction?.name || label;
     const LaunchLocalAction = () => {
       const actionsAPI = getPConnect().getActionsApi();
       const openLocalAction = actionsAPI.openLocalAction.bind(actionsAPI);
       openLocalAction(localAction, {
         caseID: value,
         containerName: 'modal',
-        type: 'express'
+        type: 'express',
+        name: actionName
       });
     };
     return (

src/components/Pega_Extensions_ActionableButton/index.tsx

@@ -32,16 +32,16 @@ export const PegaExtensionsAutoSave = (props: AutoSaveProps) => {
           actionID
         },
         body: {
-          content: {
-            /* Property or field name */
-            pyDescription: pConn.getValue(propertyName)
-          }
+          content: {} as Record<string, any>
         },
         headers: {
           /* etag as part of header */
           'if-match': etag
         }
       };
+      const lastSeparator = propertyName.lastIndexOf('.');
+      payload.body.content[propertyName.substring(lastSeparator + 1)] =
+        pConn.getValue(propertyName);
 
       /* Triggers save dx api */
       (window as any).PCore.getRestClient()

src/components/Pega_Extensions_AutoSave/index.ts

@@ -19,7 +19,6 @@ The component support the following features:
 - Click on any item to see a DetailsCard view. This view can be configured via a combination of props `detailsDataPage` and `detailsViewName`.
 - Ability to edit an item from timeline, just click the item and open the details card popup. It has a Edit button in header (pencil icon).
 - Double click on any item enables the drag mode editing. Items can be dragged with multiple drag behaviors, each for distinct purpose
-
   - Drag complete item. This changes the Start and End date for the items without changing the relative duration. All three types of items implements this behavior
   - Two Drag handles are available on item edges, each for modifying the Start or End date respectively. This changes the duration of the task. Only Tasks has this behavior. Project and Milestones doesn't support this.
   - An arrow like handle appears on the item to drag and update the completion progress of the item. Only Task item type supports this.

src/components/Pega_Extensions_GanttChart/Docs.mdx

@@ -116,9 +116,7 @@
       "name": "A",
       "label": "Region A",
       "format": "CONTENTPICKER",
-      "addTypeList": [
-        "Fields"
-      ]
+      "addTypeList": ["Fields"]
     }
   ],
   "defaultConfig": {

src/components/Pega_Extensions_Map/config.json

@@ -25,7 +25,7 @@ import {
 } from './utils';
 import '../create-nonce';
 
-const ARCGIS_VERSION = '4.32';
+const ARCGIS_VERSION = '4.33';
 type MapProps = {
   getPConnect?: any;
   heading?: string;