@pega/dx-component-builder-sdk 0.23.6 → 0.23.7

package/tests/assets/components/SDK-React/createAll/override-sdk/template/Confirmation/Confirmation.tsx

@@ -1,28 +1,25 @@
 /* eslint-disable @typescript-eslint/no-unused-vars */
 /* eslint-disable no-unused-vars */
 /* eslint-disable no-nested-ternary */
-import { Fragment, useState } from 'react';
-import React from 'react';
-import { getToDoAssignments } from '@pega/react-sdk-components/lib/components/infra/Containers/FlowContainer/helpers';
-import ToDo from '@pega/react-sdk-components/lib/components/widget/ToDo';
-import Details from '@pega/react-sdk-components/lib/components/template/Details/Details';
+import React, { useState } from 'react';
 import { Button, Card, makeStyles } from '@material-ui/core';
+import { getToDoAssignments } from '@pega/react-sdk-components/lib/components/infra/Containers/FlowContainer/helpers';
+import { getComponentFromMap } from '@pega/react-sdk-components/lib/bridge/helpers/sdk_component_map';
+
 import type { PConnProps } from '@pega/react-sdk-components/lib/types/PConnProps';
 
-// XX does NOT have getPConnect. So, no need to extend from PConnProps
+// Confirmation does NOT have getPConnect. So, no need to extend from PConnProps
 
 interface ConfirmationProps extends PConnProps {
   // If any, enter additional props that only exist on this component
-  children: Array<any>,
-  datasource: { source: any },
-  label: string,
-  showLabel: boolean,
-  showTasks: boolean
+  children: Array<any>;
+  datasource: { source: any };
+  label: string;
+  showLabel: boolean;
+  showTasks: boolean;
 }
 
