@pega/react-sdk-overrides 0.23.25 → 0.23.27

package/lib/template/PromotedFilters/PromotedFilters.tsx

@@ -1,13 +1,24 @@
-import React, { useCallback, useMemo, useState, createElement, Fragment } from 'react';
-import PropTypes from 'prop-types';
+import React, { useCallback, useMemo, useState, createElement } from 'react';
 import Button from '@material-ui/core/Button';
 
 import createPConnectComponent from '@pega/react-sdk-components/lib/bridge/react_pconnect';
-import ListView from '@pega/react-sdk-components/lib/components/template/ListView';
-import Utils from '@pega/react-sdk-components/lib/components/helpers/utils';
+import { isEmptyObject } from '@pega/react-sdk-components/lib/components/helpers/common-utils';
+import { getComponentFromMap } from '@pega/react-sdk-components/lib/bridge/helpers/sdk_component_map';
 import './PromotedFilters.css';
 
-declare const PCore;
+import { PConnProps } from '@pega/react-sdk-components/lib/types/PConnProps';
+
+// Can't use PromotedFilterProps until getContainerManager() knows about addTransientItem
+//  Currently just expects "object"
+interface PromotedFilterProps extends PConnProps {
+  // If any, enter additional props that only exist on this component
+  viewName: string;
+  filters: any[];
+  listViewProps: any;
+  pageClass: string;
+  parameters?: object;
+}
+
 const localeCategory = 'SimpleTable';
 const SUPPORTED_TYPES_IN_PROMOTED_FILTERS = [
   'TextInput',
@@ -52,17 +63,20 @@ function Filters({ filters, transientItemID, localeReference }) {
 }
 
 function isValidInput(input) {
-  return Object.values(input).findIndex((v) => v) >= 0;
+  return Object.values(input).findIndex(v => v) >= 0;
 }
 
-export default function PromotedFilters(props) {
+export default function PromotedFilters(props: PromotedFilterProps) {
+  // Get emitted components from map (so we can get any override that may exist)
+  const ListView = getComponentFromMap('ListView');
+
   const localizedVal = PCore.getLocaleUtils().getLocaleValue;
   const { getPConnect, viewName, filters, listViewProps, pageClass, parameters } = props;
   const [initTable, setInitTable] = useState(false);
   const [payload, setPayload] = useState({});
   const filtersProperties = {};
 
-  filters.forEach((filter) => {
+  filters.forEach(filter => {
     filtersProperties[PCore.getAnnotationUtils().getPropertyName(filter.config.value)] = '';
   });
 
@@ -84,7 +98,7 @@ export default function PromotedFilters(props) {
           lhs: {
             field
           },
-          comparator: "EQ",
+          comparator: 'EQ',
           rhs: {
             value
           }
@@ -95,12 +109,12 @@ export default function PromotedFilters(props) {
   }
 
   const getFilterData = useCallback(
-    (e) => {
+    e => {
       e.preventDefault(); // to prevent un-intended forms submission.
 
       const changes = PCore.getFormUtils().getChanges(transientItemID);
       const formValues = {};
-      Object.keys(changes).forEach((key) => {
+      Object.keys(changes).forEach(key => {
         if (!['context_data', 'pageInstructions'].includes(key)) {
           formValues[key] = changes[key];
         }
@@ -112,7 +126,7 @@ export default function PromotedFilters(props) {
           dataViewParameters: parameters
         };
 
-        if (!Utils.isEmptyObject(promotedFilters)) {
+        if (!isEmptyObject(promotedFilters)) {
           Query.query = { filter: { filterConditions: promotedFilters } };
         }
         setPayload(Query);
@@ -128,34 +142,30 @@ export default function PromotedFilters(props) {
   }, [transientItemID]);
 
   return (
-    <Fragment>
+    <>
       <div>{listViewProps.title}</div>
-      <div className="psdk-grid-filter">
-        <Filters filters={filters} transientItemID={transientItemID} localeReference={listViewProps.localeReference}/>
+      <div className='psdk-grid-filter'>
+        <Filters filters={filters} transientItemID={transientItemID} localeReference={listViewProps.localeReference} />
       </div>
       <div>
         <Button key='1' type='button' onClick={clearFilterData} data-testid='clear' variant='contained' color='primary'>
-            {localizedVal('Clear', localeCategory)}
+          {localizedVal('Clear', localeCategory)}
         </Button>
-        <Button style={{float: 'right'}} key='2' type='submit' onClick={getFilterData} data-testid='search' variant='contained' color='primary'>
-            {localizedVal('Search', localeCategory)}
+        <Button style={{ float: 'right' }} key='2' type='submit' onClick={getFilterData} data-testid='search' variant='contained' color='primary'>
+          {localizedVal('Search', localeCategory)}
         </Button>
       </div>
-      {initTable && <ListView {...listViewProps} title='' payload={payload}
-         isSearchable
-         tableDisplay={{
-           show: initTable
-         }}
-       />}
-    </Fragment>
+      {initTable && (
+        <ListView
+          {...listViewProps}
+          title=''
+          payload={payload}
+          isSearchable
+          tableDisplay={{
+            show: initTable
+          }}
+        />
+      )}
+    </>
   );
 }
-
-PromotedFilters.propTypes = {
-  getPConnect: PropTypes.func.isRequired,
-  viewName: PropTypes.string.isRequired,
-  filters: PropTypes.arrayOf(PropTypes.object).isRequired,
-  listViewProps: PropTypes.objectOf(PropTypes.any).isRequired,
-  pageClass: PropTypes.string.isRequired,
-  parameters: PropTypes.object
-};

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

@@ -1,28 +1,129 @@
-import React from 'react';
-import FieldGroupTemplate from '@pega/react-sdk-components/lib/components/template/FieldGroupTemplate';
-import SimpleTableManual from '@pega/react-sdk-components/lib/components/template/SimpleTable/SimpleTableManual';
+/* eslint-disable react-hooks/rules-of-hooks */
+import { useRef } from 'react';
 
-declare const PCore: any;
+import { buildMetaForListView, getContext } from '@pega/react-sdk-components/lib/components/helpers/simpleTableHelpers';
+import { getComponentFromMap } from '@pega/react-sdk-components/lib/bridge/helpers/sdk_component_map';
 
-export default function SimpleTable(props) {
-  const { getPConnect, multiRecordDisplayAs, allowTableEdit } = props;
+import { PConnProps } from '@pega/react-sdk-components/lib/types/PConnProps';
+
+// Can't use SimpleTableProps until getComponentConfig() and getFieldMetadata() are NOT private
+interface SimpleTableProps extends PConnProps {
+  // If any, enter additional props that only exist on this component
+  multiRecordDisplayAs: string;
+  allowTableEdit: boolean;
+  contextClass: any;
+  label: string;
+  propertyLabel?: string;
+  displayMode?: string;
+  fieldMetadata?: any;
+  hideLabel?: boolean;
+  parameters?: any;
+  isDataObject?: boolean;
+  type?: string;
+  ruleClass?: string;
+  authorContext?: string;
+  name?: string;
+}
+
+export default function SimpleTable(props: SimpleTableProps) {
+  // Get emitted components from map (so we can get any override that may exist)
+  const ListView = getComponentFromMap('ListView');
+  const FieldGroupTemplate = getComponentFromMap('FieldGroupTemplate');
+  const SimpleTableManual = getComponentFromMap('SimpleTableManual');
+
+  const {
+    getPConnect,
+    multiRecordDisplayAs,
+    allowTableEdit,
+    label: labelProp,
+    propertyLabel,
+    displayMode,
+    fieldMetadata,
+    hideLabel,
+    parameters,
+    isDataObject,
+    type,
+    ruleClass,
+    authorContext,
+    name
+  } = props;
 
   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);
-    contextClass = getPConnect().getFieldMetadata(listName)?.pageClass;
+    // 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;
+    } else {
+      contextClass = undefined;
+    }
   }
   if (multiRecordDisplayAs === 'fieldGroup') {
     const fieldGroupProps = { ...props, contextClass };
     return <FieldGroupTemplate {...fieldGroupProps} />;
-  } else {
-    const simpleTableManualProps = {...props, contextClass};
-    if (allowTableEdit === false) {
-      simpleTableManualProps.hideAddRow = true;
-      simpleTableManualProps.hideDeleteRow = true;
-      simpleTableManualProps.disableDragDrop = true;
+  }
+
+  const label = labelProp || propertyLabel;
+  const propsToUse = { label, ...getPConnect().getInheritedProps() };
+  const isDisplayModeEnabled = displayMode === 'DISPLAY_ONLY';
+
+  if (fieldMetadata && fieldMetadata.type === 'Page List' && fieldMetadata.dataRetrievalType === 'refer') {
+    const {
+      children: [{ children: rawFields }],
+      parameters: rawParams
+    } = (getPConnect().getRawMetadata() as any).config;
+    if (isDisplayModeEnabled && hideLabel) {
+      propsToUse.label = '';
     }
-    return <SimpleTableManual {...simpleTableManualProps} />;
+
+    const metaForListView = buildMetaForListView(
+      fieldMetadata,
+      rawFields,
+      type,
+      ruleClass,
+      name,
+      propsToUse.label,
+      isDataObject,
+      parameters // resolved params
+    );
+
+    const metaForPConnect = JSON.parse(JSON.stringify(metaForListView));
+    // @ts-ignore - PCore.getMetadataUtils().getPropertyMetadata - An argument for 'currentClassID' was not provided.
+    metaForPConnect.config.parameters = rawParams ?? PCore.getMetadataUtils().getPropertyMetadata(name)?.datasource?.parameters;
+
+    const { referenceListStr: referenceList } = getContext(getPConnect());
+    let requiredContextForQueryInDisplayMode = {};
+    if (isDisplayModeEnabled) {
+      requiredContextForQueryInDisplayMode = {
+        referenceList
+      };
+    }
+    const options = {
+      context: getPConnect().getContextName(),
+      pageReference: getPConnect().getPageReference(),
+      ...requiredContextForQueryInDisplayMode
+    };
+
+    const refToPConnect = useRef(PCore.createPConnect({ meta: metaForPConnect, options }).getPConnect).current; // getPConnect should be created only once.
+    /* BUG-637178 : need to send context */
+    const listViewProps = {
+      ...metaForListView.config,
+      getPConnect: refToPConnect,
+      displayMode,
+      fieldName: authorContext,
+      bInForm: true
+    };
+    return <ListView {...listViewProps} />;
+  }
+  const simpleTableManualProps: any = { ...props, contextClass };
+  if (allowTableEdit === false) {
+    simpleTableManualProps.hideAddRow = true;
+    simpleTableManualProps.hideDeleteRow = true;
+    simpleTableManualProps.disableDragDrop = true;
   }
+  return <SimpleTableManual {...simpleTableManualProps} />;
 }

package/lib/template/SimpleTable/SimpleTable/config-ext.json

@@ -3,6 +3,5 @@
   "description": "Datatype List Template",
   "type": "Template",
   "subtype": "DATAVIEW",
-  "properties": [
-  ]
+  "properties": []
 }