@pega/react-sdk-overrides 0.24.3 → 0.24.4

package/lib/field/Phone/Phone.tsx

@@ -1,7 +1,9 @@
 import MuiPhoneNumber from 'material-ui-phone-number';
+import { useEffect, useState } from 'react';
 
 import { getComponentFromMap } from '@pega/react-sdk-components/lib/bridge/helpers/sdk_component_map';
 import { PConnFieldProps } from '@pega/react-sdk-components/lib/types/PConnProps';
+import handleEvent from '@pega/react-sdk-components/lib/components/helpers/event-utils';
 
 interface PhoneProps extends PConnFieldProps {
   // If any, enter additional props that only exist on Phone here
@@ -12,6 +14,7 @@ export default function Phone(props: PhoneProps) {
   const FieldValueList = getComponentFromMap('FieldValueList');
 
   const {
+    getPConnect,
     label,
     required,
     disabled,
@@ -19,7 +22,6 @@ export default function Phone(props: PhoneProps) {
     validatemessage,
     status,
     onChange,
-    onBlur,
     readOnly,
     testId,
     helperText,
@@ -27,6 +29,14 @@ export default function Phone(props: PhoneProps) {
     hideLabel,
     placeholder
   } = props;
+
+  const pConn = getPConnect();
+  const actions = pConn.getActionsApi();
+  const propName = (pConn.getStateProps() as any).value;
+
+  const [inputValue, setInputValue] = useState(value);
+  useEffect(() => setInputValue(value), [value]);
+
   const helperTextToDisplay = validatemessage || helperText;
 
   let testProp = {};
@@ -69,15 +79,14 @@ export default function Phone(props: PhoneProps) {
   }
 
   const handleChange = inputVal => {
-    let phoneValue = inputVal && inputVal.replace(/\D+/g, '');
-    phoneValue = `+${phoneValue}`;
-    onChange({ value: phoneValue });
+    setInputValue(inputVal);
   };
 
   const handleBlur = event => {
     const phoneValue = event?.target?.value;
-    event.target.value = `+${phoneValue && phoneValue.replace(/\D+/g, '')}`;
-    onBlur(event);
+    let phoneNumber = phoneValue.split(' ').slice(1).join();
+    phoneNumber = phoneNumber ? `+${phoneValue && phoneValue.replace(/\D+/g, '')}` : '';
+    handleEvent(actions, 'changeNblur', propName, phoneNumber);
   };
 
   return (
@@ -94,7 +103,7 @@ export default function Phone(props: PhoneProps) {
       onBlur={!readOnly ? handleBlur : undefined}
       error={status === 'error'}
       label={label}
-      value={value}
+      value={inputValue}
       InputProps={{ ...testProp }}
     />
   );

package/lib/infra/Assignment/Assignment.tsx

@@ -41,6 +41,8 @@ export default function Assignment(props: PropsWithChildren<AssignmentProps>) {
   const cancelAssignment = actionsAPI.cancelAssignment.bind(actionsAPI);
   const saveAssignment = actionsAPI.saveAssignment?.bind(actionsAPI);
   const cancelCreateStageAssignment = actionsAPI.cancelCreateStageAssignment.bind(actionsAPI);
+  const approveCase = actionsAPI.approveCase?.bind(actionsAPI);
+  const rejectCase = actionsAPI.rejectCase?.bind(actionsAPI);
   // const showPage = actionsAPI.showPage.bind(actionsAPI);
 
   const [showSnackbar, setShowSnackbar] = useState(false);
@@ -212,6 +214,18 @@ export default function Assignment(props: PropsWithChildren<AssignmentProps>) {
           break;
         }
 
+        case 'rejectCase': {
+          const rejectPromise = rejectCase(itemKey);
+
+          rejectPromise
+            .then(() => {})
+            .catch(() => {
+              showToast(`${localizedVal('Rejection failed!', localeCategory)}`);
+            });
+
+          break;
+        }
+
         default:
           break;
       }
@@ -230,6 +244,18 @@ export default function Assignment(props: PropsWithChildren<AssignmentProps>) {
           break;
         }
 
+        case 'approveCase': {
+          const approvePromise = approveCase(itemKey);
+
+          approvePromise
+            .then(() => {})
+            .catch(() => {
+              showToast(`${localizedVal('Approve failed!', localeCategory)}`);
+            });
+
+          break;
+        }
+
         default:
           break;
       }

package/lib/template/ListView/ListView.tsx

@@ -65,7 +65,6 @@ interface ListViewProps extends PConnProps {
 const SELECTION_MODE = { SINGLE: 'single', MULTI: 'multi' };
 
 let myRows: any[];
-let myDisplayColumnList: any[];
 
 let menuColumnId = '';
 let menuColumnType = '';
@@ -119,6 +118,7 @@ export default function ListView(props: ListViewProps) {
   const rowID = compositeKeys && compositeKeys?.length === 1 ? compositeKeys[0] : defRowID;
 
   const [arRows, setRows] = useState<any[]>([]);
+  const [rowsData, setRowsData] = useState<any[]>([]);
   const [arColumns, setColumns] = useState<any[]>([]);
   const [response, setResponse] = useState<any[]>([]);
 
@@ -291,16 +291,6 @@ export default function ListView(props: ListViewProps) {
     });
   }
 
-  function getMyColumnList(arCols: any[]): string[] {
-    const myColList: string[] = [];
-
-    arCols.forEach(col => {
-      myColList.push(col.id);
-    });
-
-    return myColList;
-  }
-
   /** Will return field from a filter expression */
   function getFieldFromFilter(filter, dateRange = false) {
     let fieldValue;
@@ -543,8 +533,8 @@ export default function ListView(props: ListViewProps) {
 
     // store globally, so can be searched, filtered, etc.
     myRows = usingDataResults;
-    myDisplayColumnList = getMyColumnList(myColumns);
 
+    setRowsData(myRows);
     // At this point, if we have data ready to render and haven't been asked
     //  to NOT call setRows and setColumns, call them
     if (bCallSetRowsColumns) {
@@ -604,24 +594,22 @@ export default function ListView(props: ListViewProps) {
   }, [listContext]);
 
   function searchFilter(value: string, rows: any[]) {
+    const cols = arColumns.map(ele => {
+      return ele.id;
+    });
+
     function filterArray(el: any): boolean {
-      const bReturn = false;
-      for (const key of Object.keys(el)) {
-        // only search columsn that are displayed (pzInsKey and pxRefObjectClass are added and may or may not be displayed)
-        if (myDisplayColumnList.includes(key)) {
-          let myVal = el[key];
-          if (myVal !== null) {
-            if (typeof myVal !== 'string') {
-              myVal = myVal.toString();
-            }
-            if (myVal.toLowerCase().indexOf(value.toLowerCase()) >= 0) {
-              return true;
-            }
+      return Object.keys(el).some(key => {
+        // only search columns that are displayed (pzInsKey and pxRefObjectClass are added and may or may not be displayed)
+        if (cols.includes(key)) {
+          const myVal = el[key];
+          if (myVal !== null && typeof myVal !== 'undefined') {
+            const strVal = String(myVal); // Ensure myVal is a string
+            return strVal.toLowerCase().includes(value.toLowerCase());
           }
         }
-      }
-
-      return bReturn;
+        return false;
+      });
     }
 
     rows = rows.filter(filterArray);
@@ -631,8 +619,7 @@ export default function ListView(props: ListViewProps) {
 
   function _onSearch(event: any) {
     const searchValue = event.target.value;
-
-    const filteredRows = searchFilter(searchValue, myRows.slice());
+    const filteredRows = searchFilter(searchValue, rowsData?.slice());
 
     setRows(filteredRows);
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pega/react-sdk-overrides",
-  "version": "0.24.3",
+  "version": "0.24.4",
   "description": "React SDK - Code for overriding components",
   "_filesComment": "During packing, npm ignores everything NOT in the files list",
   "files": [