-
-
-const useStyles = makeStyles(theme => ({
+const useStyles = makeStyles((theme) => ({
   root: {
     paddingRight: theme.spacing(1),
     paddingLeft: theme.spacing(1),
@@ -36,6 +33,10 @@ const useStyles = makeStyles(theme => ({
 }));
 
 export default function Confirmation(props: ConfirmationProps) {
+  // Get emitted components from map (so we can get any override that may exist)
+  const ToDo = getComponentFromMap('Todo'); // NOTE: ConstellationJS Engine uses "Todo" and not "ToDo"!!!
+  const Details = getComponentFromMap('Details');
+
   const classes = useStyles();
   const CONSTS = PCore.getConstants();
   const [showConfirmView, setShowConfirmView] = useState(true);
@@ -43,20 +44,12 @@ export default function Confirmation(props: ConfirmationProps) {
   // Get the inherited props from the parent to determine label settings
   // 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 rootInfo = PCore.getContainerUtils().getContainerItemData(
-    getPConnect().getTarget(),
-    activeContainerItemID
-  );
+  const items = whatsNext.length > 0 ? whatsNext.map((item) => item.label) : '';
+  const activeContainerItemID = PCore.getContainerUtils().getActiveContainerItemName(getPConnect().getTarget());
+  const rootInfo = PCore.getContainerUtils().getContainerItemData(getPConnect().getTarget(), activeContainerItemID);
   const onConfirmViewClose = () => {
     setShowConfirmView(false);
-    PCore.getPubSubUtils().publish(
-      PCore.getConstants().PUB_SUB_EVENTS.CASE_EVENTS.CLOSE_CONFIRM_VIEW,
-      rootInfo
-    );
+    PCore.getPubSubUtils().publish(PCore.getConstants().PUB_SUB_EVENTS.CASE_EVENTS.CLOSE_CONFIRM_VIEW, rootInfo);
   };
   const todoProps = { ...props, renderTodoInConfirm: true };
   const toDoList = getToDoAssignments(getPConnect());
@@ -64,36 +57,22 @@ export default function Confirmation(props: ConfirmationProps) {
   const showDetails = detailProps?.children?.[0]?.props?.getPConnect()?.getChildren()?.length > 0;
   return showConfirmView ? (
     <Card className={classes.root}>
-      <h2 id='confirm-label'>{props.showLabel ? props.label : ''}</h2>
+      <h2 id="confirm-label">{props.showLabel ? props.label : ''}</h2>
       {showDetails ? <Details {...detailProps} /> : undefined}
       {showTasks ? (
         toDoList && toDoList.length > 0 ? (
-          <ToDo
-            {...todoProps}
-            datasource={{ source: toDoList }}
-            getPConnect={getPConnect}
-            type={CONSTS.TODO}
-            headerText='Open Tasks'
-            isConfirm
-          />
+          <ToDo {...todoProps} datasource={{ source: toDoList }} getPConnect={getPConnect} type={CONSTS.TODO} headerText="Open Tasks" isConfirm />
         ) : undefined
       ) : undefined}
       <div style={{ display: 'flex', justifyContent: 'flex-end' }}>
-        <Button variant='contained' color='primary' onClick={onConfirmViewClose}>
+        <Button variant="contained" color="primary" onClick={onConfirmViewClose}>
           Done
         </Button>
       </div>
     </Card>
   ) : toDoList && toDoList.length > 0 ? (
     <Card className={classes.root}>
-      <ToDo
-        {...props}
-        datasource={{ source: toDoList }}
-        getPConnect={getPConnect}
-        type={CONSTS.TODO}
-        headerText='Tasks'
-        isConfirm
-      />
+      <ToDo {...props} datasource={{ source: toDoList }} getPConnect={getPConnect} type={CONSTS.TODO} headerText="Tasks" isConfirm />
     </Card>
   ) : null;
 }

package/tests/assets/components/SDK-React/createAll/override-sdk/template/DataReference/DataReference.tsx

@@ -1,6 +1,6 @@
 import React, { useMemo, useState, useEffect } from 'react';
-import SingleReferenceReadonly from '@pega/react-sdk-components/lib/components/template/SingleReferenceReadOnly';
-import MultiReferenceReadonly from '@pega/react-sdk-components/lib/components/template/MultiReferenceReadOnly';
+import { getComponentFromMap } from '@pega/react-sdk-components/lib/bridge/helpers/sdk_component_map';
+
 import type { PConnProps } from '@pega/react-sdk-components/lib/types/PConnProps';
 
 // ReferenceProps can't be used until getComponentConfig() is NOT private
@@ -27,6 +27,10 @@ declare const PCore: any;
 
 
 export default function DataReference(props: DataReferenceProps) {
+  // Get emitted components from map (so we can get any override that may exist)
+  const SingleReferenceReadonly = getComponentFromMap('SingleReferenceReadOnly');
+  const MultiReferenceReadonly = getComponentFromMap('MultiReferenceReadOnly');
+
   const {
     children,
     getPConnect,

package/tests/assets/components/SDK-React/createAll/override-sdk/template/Details/Details.tsx

@@ -1,7 +1,8 @@
 import React, { createElement } from 'react';
 import Grid from '@material-ui/core/Grid';
 import createPConnectComponent from '@pega/react-sdk-components/lib/bridge/react_pconnect';
-import FieldGroup from '@pega/react-sdk-components/lib/components/designSystemExtension/FieldGroup';
+import { getComponentFromMap } from '@pega/react-sdk-components/lib/bridge/helpers/sdk_component_map';
+
 // import type { PConnProps } from '../../../../types/PConnProps';
 
 
@@ -12,6 +13,9 @@ import FieldGroup from '@pega/react-sdk-components/lib/components/designSystemEx
 
 
 export default function Details(props /* : DetailsProps */) {
+  // Get emitted components from map (so we can get any override that may exist)
+  const FieldGroup = getComponentFromMap('FieldGroup');
+
   const { label, showLabel, getPConnect, showHighlightedData } = props;
 
   // Get the inherited props from the parent to determine label settings

package/tests/assets/components/SDK-React/createAll/override-sdk/template/DetailsThreeColumn/DetailsThreeColumn.tsx

@@ -1,7 +1,8 @@
 import React, { createElement } from 'react';
 import Grid from '@material-ui/core/Grid';
 import createPConnectComponent from '@pega/react-sdk-components/lib/bridge/react_pconnect';
-import FieldGroup from '@pega/react-sdk-components/lib/components/designSystemExtension/FieldGroup';
+import { getComponentFromMap } from '@pega/react-sdk-components/lib/bridge/helpers/sdk_component_map';
+
 // import type { PConnProps } from '../../../../types/PConnProps';
 
 // Can't use PConnProps until getPConnect().getChildren() type is ok
@@ -14,6 +15,9 @@ import FieldGroup from '@pega/react-sdk-components/lib/components/designSystemEx
 
 
 export default function DetailsThreeColumn(props /* : DetailsThreeColumnProps */) {
+  // Get emitted components from map (so we can get any override that may exist)
+  const FieldGroup = getComponentFromMap('FieldGroup');
+
   const { label, showLabel = true, getPConnect, showHighlightedData = false } = props;
 
   // Get the inherited props from the parent to determine label settings

package/tests/assets/components/SDK-React/createAll/override-sdk/template/DetailsTwoColumn/DetailsTwoColumn.tsx

@@ -1,7 +1,8 @@
 import React, { createElement } from 'react';
 import Grid from '@material-ui/core/Grid';
 import createPConnectComponent from '@pega/react-sdk-components/lib/bridge/react_pconnect';
-import FieldGroup from '@pega/react-sdk-components/lib/components/designSystemExtension/FieldGroup';
+import { getComponentFromMap } from '@pega/react-sdk-components/lib/bridge/helpers/sdk_component_map';
+
 // import type { PConnProps } from '../../../../types/PConnProps';
 
 
@@ -15,6 +16,9 @@ import FieldGroup from '@pega/react-sdk-components/lib/components/designSystemEx
 
 
 export default function DetailsTwoColumn(props /* : DetailsTwoColumnProps */) {
+  // Get emitted components from map (so we can get any override that may exist)
+  const FieldGroup = getComponentFromMap('FieldGroup');
+
   const { label, showLabel = true, getPConnect, showHighlightedData = false } = props;
 
   // Get the inherited props from the parent to determine label settings

package/tests/assets/components/SDK-React/createAll/override-sdk/template/FieldGroupTemplate/FieldGroupTemplate.tsx

@@ -1,8 +1,8 @@
 /* eslint-disable react-hooks/rules-of-hooks */
 import React, { useMemo } from 'react';
-import FieldGroup from '@pega/react-sdk-components/lib/components/designSystemExtension/FieldGroup';
-import FieldGroupList from '@pega/react-sdk-components/lib/components/designSystemExtension/FieldGroupList';
 import { getReferenceList, buildView } from '@pega/react-sdk-components/lib/components/helpers/field-group-utils';
+import { getComponentFromMap } from '@pega/react-sdk-components/lib/bridge/helpers/sdk_component_map';
+
 import type { PConnProps } from '@pega/react-sdk-components/lib/types/PConnProps';
 
 interface FieldGroupTemplateProps extends PConnProps {
@@ -19,6 +19,10 @@ interface FieldGroupTemplateProps extends PConnProps {
 
 
 export default function FieldGroupTemplate(props: FieldGroupTemplateProps) {
+  // Get emitted components from map (so we can get any override that may exist)
+  const FieldGroup = getComponentFromMap('FieldGroup');
+  const FieldGroupList = getComponentFromMap('FieldGroupList');
+
   const {
     referenceList = [],
     renderMode,

package/tests/assets/components/SDK-React/createAll/override-sdk/template/InlineDashboardPage/InlineDashboardPage.tsx

@@ -2,7 +2,8 @@ import React from 'react';
 import { useMemo, Children, useEffect, useState } from 'react';
 
 import { buildFilterComponents } from '@pega/react-sdk-components/lib/components/infra/DashboardFilter/filterUtils';
-import InlineDashboard from '@pega/react-sdk-components/lib/components/template/InlineDashboard';
+import { getComponentFromMap } from '@pega/react-sdk-components/lib/bridge/helpers/sdk_component_map';
+
 import type { PConnProps } from '@pega/react-sdk-components/lib/types/PConnProps';
 
 
@@ -16,6 +17,9 @@ interface InlineDashboardPageProps extends PConnProps {
 
 
 export default function InlineDashboardPage(props: InlineDashboardPageProps) {
+  // Get emitted components from map (so we can get any override that may exist)
+  const InlineDashboard = getComponentFromMap("InlineDashboard");
+
   // eslint-disable-next-line no-unused-vars, @typescript-eslint/no-unused-vars
   const { children, getPConnect, icon = '', filterPosition = 'block-start'  } = props;
   const [filterComponents, setFilterComponents] = useState([]);

package/tests/assets/components/SDK-React/createAll/override-sdk/template/ListPage/ListPage.tsx

@@ -1,6 +1,5 @@
 import React from "react";
-
-import ListView from '@pega/react-sdk-components/lib/components/template/ListView';
+import { getComponentFromMap } from '@pega/react-sdk-components/lib/bridge/helpers/sdk_component_map';
 
 import type { PConnProps } from '@pega/react-sdk-components/lib/types/PConnProps';
 
@@ -11,8 +10,12 @@ interface ListPageProps extends PConnProps {
 
 
 export default function ListPage(props: ListPageProps) {
+  // Get emitted components from map (so we can get any override that may exist)
+  const ListView = getComponentFromMap('ListView');
 
+ // special case for ListView - add in a prop
+ const listViewProps = {...props, bInForm: false};
   return (
-    <ListView  {...props}></ListView>
+    <ListView  {...listViewProps}></ListView>
   )
 }

package/tests/assets/components/SDK-React/createAll/override-sdk/template/ListView/ListView.tsx

@@ -37,7 +37,7 @@ import { Radio } from '@material-ui/core';
 import Checkbox from '@material-ui/core/Checkbox';
 import { filterData } from '@pega/react-sdk-components/lib/components/helpers/simpleTableHelpers';
 import './ListView.css';
-import useInit from './hooks'
+import useInit from './hooks';
 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 { format } from '@pega/react-sdk-components/lib/components/helpers/formatters/';
@@ -59,7 +59,6 @@ import { format } from '@pega/react-sdk-components/lib/components/helpers/format
 //   presets?: any
 // }
 
-
 const SELECTION_MODE = { SINGLE: 'single', MULTI: 'multi' };
 
 // Remove this and use "real" PCore type once .d.ts is fixed (currently shows 3 errors)
@@ -77,8 +76,18 @@ let sortColumnId: any;
 const filterByColumns: Array<any> = [];
 
 export default function ListView(props /* : ListViewProps */) {
-  const { getPConnect, bInForm } = props;
-  const { globalSearch, referenceList, rowClickAction, selectionMode, referenceType, payload, parameters, compositeKeys, showDynamicFields, presets } = props;
+  const { getPConnect, bInForm = true } = props;
+  const {
+    globalSearch,
+    referenceList,
+    /* rowClickAction, */
+    selectionMode,
+    referenceType,
+    payload,
+    parameters,
+    compositeKeys,
+    showDynamicFields
+  } = props;
   const ref = useRef({}).current;
   const cosmosTableRef = useRef();
   // List component context
@@ -119,7 +128,7 @@ export default function ListView(props /* : ListViewProps */) {
 
   // Will contain the list of columns specific for an instance
   let columnList: any = useRef([]);
-  let dashboardFilterPayload: any ;
+  let dashboardFilterPayload: any;
   // Will be sent in the dashboardFilterPayload
   let selectParam: Array<any> = [];
 
@@ -234,7 +243,7 @@ export default function ListView(props /* : ListViewProps */) {
   };
 
   const AssignDashObjects = ['Assign-Worklist', 'Assign-WorkBasket'];
-  function getHeaderCells(colFields, fields, presetFields) {
+  function getHeaderCells(colFields, fields) {
     const arReturn = colFields.map((field: any, index) => {
       let theField = field.config.value.substring(field.config.value.indexOf(' ') + 1);
       if (theField.indexOf('.') === 0) {
@@ -243,7 +252,7 @@ export default function ListView(props /* : ListViewProps */) {
       const colIndex = fields.findIndex(ele => ele.name === theField);
       const displayAsLink = field.config.displayAsLink;
       const headerRow: any = {};
-      headerRow.id = theField;
+      headerRow.id = fields[index].id;
       headerRow.type = field.type;
       headerRow.displayAsLink = displayAsLink;
       headerRow.numeric =
@@ -253,7 +262,7 @@ export default function ListView(props /* : ListViewProps */) {
         field.type === 'Currency' ||
         false;
       headerRow.disablePadding = false;
-      headerRow.label =  presetFields[index].config.label;
+      headerRow.label =  fields[index].label;
       if (colIndex > -1) {
         headerRow.classID = fields[colIndex].classID;
       }
@@ -268,25 +277,18 @@ export default function ListView(props /* : ListViewProps */) {
     return arReturn;
   }
 
-  function updateFields(arFields, theColumns): Array<any> {
-    const arReturn = arFields.filter(ele => ele.type !== 'reference');
-    arReturn.forEach((field, index) => {
-      arReturn[index].config.name = theColumns[index].id;
-    });
-
-    return arReturn;
-  }
 
   function getUsingData(arTableData): Array<any> {
     if (selectionMode === SELECTION_MODE.SINGLE || selectionMode === SELECTION_MODE.MULTI) {
       const record = arTableData?.length > 0 ? arTableData[0] : '';
       if (typeof record === 'object' && !('pyGUID' in record) && !('pyID' in record)) {
         // eslint-disable-next-line no-console
-        console.error('pyGUID or pyID values are mandatory to select the required row from the list');
+        console.error(
+          'pyGUID or pyID values are mandatory to select the required row from the list'
+        );
       }
     }
     const arReturn = arTableData?.map((data: any) => {
-
       const row = data;
 
       return row;
@@ -371,7 +373,7 @@ export default function ListView(props /* : ListViewProps */) {
       validFilter = true;
       /** Below are the 2 cases for- Text & Date-Range filter types where we'll construct filter data which will be sent in the dashboardFilterPayload
        * In Constellation DX Components, through Repeating Structures they might be using several APIs to do it. We're doing it here
-      */
+       */
       if (isDateRange) {
         const dateRelationalOp = filter?.AND ? 'AND' : 'OR';
         dashboardFilterPayload.query.filter.filterConditions = {
@@ -380,11 +382,13 @@ export default function ListView(props /* : ListViewProps */) {
           [`T${index++}`]: { ...filter[relationalOp][1].condition }
         };
         if (dashboardFilterPayload.query.filter.logic) {
-          dashboardFilterPayload.query.filter.logic = `${dashboardFilterPayload.query.filter.logic} ${relationalOp} (T${
-            index - 2
-          } ${dateRelationalOp} T${index - 1})`;
+          dashboardFilterPayload.query.filter.logic = `${
+            dashboardFilterPayload.query.filter.logic
+          } ${relationalOp} (T${index - 2} ${dateRelationalOp} T${index - 1})`;
         } else {
-          dashboardFilterPayload.query.filter.logic = `(T${index - 2} ${relationalOp} T${index - 1})`;
+          dashboardFilterPayload.query.filter.logic = `(T${index - 2} ${relationalOp} T${
+            index - 1
+          })`;
         }
 
         dashboardFilterPayload.query.select = selectParam;
@@ -395,9 +399,9 @@ export default function ListView(props /* : ListViewProps */) {
         };
 
         if (dashboardFilterPayload.query.filter.logic) {
-          dashboardFilterPayload.query.filter.logic = `${dashboardFilterPayload.query.filter.logic} ${relationalOp} T${
-            index - 1
-          }`;
+          dashboardFilterPayload.query.filter.logic = `${
+            dashboardFilterPayload.query.filter.logic
+          } ${relationalOp} T${index - 1}`;
         } else {
           dashboardFilterPayload.query.filter.logic = `T${index - 1}`;
         }
@@ -449,18 +453,21 @@ export default function ListView(props /* : ListViewProps */) {
     if (payload) {
       query = payload.query;
     } else if (fields?.length && meta.isQueryable) {
-      query = {select: fields};
+      query = { select: fields };
     } else if (dashboardFilterPayload) {
       query = dashboardFilterPayload.query;
     }
     const context = getPConnect().getContextName();
-    return PCore.getDataPageUtils().getDataAsync(
-      referenceList,
-      context,
-      payload ? payload.dataViewParameters : dataViewParameters,
-      null,
-      query
-    );
+    // getDataAsync isn't returning correct data for the Page(i.e. ListView within a page) case
+    return !bInForm
+      ? PCore.getDataApiUtils().getData(referenceList, payload)
+      : PCore.getDataPageUtils().getDataAsync(
+          referenceList,
+          context,
+          payload ? payload.dataViewParameters : dataViewParameters,
+          null,
+          query
+        );
   }
 
   const buildSelect = (fieldDefs, colId, patchQueryFields = [], compositeKeys = []) => {
@@ -499,18 +506,22 @@ export default function ListView(props /* : ListViewProps */) {
     return listFields;
   };
 
-  const addItemKeyInSelect = (
-    fieldDefs,
-    itemKey,
-    select,
-    compositeKeys
-  ) => {
+  const addItemKeyInSelect = (fieldDefs, itemKey, select, compositeKeys) => {
     const elementFound = getField(fieldDefs, itemKey);
 
-    if (itemKey && !elementFound && Array.isArray(select) && !(compositeKeys !== null && compositeKeys?.length) && !select.find(sel => sel.field === itemKey)) {
-      return [...select, {
-        field: itemKey
-      }];
+    if (
+      itemKey &&
+      !elementFound &&
+      Array.isArray(select) &&
+      !(compositeKeys !== null && compositeKeys?.length) &&
+      !select.find(sel => sel.field === itemKey)
+    ) {
+      return [
+        ...select,
+        {
+          field: itemKey
+        }
+      ];
     }
 
     return select;
@@ -532,19 +543,18 @@ export default function ListView(props /* : ListViewProps */) {
   async function fetchDataFromServer() {
     let bCallSetRowsColumns = true;
     const { fieldDefs, itemKey, patchQueryFields } = meta;
-    let listFields = fieldDefs ? buildSelect(fieldDefs, undefined, patchQueryFields, compositeKeys) : [];
+    let listFields = fieldDefs
+      ? buildSelect(fieldDefs, undefined, patchQueryFields, compositeKeys)
+      : [];
     listFields = addItemKeyInSelect(fieldDefs, itemKey, listFields, compositeKeys);
     const workListJSON = await fetchAllData(listFields);
 
-    // don't update these fields until we return from promise
-    let fields = presets[0].children[0].children;
-
     // this is an unresovled version of this.fields$, need unresolved, so can get the property reference
     const columnFields = componentConfig.presets[0].children[0].children;
 
-    const tableDataResults = workListJSON['data'];
+    const tableDataResults = !bInForm ? workListJSON['data'].data : workListJSON['data'];
 
-    const myColumns = getHeaderCells(columnFields, fieldDefs, fields);
+    const myColumns = getHeaderCells(columnFields, fieldDefs);
 
     const selectParams: any = [];
 
@@ -562,8 +572,6 @@ export default function ListView(props /* : ListViewProps */) {
 
     columnList = colList;
 
-    fields = updateFields(fields, myColumns);
-
     setResponse(tableDataResults);
 
     const usingDataResults = getUsingData(tableDataResults);
@@ -655,17 +663,17 @@ export default function ListView(props /* : ListViewProps */) {
       });
   }
 
-  function _rowClick(row: any) {
-    // eslint-disable-next-line sonarjs/no-small-switch
-    switch (rowClickAction) {
-      case 'openAssignment':
-        openAssignment(row);
-        break;
+  // function _rowClick(row: any) {
+  //   // eslint-disable-next-line sonarjs/no-small-switch
+  //   switch (rowClickAction) {
+  //     case 'openAssignment':
+  //       openAssignment(row);
+  //       break;
 
-      default:
-        break;
-    }
-  }
+  //     default:
+  //       break;
+  //   }
+  // }
 
   function openWork(row) {
     const { pxRefObjectKey } = row;
@@ -874,7 +882,7 @@ export default function ListView(props /* : ListViewProps */) {
   }
 
   function _listViewClick(row, column) {
-    const name = column.id
+    const name = column.id;
     if (column.displayAsLink) {
       const { pxObjClass } = row;
       let { pzInsKey } = row;
@@ -904,13 +912,12 @@ export default function ListView(props /* : ListViewProps */) {
           break;
       }
     }
-
   }
 
   function _listTitle() {
     const defaultTitle = 'List';
     let title = resolvedConfigProps.title || resolvedConfigProps?.label || defaultTitle;
-    const inheritedProps = resolvedConfigProps?.["inheritedProps"];
+    const inheritedProps = resolvedConfigProps?.['inheritedProps'];
 
     // Let any title in resolvedConfigProps that isn't the default take precedence
     //  but only look in inheritedProps if they exist
@@ -933,14 +940,12 @@ export default function ListView(props /* : ListViewProps */) {
       const index = response.findIndex(element => element[rowID] === value);
       const selectedRow = response[index];
       compositeKeys.forEach(element => {
-        reqObj[element] = selectedRow[element]
+        reqObj[element] = selectedRow[element];
       });
     } else {
       reqObj[rowID] = value;
     }
-    getPConnect()
-      ?.getListActions?.()
-      ?.setSelectedRows([reqObj]);
+    getPConnect()?.getListActions?.()?.setSelectedRows([reqObj]);
     setSelectedValue(value);
   };
 
@@ -952,16 +957,14 @@ export default function ListView(props /* : ListViewProps */) {
       const index = response.findIndex(element => element[rowID] === value);
       const selectedRow = response[index];
       compositeKeys.forEach(element => {
-        reqObj[element] = selectedRow[element]
+        reqObj[element] = selectedRow[element];
       });
       reqObj['$selected'] = checked;
     } else {
       reqObj[rowID] = value;
       reqObj['$selected'] = checked;
     }
-    getPConnect()
-      ?.getListActions()
-      ?.setSelectedRows([reqObj]);
+    getPConnect()?.getListActions()?.setSelectedRows([reqObj]);
   };
 
   const processColumnValue = (column, value) => {
@@ -974,14 +977,17 @@ export default function ListView(props /* : ListViewProps */) {
       case 'Date':
       case 'DateTime':
         theDateFormatInfo = getDateFormatInfo();
-        theFormat = (type === 'DateTime') ? `${theDateFormatInfo.dateFormatStringLong} hh:mm a` : theDateFormatInfo.dateFormatStringLong;
+        theFormat =
+          type === 'DateTime'
+            ? `${theDateFormatInfo.dateFormatStringLong} hh:mm a`
+            : theDateFormatInfo.dateFormatStringLong;
         val = format(value, column.type, { format: theFormat });
-      break;
+        break;
 
       case 'Currency':
         theCurrencyOptions = getCurrencyOptions(PCore?.getEnvironmentInfo()?.getLocale());
         val = format(value, column.type, theCurrencyOptions);
-      break;
+        break;
 
       default:
         val = column.format && typeof value === 'number' ? column.format(value) : value;
@@ -1003,20 +1009,20 @@ export default function ListView(props /* : ListViewProps */) {
               </Grid>
               <Grid item>
                 <TextField
-                  label={ PCore.getLocaleUtils().getLocaleValue('Search', 'Search') }
+                  label={PCore.getLocaleUtils().getLocaleValue('Search', 'Search')}
                   fullWidth
                   variant='outlined'
                   placeholder=''
                   size='small'
-                  id="search"
+                  id='search'
                   onChange={_onSearch}
                 />
               </Grid>
             </Grid>
           )}
           <>
-            {bInForm ? (
-              <TableContainer className={classes.tableInForm}>
+            {!bInForm ? (
+              <TableContainer id="list-view" className={classes.tableInForm}>
                 <Table stickyHeader aria-label='sticky table'>
                   <TableHead>
                     <TableRow>
@@ -1058,12 +1064,7 @@ export default function ListView(props /* : ListViewProps */) {
                       .slice(page * rowsPerPage, page * rowsPerPage + rowsPerPage)
                       .map(row => {
                         return (
-                          <TableRow
-                            key={row.pxRefObjectInsName || row.pyID}
-                            onClick={() => {
-                              _rowClick(row);
-                            }}
-                          >
+                          <TableRow key={row.pxRefObjectInsName || row.pyID}>
                             {arColumns.map(column => {
                               const value = row[column.id];
                               return (
@@ -1100,7 +1101,7 @@ export default function ListView(props /* : ListViewProps */) {
                 </Table>
               </TableContainer>
             ) : (
-              <TableContainer>
+              <TableContainer id="list-view">
                 <Table>
                   <TableHead>
                     <TableRow>
@@ -1137,12 +1138,7 @@ export default function ListView(props /* : ListViewProps */) {
                         .slice(page * rowsPerPage, page * rowsPerPage + rowsPerPage)
                         .map(row => {
                           return (
-                            <TableRow
-                              key={row[rowID]}
-                              onClick={() => {
-                                _rowClick(row);
-                              }}
-                            >
+                            <TableRow key={row[rowID]}>
                               {selectionMode === SELECTION_MODE.SINGLE && (
                                 <TableCell>
                                   <Radio