@pega/react-sdk-overrides 24.2.10 → 24.2.11

package/lib/infra/DeferLoad/DeferLoad.tsx

@@ -12,6 +12,7 @@ interface DeferLoadProps extends PConnProps {
   isChildDeferLoad?: boolean;
   isTab: boolean;
   deferLoadId: string;
+  lastUpdateCaseTime: any;
 }
 
 //
@@ -34,7 +35,7 @@ const useStyles = makeStyles(theme => ({
 }));
 
 export default function DeferLoad(props: DeferLoadProps) {
-  const { getPConnect, name, deferLoadId, isTab } = props;
+  const { getPConnect, name, deferLoadId, isTab, lastUpdateCaseTime } = props;
   const [content, setContent] = useState<any>(null);
   const [isLoading, setLoading] = useState(true);
   const [currentLoadedAssignment, setCurrentLoadedAssignment] = useState('');
@@ -69,8 +70,8 @@ export default function DeferLoad(props: DeferLoadProps) {
   const getViewOptions = () => ({
     viewContext: resourceType,
     pageClass: loadViewCaseID ? '' : (pConnect.getDataObject('') as any).pyPortal.classID, // 2nd arg empty string until typedef allows optional
-    container: isContainerPreview ? 'preview' : null,
-    containerName: isContainerPreview ? 'preview' : null,
+    container: isContainerPreview ? 'preview' : undefined,
+    containerName: isContainerPreview ? 'preview' : undefined,
     updateData: isContainerPreview
   });
 
@@ -113,7 +114,6 @@ export default function DeferLoad(props: DeferLoadProps) {
         getPConnect()
           .getActionsApi()
           .showData(name, dataContext, dataContextParameters, {
-            // @ts-ignore - Type 'boolean' is not assignable to type 'string'
             skipSemanticUrl: true,
             // @ts-ignore
             isDeferLoaded: true
@@ -145,7 +145,7 @@ export default function DeferLoad(props: DeferLoadProps) {
           console.log(`deferload: ${error}`);
         });
     }
-  }, [name, getPConnect, currentLoadedAssignment]);
+  }, [name, getPConnect, currentLoadedAssignment, lastUpdateCaseTime]);
   /* TODO Cosmos need to handle for now added a wrapper div with pos relative */
   let deferLoadContent;
   if (isLoading) {

package/lib/infra/MultiStep/MultiStep.tsx

@@ -71,12 +71,7 @@ export default function MultiStep(props: PropsWithChildren<MultiStepProps>) {
   }
 
   function _showHLine(index: number): boolean {
-    // eslint-disable-next-line sonarjs/prefer-single-boolean-return
-    if (index < arNavigationSteps.length - 1) {
-      return true;
-    }
-
-    return false;
+    return index < arNavigationSteps.length - 1;
   }
 
   function buttonPress(sAction: string, sButtonType: string) {

package/lib/infra/RootContainer/RootContainer.tsx

@@ -179,7 +179,7 @@ export default function RootContainer(props: PropsWithChildren<RootContainerProp
       }
     };
 
-    if (!PCore.isDeepEqual(currentRootConfig, prevRootConfig)) {
+    if (prevRootConfig === null || !PCore.isDeepEqual(currentRootConfig, prevRootConfig)) {
       rootView.current = createElement(createPConnectComponent(), PCore.createPConnect(currentRootConfig)) as any;
     }
 

package/lib/template/AppShell/AppShell.tsx

@@ -73,7 +73,7 @@ export default function AppShell(props: PropsWithChildren<AppShellProps>) {
   const pConn = getPConnect();
   const envInfo = PCore.getEnvironmentInfo();
   const imageKey = envInfo.getOperatorImageInsKey();
-  const userName = envInfo.getOperatorName();
+  const userName = envInfo.getOperatorName() || '';
   const currentUserInitials = Utils.getInitials(userName);
   const appNameToDisplay = showAppName ? envInfo.getApplicationLabel() : '';
   const portalClass = pConn.getValue('.classID', ''); // 2nd arg empty string until typedef marked correctly
@@ -101,7 +101,7 @@ export default function AppShell(props: PropsWithChildren<AppShellProps>) {
   );
   // Initial setting of appName and mapChildren
   useEffect(() => {
-    setAppName(PCore.getEnvironmentInfo().getApplicationName());
+    setAppName(PCore.getEnvironmentInfo().getApplicationName() || '');
 
     const tempMap: any = (pConn.getChildren() as any)?.map((child: any, index) => {
       const theChildComp = child.getPConnect().getComponentName();
@@ -125,7 +125,7 @@ export default function AppShell(props: PropsWithChildren<AppShellProps>) {
         .getPageDataAsync(caseTypesAvailableToCreateDP, pConn.getContextName(), {
           PortalName: portalID
         })
-        .then(response => {
+        .then((response: { pyCaseTypesAvailableToCreate?: any }) => {
           if (response?.pyCaseTypesAvailableToCreate) {
             pConn.replaceState('.pyCaseTypesAvailableToCreate', response.pyCaseTypesAvailableToCreate, {
               skipDirtyValidation: true
@@ -218,10 +218,10 @@ export default function AppShell(props: PropsWithChildren<AppShellProps>) {
           portalName={portalName}
           imageSrc={iconURL}
           fullImageSrc={fullIconURL}
-          appName={localizedVal(appNameToDisplay, '', `${portalClass}!PORTAL!${envPortalName}`.toUpperCase())}
+          appName={localizedVal(appNameToDisplay || '', '', `${portalClass}!PORTAL!${envPortalName}`.toUpperCase())}
           appInfo={{
             imageSrc: iconURL,
-            appName: localizedVal(appNameToDisplay, '', `${portalClass}!PORTAL!${envPortalName}`.toUpperCase()),
+            appName: localizedVal(appNameToDisplay || '', '', `${portalClass}!PORTAL!${envPortalName}`.toUpperCase()),
             onClick: links[0] && /* links[0].onClick ? */ links[0].onClick /* : undefined */
           }}
           navLinks={links.filter((link, index) => {
@@ -245,7 +245,7 @@ export default function AppShell(props: PropsWithChildren<AppShellProps>) {
         <NavBar
           getPConnect={getPConnect}
           pConn={getPConnect()}
-          appName={localizedVal(appNameToDisplay, '', `${portalClass}!PORTAL!${envPortalName}`.toUpperCase())}
+          appName={localizedVal(appNameToDisplay || '', '', `${portalClass}!PORTAL!${envPortalName}`.toUpperCase())}
           pages={pages}
           caseTypes={caseTypes}
         />

package/lib/template/CaseView/CaseView.tsx

@@ -19,6 +19,7 @@ interface CaseViewProps extends PConnProps {
   header: string;
   showIconInHeader: boolean;
   caseInfo: any;
+  lastUpdateCaseTime: any;
 }
 
 const useStyles = makeStyles(theme => ({
@@ -64,10 +65,10 @@ export default function CaseView(props: PropsWithChildren<CaseViewProps>) {
     showIconInHeader = true,
     caseInfo: { availableActions = [], availableProcesses = [], hasNewAttachments, caseTypeID = '', caseTypeName = '' }
   } = props;
+  const { lastUpdateCaseTime = getPConnect().getValue('caseInfo.lastUpdateTime') } = props;
 
   const currentCaseID = props.caseInfo.ID;
   let isComponentMounted = true;
-
   const { displayOnlyFA } = useContext<any>(StoreContext);
 
   const thePConn = getPConnect();
@@ -79,7 +80,6 @@ export default function CaseView(props: PropsWithChildren<CaseViewProps>) {
   const localizedVal = PCore.getLocaleUtils().getLocaleValue;
   const localeCategory = 'CaseView';
   const localeKey = `${caseTypeID}!CASE!${caseTypeName}`.toUpperCase();
-
   /**
    *
    * @param inName the metadata <em>name</em> that will cause a region to be returned
@@ -169,7 +169,6 @@ export default function CaseView(props: PropsWithChildren<CaseViewProps>) {
 
   useEffect(() => {
     if (hasNewAttachments) {
-      // @ts-ignore - Argument of type 'boolean' is not assignable to parameter of type 'object'
       PCore.getPubSubUtils().publish((PCore.getEvents().getCaseEvent() as any).CASE_ATTACHMENTS_UPDATED_FROM_CASEVIEW, true);
     }
   }, [hasNewAttachments]);
@@ -244,7 +243,9 @@ export default function CaseView(props: PropsWithChildren<CaseViewProps>) {
           <Grid item xs={6}>
             {theStagesRegion}
             {theTodoRegion}
-            {deferLoadInfo.length > 0 && <DeferLoad getPConnect={getPConnect} name={deferLoadInfo[activeVertTab].config.name} isTab />}
+            {deferLoadInfo.length > 0 && (
+              <DeferLoad getPConnect={getPConnect} name={deferLoadInfo[activeVertTab].config.name} isTab lastUpdateCaseTime={lastUpdateCaseTime} />
+            )}
           </Grid>
 
           <Grid item xs={3}>

package/lib/template/Confirmation/Confirmation.tsx

@@ -41,7 +41,7 @@ export default function Confirmation(props: PropsWithChildren<ConfirmationProps>
   // Not using whatsNext at the moment, need to figure out the use of it
   // const whatsNext = datasource?.source;
   // const items = whatsNext.length > 0 ? whatsNext.map(item => item.label) : '';
-  const activeContainerItemID = PCore.getContainerUtils().getActiveContainerItemName(getPConnect().getTarget());
+  const activeContainerItemID = PCore.getContainerUtils().getActiveContainerItemName(getPConnect().getTarget() || '');
   const rootInfo = PCore.getContainerUtils().getContainerItemData(getPConnect().getTarget(), activeContainerItemID);
   const onConfirmViewClose = () => {
     setShowConfirmView(false);

package/lib/template/Details/DynamicTabs/DynamicTabs.tsx

@@ -26,7 +26,6 @@ function DynamicTabs(props: DynamicTabsProps) {
   // Get the inherited props from the parent to determine label settings
   const propsToUse = { label, showLabel, ...pConnect.getInheritedProps() };
   const defaultTabIndex = 0;
-  // @ts-ignore - Property 'getComponentConfig' is private and only accessible within class 'C11nEnv'.
   const { tablabel } = pConnect.getComponentConfig();
   const tablabelProp = PCore.getAnnotationUtils().getPropertyName(tablabel);
   const referenceListData: any = pConnect.getValue(`${referenceList}.pxResults`, ''); // 2nd arg empty string until typedefs properly allow optional

package/lib/template/FieldGroupTemplate/FieldGroupTemplate.tsx

@@ -58,7 +58,6 @@ export default function FieldGroupTemplate(props: FieldGroupTemplateProps) {
     if (PCore.getPCoreVersion()?.includes('8.7')) {
       pConn.getListActions().insert({ classID: contextClass }, referenceList.length, pageReference);
     } else {
-      // @ts-ignore - An argument for 'pageRef' was not provided.
       pConn.getListActions().insert({}, referenceList.length);
     }
   };
@@ -71,7 +70,6 @@ export default function FieldGroupTemplate(props: FieldGroupTemplateProps) {
       if (PCore.getPCoreVersion()?.includes('8.7')) {
         pConn.getListActions().deleteEntry(index, pageReference);
       } else {
-        // @ts-ignore - An argument for 'pageRef' was not provided.
         pConn.getListActions().deleteEntry(index);
       }
     };

package/lib/template/ListView/ListView.tsx

@@ -43,6 +43,7 @@ import { filterData } from '@pega/react-sdk-components/lib/components/helpers/si
 import './ListView.css';
 import { getDateFormatInfo } from '@pega/react-sdk-components/lib/components/helpers/date-format-utils';
 import { getCurrencyOptions } from '@pega/react-sdk-components/lib/components/field/Currency/currency-utils';
+import { getGenericFieldsLocalizedValue } from '@pega/react-sdk-components/lib/components/helpers/common-utils';
 import { format } from '@pega/react-sdk-components/lib/components/helpers/formatters';
 
 import useInit from './hooks';
@@ -109,7 +110,6 @@ export default function ListView(props: ListViewProps) {
   });
 
   const thePConn = getPConnect();
-  // @ts-ignore - Property 'getComponentConfig' is private and only accessible within class 'C11nEnv'.
   const componentConfig = thePConn.getComponentConfig();
   const resolvedConfigProps: any = thePConn.getConfigProps() as ListViewProps;
 
@@ -222,11 +222,12 @@ export default function ListView(props: ListViewProps) {
 
   type Order = 'asc' | 'desc';
 
-  function getComparator<Key extends keyof any>(
-    theOrder: Order,
-    orderedBy: Key
-  ): (a: { [key in Key]: number | string }, b: { [key in Key]: number | string }) => number {
-    return theOrder === 'desc' ? (a, b) => descendingComparator(a, b, orderedBy) : (a, b) => -descendingComparator(a, b, orderedBy);
+  interface Comparator<T> {
+    (a: T, b: T): number;
+  }
+
+  function getComparator<T, Key extends keyof T>(theOrder: Order, orderedBy: Key): Comparator<T> {
+    return theOrder === 'desc' ? (a: T, b: T) => descendingComparator(a, b, orderedBy) : (a: T, b: T) => -descendingComparator(a, b, orderedBy);
   }
 
   function stableSort<T>(array: T[], comparator: (a: T, b: T) => number) {
@@ -642,7 +643,6 @@ export default function ListView(props: ListViewProps) {
 
     thePConn
       .getActionsApi()
-      // @ts-ignore
       .openAssignment(pzInsKey, pxRefObjectClass, options)
       .then(() => {
         // console.log("openAssignment successful");
@@ -875,7 +875,6 @@ export default function ListView(props: ListViewProps) {
         pzInsKey = row[`${associationCategory}:pzInsKey`];
       }
       if (column.isAssignmentLink) {
-        // @ts-ignore
         thePConn.getActionsApi().openAssignment(pzInsKey, pxObjClass, {
           containerName: 'primary',
           channelName: ''
@@ -1131,7 +1130,9 @@ export default function ListView(props: ListViewProps) {
                         })}
                   </TableBody>
                 </Table>
-                {arRows && arRows.length === 0 && <div className='no-records'>No records found.</div>}
+                {arRows && arRows.length === 0 && (
+                  <div className='no-records'>{getGenericFieldsLocalizedValue('CosmosFields.fields.lists', 'No records found.')}</div>
+                )}
               </TableContainer>
             )}
           </>

package/lib/template/ListView/utils.ts

@@ -202,7 +202,6 @@ export function getConfigEmbeddedFieldsMeta(configFields, classID) {
       if (value.includes('[')) {
         value = value.substring(0, value.indexOf('[')) + value.substring(value.indexOf(']') + 1);
       }
-      // @ts-ignore - Expected 3 arguments, but got 2.
       const meta: any = PCore.getMetadataUtils().getEmbeddedPropertyMetadata(value, classID);
       meta.fieldID = field;
       configEmbeddedFieldsMeta.push(meta);

package/lib/template/PromotedFilters/PromotedFilters.tsx

@@ -87,7 +87,6 @@ export default function PromotedFilters(props: PromotedFilterProps) {
     };
     return getPConnect().getContainerManager().addTransientItem({
       id: viewName,
-      // @ts-ignore - Property 'coreHeaders' is missing in type '{ classID: string; }' but required in type '{ coreHeaders: any; }'.
       data: filtersWithClassID
     });
   }, []);

package/lib/template/SimpleTable/SimpleTable/SimpleTable.tsx

@@ -50,11 +50,9 @@ export default function SimpleTable(props: SimpleTableProps) {
 
   let { contextClass } = props;
   if (!contextClass) {
-    // @ts-ignore - Property 'getComponentConfig' is private and only accessible within class 'C11nEnv'.
     let listName = getPConnect().getComponentConfig().referenceList;
     listName = PCore.getAnnotationUtils().getPropertyName(listName);
     // was... contextClass = getPConnect().getFieldMetadata(listName)?.pageClass;
-    // @ts-ignore - Property 'getFieldMetadata' is private and only accessible within class 'C11nEnv'.
     const theFieldMetadata = getPConnect().getFieldMetadata(listName);
     if (theFieldMetadata) {
       contextClass = theFieldMetadata.pageClass;

package/lib/template/SimpleTable/SimpleTableManual/SimpleTableManual.tsx

@@ -1,4 +1,3 @@
-/* eslint-disable no-nested-ternary */
 import React, { PropsWithChildren, useEffect, useLayoutEffect, useRef, useState } from 'react';
 import Table from '@mui/material/Table';
 import TableBody from '@mui/material/TableBody';
@@ -28,6 +27,7 @@ import createPConnectComponent from '@pega/react-sdk-components/lib/bridge/react
 import { Utils } from '@pega/react-sdk-components/lib/components/helpers/utils';
 import { getReferenceList } from '@pega/react-sdk-components/lib/components/helpers/field-group-utils';
 import { getDataPage } from '@pega/react-sdk-components/lib/components/helpers/data_page';
+import { getGenericFieldsLocalizedValue } from '@pega/react-sdk-components/lib/components/helpers/common-utils';
 import { buildFieldsForTable, filterData, getContext } from '@pega/react-sdk-components/lib/components/helpers/simpleTableHelpers';
 import { PConnProps } from '@pega/react-sdk-components/lib/types/PConnProps';
 import { format } from '@pega/react-sdk-components/lib/components/helpers/formatters';
@@ -52,12 +52,27 @@ interface SimpleTableManualProps extends PConnProps {
   displayMode?: string;
   useSeparateViewForEdit: any;
   viewForEditModal: any;
+  validatemessage?: string;
+  required?: boolean;
 }
 
 const useStyles = makeStyles((/* theme */) => ({
   label: {
     margin: '8px'
   },
+  tableLabel: {
+    '&::after': {
+      display: 'inline',
+      content: '" *"',
+      verticalAlign: 'top',
+      color: 'var(--app-error-color)'
+    }
+  },
+  message: {
+    margin: '8px',
+    color: 'var(--app-error-color)',
+    fontSize: '14px'
+  },
   header: {
     background: '#f5f5f5'
   },
@@ -110,7 +125,9 @@ export default function SimpleTableManual(props: PropsWithChildren<SimpleTableMa
     editModeConfig,
     displayMode,
     useSeparateViewForEdit,
-    viewForEditModal
+    viewForEditModal,
+    required,
+    validatemessage
   } = props;
   const pConn = getPConnect();
   const [rowData, setRowData] = useState([]);
@@ -130,7 +147,8 @@ export default function SimpleTableManual(props: PropsWithChildren<SimpleTableMa
   const [displayDialogDateFilter, setDisplayDialogDateFilter] = useState<string>('notequal');
   const [displayDialogDateValue, setDisplayDialogDateValue] = useState<string>('');
   const selectedRowIndex: any = useRef(null);
-
+  const localizedVal = PCore.getLocaleUtils().getLocaleValue;
+  const localeCategory = 'SimpleTable';
   const parameters = fieldMetadata?.datasource?.parameters;
   const { referenceListStr } = getContext(getPConnect());
   const label = labelProp || propertyLabel;
@@ -176,13 +194,8 @@ export default function SimpleTableManual(props: PropsWithChildren<SimpleTableMa
   });
 
   useEffect(() => {
-    if (editableMode && !allowEditingInModal) {
-      // eslint-disable-next-line @typescript-eslint/no-use-before-define
-      buildElementsForTable();
-    }
-  }, [referenceList.length]);
-
-  useEffect(() => {
+    // eslint-disable-next-line @typescript-eslint/no-use-before-define
+    buildElementsForTable();
     if (readOnlyMode || allowEditingInModal) {
       // eslint-disable-next-line @typescript-eslint/no-use-before-define
       generateRowsData();
@@ -201,7 +214,6 @@ export default function SimpleTableManual(props: PropsWithChildren<SimpleTableMa
     if (allowEditingInModal) {
       getPConnect()
         .getListActions()
-        // @ts-ignore - An argument for 'uniqueField' was not provided.
         .initDefaultPageInstructions(
           getPConnect().getReferenceList(),
           fieldDefs.filter(item => item.name).map(item => item.name)
@@ -306,9 +318,9 @@ export default function SimpleTableManual(props: PropsWithChildren<SimpleTableMa
     if (allowEditingInModal && defaultView) {
       pConn
         .getActionsApi()
+        // @ts-ignore
         .openEmbeddedDataModal(defaultView, pConn, referenceListStr, referenceList.length, PCore.getConstants().RESOURCE_STATUS.CREATE);
     } else {
-      // @ts-ignore - An argument for 'pageRef' was not provided.
       pConn.getListActions().insert({ classID: contextClass }, referenceList.length);
     }
 
@@ -322,6 +334,7 @@ export default function SimpleTableManual(props: PropsWithChildren<SimpleTableMa
     if (typeof selectedRowIndex.current === 'number') {
       pConn
         .getActionsApi()
+        // @ts-ignore
         .openEmbeddedDataModal(
           bUseSeparateViewForEdit ? editView : defaultView,
           pConn,
@@ -334,12 +347,10 @@ export default function SimpleTableManual(props: PropsWithChildren<SimpleTableMa
 
   const deleteRecord = () => {
     setEditAnchorEl(null);
-    // @ts-ignore - An argument for 'pageRef' was not provided.
     pConn.getListActions().deleteEntry(selectedRowIndex.current);
   };
 
   const deleteRecordFromInlineEditable = (index: number) => {
-    // @ts-ignore - An argument for 'pageRef' was not provided.
     pConn.getListActions().deleteEntry(index);
   };
 
@@ -349,7 +360,7 @@ export default function SimpleTableManual(props: PropsWithChildren<SimpleTableMa
       const data: any = [];
       rawFields.forEach(item => {
         // removing label field from config to hide title in the table cell
-        item = { ...item, config: { ...item.config, label: '' } };
+        item = { ...item, config: { ...item.config, label: '', displayMode: readOnlyMode || allowEditingInModal ? 'DISPLAY_ONLY' : undefined } };
         const referenceListData = getReferenceList(pConn);
         const isDatapage = referenceListData.startsWith('D_');
         const pageReferenceValue = isDatapage
@@ -397,11 +408,12 @@ export default function SimpleTableManual(props: PropsWithChildren<SimpleTableMa
 
   type Order = 'asc' | 'desc';
 
-  function getComparator<Key extends keyof any>(
-    theOrder: Order,
-    orderedBy: Key
-  ): (a: { [key in Key]: number | string }, b: { [key in Key]: number | string }) => number {
-    return theOrder === 'desc' ? (a, b) => descendingComparator(a, b, orderedBy) : (a, b) => -descendingComparator(a, b, orderedBy);
+  interface Comparator<T> {
+    (a: T, b: T): number;
+  }
+
+  function getComparator<Key extends keyof any, T extends Record<Key, any>>(theOrder: Order, orderedBy: Key): Comparator<T> {
+    return theOrder === 'desc' ? (a: T, b: T) => descendingComparator<T>(a, b, orderedBy) : (a: T, b: T) => -descendingComparator<T>(a, b, orderedBy);
   }
 
   function stableSort<T>(array: T[], comparator: (a: T, b: T) => number) {
@@ -413,7 +425,11 @@ export default function SimpleTableManual(props: PropsWithChildren<SimpleTableMa
       return a[1] - b[1];
     });
 
-    return stabilizedThis.map(el => el[0]);
+    const newElements = new Array(stabilizedThis.length);
+    stabilizedThis.forEach((el, index) => {
+      newElements[index] = elements[el[1]];
+    });
+    return newElements;
   }
 
   function _menuClick(event, columnId: string, columnType: string, labelValue: string) {
@@ -583,19 +599,21 @@ export default function SimpleTableManual(props: PropsWithChildren<SimpleTableMa
     <>
       <TableContainer component={Paper} style={{ margin: '4px 0px' }} id='simple-table-manual'>
         {propsToUse.label && (
-          <h3 className={classes.label}>
+          <h3 className={`${classes.label} ${required ? classes.tableLabel : ''}`}>
             {propsToUse.label} {results()}
           </h3>
         )}
+        {validatemessage && <div className={classes.message}>{validatemessage}</div>}
         <Table>
           <TableHead className={classes.header}>
             <TableRow>
               {fieldDefs.map((field: any, index) => {
                 return (
                   <TableCell key={`head-${displayedColumns[index]}`} className={classes.tableCell}>
-                    {readOnlyMode ? (
-                      <div>
+                    {(readOnlyMode || allowEditingInModal) && field.cellRenderer !== 'DeleteIcon' ? (
+                      <div style={{ display: 'flex' }}>
                         <TableSortLabel
+                          style={{ width: '75%' }}
                           active={orderBy === displayedColumns[index]}
                           direction={orderBy === displayedColumns[index] ? order : 'asc'}
                           onClick={createSortHandler(displayedColumns[index])}
@@ -607,8 +625,8 @@ export default function SimpleTableManual(props: PropsWithChildren<SimpleTableMa
                           ) : null}
                         </TableSortLabel>
                         <MoreIcon
+                          style={{ cursor: 'pointer', zIndex: 1000 }}
                           id='menu-icon'
-                          className={classes.moreIcon}
                           onClick={event => {
                             _menuClick(event, field.name, field.meta.type, field.label);
                           }}
@@ -624,6 +642,7 @@ export default function SimpleTableManual(props: PropsWithChildren<SimpleTableMa
           </TableHead>
           <TableBody>
             {editableMode &&
+              !allowEditingInModal &&
               elements.map((row: any, index) => {
                 const theKey = `row-${index}`;
                 return (
@@ -661,53 +680,46 @@ export default function SimpleTableManual(props: PropsWithChildren<SimpleTableMa
                   return (
                     // eslint-disable-next-line react/no-array-index-key
                     <TableRow key={index}>
-                      {displayedColumns.map(colKey => {
+                      {row.map((item, childIndex) => {
+                        const theColKey = displayedColumns[childIndex];
                         return (
-                          <TableCell key={colKey} className={classes.tableCell}>
-                            {showDeleteButton && colKey === 'DeleteIcon' ? (
-                              <div>
-                                <MoreIcon
-                                  id='table-edit-menu-icon'
-                                  className={classes.moreIcon}
-                                  onClick={event => {
-                                    editMenuClick(event, index);
-                                  }}
-                                />
-                                <Menu id='table-edit-menu' anchorEl={editAnchorEl} keepMounted open={Boolean(editAnchorEl)} onClose={_menuClose}>
-                                  <MenuItem onClick={() => editRecord()}>Edit</MenuItem>
-                                  <MenuItem onClick={() => deleteRecord()}>Delete</MenuItem>
-                                </Menu>
-                              </div>
-                            ) : typeof row[colKey] === 'boolean' && !row[colKey] ? (
-                              'False'
-                            ) : typeof row[colKey] === 'boolean' && row[colKey] ? (
-                              'True'
-                            ) : (
-                              row[colKey] || '---'
-                            )}
+                          <TableCell key={theColKey} className={classes.tableCell}>
+                            {item}
                           </TableCell>
                         );
                       })}
+                      {showDeleteButton && (
+                        <TableCell key='DeleteIcon' className={classes.tableCell}>
+                          <div>
+                            <MoreIcon
+                              id='table-edit-menu-icon'
+                              className={classes.moreIcon}
+                              onClick={event => {
+                                editMenuClick(event, index);
+                              }}
+                            />
+                            <Menu id='table-edit-menu' anchorEl={editAnchorEl} keepMounted open={Boolean(editAnchorEl)} onClose={_menuClose}>
+                              <MenuItem onClick={() => editRecord()}>Edit</MenuItem>
+                              <MenuItem onClick={() => deleteRecord()}>Delete</MenuItem>
+                            </Menu>
+                          </div>
+                        </TableCell>
+                      )}
                     </TableRow>
                   );
                 })}
           </TableBody>
         </Table>
-        {readOnlyMode && rowData && rowData.length === 0 && (
-          <div className='no-records' id='no-records'>
-            No records found.
-          </div>
-        )}
-        {editableMode && referenceList && referenceList.length === 0 && (
+        {((readOnlyMode && (!rowData || rowData?.length === 0)) || (editableMode && (!referenceList || referenceList?.length === 0))) && (
           <div className='no-records' id='no-records'>
-            No records found.
+            {getGenericFieldsLocalizedValue('CosmosFields.fields.lists', 'No records found.')}
           </div>
         )}
       </TableContainer>
       {showAddRowButton && (
         <div style={{ fontSize: '1rem' }}>
           <Link style={{ cursor: 'pointer' }} onClick={addRecord} underline='hover'>
-            + Add
+            + {localizedVal('Add', localeCategory)}
           </Link>
         </div>
       )}

package/lib/template/SimpleTable/SimpleTableSelect/SimpleTableSelect.tsx

@@ -57,10 +57,8 @@ export default function SimpleTableSelect(props: SimpleTableSelectProps) {
 
   // Need to get this written so typedefs work
   const { datasource: { parameters: fieldParameters = {} } = {}, pageClass } = isMultiSelectMode
-    ? // @ts-ignore - Property 'getFieldMetadata' is private and only accessible within class 'C11nEnv'.
-      pConn.getFieldMetadata(`@P .${referenceProp}`)
-    : // @ts-ignore - Property 'getCurrentPageFieldMetadata' is private and only accessible within class 'C11nEnv'.
-      pConn.getCurrentPageFieldMetadata(contextPageReference);
+    ? pConn.getFieldMetadata(`@P .${referenceProp}`)
+    : pConn.getCurrentPageFieldMetadata(contextPageReference);
 
   const compositeKeys: any[] = [];
   Object.values(fieldParameters).forEach((param: any) => {

package/lib/widget/Attachment/Attachment.css

@@ -34,6 +34,7 @@
 
 .file-error {
   color: var(--app-error-color);
+  font-size: 14px;
 }
 
 .psdk-utility-card {

package/lib/widget/Attachment/Attachment.tsx

@@ -33,7 +33,7 @@ const updateAttachmentState = (pConn, key, attachments) => {
 };
 
 export default function Attachment(props: AttachmentProps) {
-  const { value, getPConnect, label, validatemessage, allowMultiple, extensions, displayMode } = props;
+  const { value, getPConnect, label, validatemessage, allowMultiple, extensions, displayMode, helperText } = props;
   /* this is a temporary fix because required is supposed to be passed as a boolean and NOT as a string */
   let { required, disabled } = props;
   [required, disabled] = [required, disabled].map(prop => prop === true || (typeof prop === 'string' && prop === 'true'));
@@ -155,11 +155,9 @@ export default function Attachment(props: AttachmentProps) {
               const context = pConn.getContextName();
               // set errors to property to block submit even on errors in file upload
               PCore.getMessageManager().addMessages({
-                // @ts-ignore
                 messages: [
                   {
                     type: 'error',
-                    // @ts-ignore - Type '{ type: string; message: string; }' is not assignable to type 'MessagesConfigObject'.
                     message: pConn.getLocalizedValue('Error with one or more files', '', '')
                   }
                 ],
@@ -192,7 +190,6 @@ export default function Attachment(props: AttachmentProps) {
   const clearFieldErrorMessages = () => {
     const fieldName = (pConn.getStateProps() as any).value;
     const context = pConn.getContextName();
-    // @ts-ignore
     PCore.getMessageManager().clearMessages({
       type: PCore.getConstants().MESSAGES.MESSAGES_TYPE_ERROR,
       property: fieldName,
@@ -231,11 +228,9 @@ export default function Attachment(props: AttachmentProps) {
           const fieldName = (pConn.getStateProps() as any).value;
           const context = pConn.getContextName();
           PCore.getMessageManager().addMessages({
-            // @ts-ignore
             messages: [
               {
                 type: 'error',
-                // @ts-ignore - Type '{ type: string; message: string; }' is not assignable to type 'MessagesConfigObject'.
                 message: pConn.getLocalizedValue('Error with one or more files', '', '')
               }
             ],
@@ -461,7 +456,7 @@ export default function Attachment(props: AttachmentProps) {
     <div className='file-upload-container'>
       <span className={`label ${required ? 'file-label' : ''}`}>{label}</span>
       {((files.length === 0 && allowMultiple !== 'true') || allowMultiple === 'true') && <section>{content}</section>}
-      {validatemessage !== '' ? <span className='file-error'>{validatemessage}</span> : ''}
+      {validatemessage !== '' ? <span className='file-error'>{validatemessage}</span> : <span style={{ fontSize: '14px' }}>{helperText}</span>}
       {files && files.length > 0 && <section>{fileDisplay}</section>}
     </div>
   );

package/lib/widget/FileUtility/FileUtility/FileUtility.tsx

@@ -512,7 +512,7 @@ export default function FileUtility(props: FileUtilityProps) {
           >
             <MoreVertIcon />
           </IconButton>
-          <Menu style={{ marginTop: '3rem' }} id='simple-menu' anchorEl={anchorEl} keepMounted open={Boolean(anchorEl)} onClose={handleClose}>
+          <Menu id='simple-menu' anchorEl={anchorEl} keepMounted open={Boolean(anchorEl)} onClose={handleClose}>
             <MenuItem style={{ fontSize: '14px' }} onClick={onAddFilesClick}>
               {thePConn.getLocalizedValue('Add files', '', '')}
             </MenuItem>{' '}