@pega/react-sdk-overrides 0.23.6 → 0.23.8

package/lib/designSystemExtensions/DetailsFields/DetailsFields.tsx

@@ -40,26 +40,21 @@ export default function DetailsFields(props) {
   fields?.forEach((field, index) => {
     const thePConn = field.getPConnect();
     const theCompType = thePConn.getComponentName().toLowerCase();
-    const { label, value } = thePConn.getConfigProps();
-    // If value is "" then also we would have to get viewMetadata using getReferencedView.
-    if (theCompType === 'reference' || value === '') {
-      const configObj = thePConn?.getReferencedView();
-      configObj.config.readOnly = theCompType === 'reference';
-      configObj.config.displayMode = 'LABELS_LEFT';
-      const propToUse = { ...thePConn.getInheritedProps() };
-      configObj.config.label = theCompType === 'reference' ? propToUse?.label : label;
-      fieldComponents.push({
-        type: theCompType,
-        label,
-        value: (
-          <React.Fragment key={index}>
-            {createElement(createPConnectComponent(), thePConn.getReferencedViewPConnect())}
-          </React.Fragment>
-        )
-      });
-    } else {
-      fieldComponents.push({ type: theCompType, value, label });
-    }
+    const { label } = thePConn.getConfigProps();
+    const configObj = thePConn?.getReferencedView();
+    configObj.config.readOnly = theCompType === 'reference';
+    configObj.config.displayMode = 'LABELS_LEFT';
+    const propToUse = { ...thePConn.getInheritedProps() };
+    configObj.config.label = theCompType === 'reference' ? propToUse?.label : label;
+    fieldComponents.push({
+      type: theCompType,
+      label,
+      value: (
+        <React.Fragment key={index}>
+          {createElement(createPConnectComponent(), thePConn.getReferencedViewPConnect())}
+        </React.Fragment>
+      )
+    });
   });
 
   function getGridItemLabel(field: any, keyVal: string) {
@@ -110,7 +105,6 @@ export default function DetailsFields(props) {
   }
 
   function getGridItem(field: any, keyVal: string) {
-
     return (
       <Grid item xs={12} key={keyVal}>
         <Typography variant='body2' component='span' className={classes.fieldValue}>

package/lib/helpers/formatters/index.js

@@ -58,7 +58,7 @@ function parseDateInISO(value) {
   return value ? getDateObject(value).toISOString() : value;
 }
 
-export function format(value, type, options) {
+export function format(value, type, options = {}) {
   let formattedValue;
 
   switch (type?.toLowerCase()) {

package/lib/helpers/versionHelpers.ts

@@ -16,35 +16,4 @@ export function compareSdkPCoreVersions() {
   // eslint-disable-next-line no-console
   console.warn(`Using Constellation version ${PCore.getPCoreVersion()}. Ensure this is the same version as your Infinity server.`);
 
-  // JA Testing
-  // debugger;
-
-  // const svcParams = [
-  //   {
-  //     "field" : "type",
-  //     "value" : "Field"
-  //   },
-  //   {
-  //     "field" : "subtype",
-  //     "value" : "Text",
-  //   }
-  // ];
-
-  // const options = {};
-
-  // const AssetLoader = PCore.getAssetLoader();
-
-  // AssetLoader
-  //    .getSvcComponentsConfig(svcParams, options)
-  //    .then((response) => {
-  //       if (response?.data?.components?.[0]) {
-  //         console.log(response.data.components[0]);
-  //       }
-  //       throw new Error('bad response');
-  //    })
-  //    .catch(() => {
-  //       throw new Error('no response:');
-  //    });
-
-
 }

package/lib/infra/Attachment/Attachment.tsx

@@ -133,12 +133,13 @@ export default function Attachment(props) {
       },
       primary: {
         type: att.type,
-        name: att.name,
+        name: att.error ? att.fileName : att.name,
         icon: "trash",
         click: removeFile,
       },
       secondary: {
-        text: att.meta
+        text: att.meta,
+        error: att.error
       },
       actions
     };
@@ -158,7 +159,41 @@ export default function Attachment(props) {
 
     const onUploadProgress = () => {};
 
-    const errorHandler = () => {};
+    const errorHandler = (isFetchCanceled) => {
+      return (error) => {
+        if (!isFetchCanceled(error)) {
+          let uploadFailMsg = pConn.getLocalizedValue('Something went wrong');
+          if (error.response && error.response.data && error.response.data.errorDetails) {
+            uploadFailMsg = pConn.getLocalizedValue(error.response.data.errorDetails[0].localizedValue);
+          }
+          myFiles[0].meta = uploadFailMsg;
+          myFiles[0].error = true;
+          myFiles[0].fileName = pConn.getLocalizedValue('Unable to upload file');
+          arFileList$ = myFiles.map((att) => {
+            return getNewListUtilityItemProps({
+              att,
+              downloadFile: null,
+              cancelFile: null,
+              deleteFile: null,
+              removeFile: null
+            });
+          });
+          setFile((current) => {
+            return {
+              ...current,
+              props: {
+                ...current.props,
+                arFileList$
+              },
+              inProgress: false,
+              attachmentUploaded: true,
+              showMenuIcon: false
+            };
+          });
+        }
+        throw error;
+      };
+    };
 
     PCore.getAttachmentUtils()
       .uploadAttachment(

package/lib/infra/VerticalTabs/{LeftAlignVerticalTab.tsx → LeftAlignVerticalTabs/LeftAlignVerticalTabs.tsx}

@@ -13,7 +13,7 @@ import {
 
 // In this styling, "root" is the top-level "Tab" object (which is the button)
 //  and the button contains spans that will match on the '> span'
-const LeftAlignVerticalTab: any = withStyles((/* theme */) => ({
+const LeftAlignVerticalTabs: any = withStyles((/* theme */) => ({
   root: {
     width: '100%',
     maxWidth: '100%',
@@ -24,4 +24,4 @@ const LeftAlignVerticalTab: any = withStyles((/* theme */) => ({
   },
 }))((props) => <div><Tab {...props} /><Divider /></div>);
 
-export default LeftAlignVerticalTab;
+export default LeftAlignVerticalTabs;

package/lib/infra/VerticalTabs/LeftAlignVerticalTabs/index.tsx

@@ -0,0 +1 @@
+export { default } from './LeftAlignVerticalTabs';

package/lib/infra/VerticalTabs/{VerticalTabs.tsx → VerticalTabs/VerticalTabs.tsx}

@@ -3,7 +3,7 @@ import PropTypes from "prop-types";
 import { makeStyles } from '@material-ui/core/styles'
 
 import Tabs from '@material-ui/core/Tabs';
-import LeftAlignVerticalTab from './LeftAlignVerticalTab';
+import LeftAlignVerticalTab from '@pega/react-sdk-components/lib/components/infra/VerticalTabs/LeftAlignVerticalTabs/LeftAlignVerticalTabs';
 
 
 // The MuiTabs-indicator class is in a span whose parent is div (under the Tabs root component)

package/lib/templates/CaseView/CaseView.tsx

@@ -10,8 +10,8 @@ import Button from '@material-ui/core/Button';
 import Grid from '@material-ui/core/Grid';
 
 import StoreContext from "@pega/react-sdk-components/lib/bridge/Context/StoreContext";
-import CaseViewActionsMenu from "./CaseViewActionsMenu";
-import VerticalTabs from '@pega/react-sdk-components/lib/components/infra/VerticalTabs';
+import CaseViewActionsMenu from "@pega/react-sdk-components/lib/components/templates/CaseViewActionsMenu";
+import VerticalTabs from '@pega/react-sdk-components/lib/components/infra/VerticalTabs/VerticalTabs';
 import DeferLoad from '@pega/react-sdk-components/lib/components/infra/DeferLoad';
 
 

package/lib/templates/CaseViewActionsMenu/index.tsx

@@ -0,0 +1 @@
+export { default } from './CaseViewActionsMenu';

package/lib/templates/ListView/ListView.tsx

@@ -35,7 +35,7 @@ import IconButton from '@material-ui/core/IconButton';
 import CloseIcon from '@material-ui/icons/Close';
 import { Radio } from '@material-ui/core';
 import Checkbox from '@material-ui/core/Checkbox';
-import { filterData } from '@pega/react-sdk-components/lib/components/templates/SimpleTable/helpers';
+import { filterData } from '@pega/react-sdk-components/lib/components/templates/SimpleTable/simpleTableHelpers';
 import './ListView.css';
 
 const SELECTION_MODE = { SINGLE: 'single', MULTI: 'multi' };

package/lib/templates/NarrowWide/NarrowWidePage/NarrowWidePage.tsx

@@ -2,7 +2,7 @@ import React, { Children } from "react";
 import PropTypes from "prop-types";
 
 // import { TwoColumnPage as TwoColumn } from "@pega/cosmos-react-core";
-import NarrowWide from '@pega/react-sdk-components/lib/components/templates/NarrowWide';
+import NarrowWide from '@pega/react-sdk-components/lib/components/templates/NarrowWide/NarrowWide';
 
 /*
  * The wrapper handles knowing how to take in just children and mapping

package/lib/templates/OneColumn/OneColumnPage/OneColumnPage.tsx

@@ -1,7 +1,7 @@
 import React from "react";
 import PropTypes from "prop-types";
 
-import OneColumn from '@pega/react-sdk-components/lib/components/templates/OneColumn';
+import OneColumn from '@pega/react-sdk-components/lib/components/templates/OneColumn/OneColumn';
 
 /*
  * The wrapper handles knowing how to take in just children

package/lib/templates/SimpleTable/SimpleTable/SimpleTable.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import FieldGroupTemplate from '@pega/react-sdk-components/lib/components/templates/FieldGroupTemplate/';
-import SimpleTableManual from '@pega/react-sdk-components/lib/components/templates/SimpleTableManual';
+import SimpleTableManual from '@pega/react-sdk-components/lib/components/templates/SimpleTable/SimpleTableManual';
 
 declare const PCore: any;
 

package/lib/templates/SimpleTable/SimpleTableManual/SimpleTableManual.tsx

@@ -8,7 +8,7 @@ import TableHead from '@material-ui/core/TableHead';
 import TableRow from '@material-ui/core/TableRow';
 import Paper from '@material-ui/core/Paper';
 import { makeStyles } from '@material-ui/core/styles';
-import { buildFieldsForTable, filterData } from '@pega/react-sdk-components/lib/components/helpers';
+import { buildFieldsForTable, filterData } from '@pega/react-sdk-components/lib/components/templates/SimpleTable/simpleTableHelpers';
 import { getDataPage } from '@pega/react-sdk-components/lib/components/helpers/data_page';
 import Link from '@material-ui/core/Link';
 import { getReferenceList } from '@pega/react-sdk-components/lib/components/helpers/field-group-utils';
@@ -189,6 +189,8 @@ export default function SimpleTableManual(props) {
   }
 
   const formatRowsData = data => {
+    if(!data) return {};
+
     return data.map(item => {
       return displayedColumns.reduce((dataForRow, colKey) => {
         dataForRow[colKey] = getRowValue(item, colKey);
@@ -585,7 +587,7 @@ export default function SimpleTableManual(props) {
                 .slice(0)
                 .map(row => {
                   return (
-                    <TableRow key={row[1]}>
+                    <TableRow key={row[displayedColumns[0]]}>
                       {displayedColumns.map(colKey => {
                         return (
                           <TableCell key={colKey} className={classes.tableCell}>

package/lib/templates/SimpleTable/SimpleTableSelect/SimpleTableSelect.tsx

@@ -1,7 +1,7 @@
 import PropTypes from 'prop-types';
 import React from "react";
 import ListView from '@pega/react-sdk-components/lib/components/templates/ListView';
-import SimpleTable from '@pega/react-sdk-components/lib/components/templates/SimpleTable';
+import SimpleTable from '@pega/react-sdk-components/lib/components/templates/SimpleTable/SimpleTable';
 
 import PromotedFilters from '@pega/react-sdk-components/lib/components/templates/PromotedFilters';
 

package/lib/templates/TwoColumn/TwoColumnPage/TwoColumnPage.tsx

@@ -1,8 +1,7 @@
 import React from "react";
 import PropTypes from "prop-types";
 
-// import { TwoColumnPage as TwoColumn } from "@pega/cosmos-react-core";
-import TwoColumn from '@pega/react-sdk-components/lib/components/templates/TwoColumn';
+import TwoColumn from '@pega/react-sdk-components/lib/components/templates/TwoColumn/TwoColumn';
 
 /*
  * The wrapper handles knowing how to take in just children

package/lib/templates/WideNarrow/WideNarrowPage/WideNarrowPage.tsx

@@ -2,7 +2,7 @@ import React, { Children } from "react";
 import PropTypes from "prop-types";
 
 // import { TwoColumnPage as TwoColumn } from "@pega/cosmos-react-core";
-import WideNarrow from '@pega/react-sdk-components/lib/components/templates/WideNarrow';
+import WideNarrow from '@pega/react-sdk-components/lib/components/templates/WideNarrow/WideNarrow';
 
 /*
  * The wrapper handles knowing how to take in just children and mapping

package/lib/widgets/FileUtility/ActionButtonsForFileUtil/index.tsx

@@ -0,0 +1 @@
+export { default } from './ActionButtonsForFileUtil';

package/lib/widgets/FileUtility/{FileUtility.tsx → FileUtility/FileUtility.tsx}

@@ -3,7 +3,7 @@ import TextField from '@material-ui/core/TextField';
 import { Utils } from '@pega/react-sdk-components/lib/components/helpers/utils';
 import download from "downloadjs";
 import SummaryList from '@pega/react-sdk-components/lib/components/widgets/SummaryList';
-import ActionButtonsForFileUtil from './ActionButtonsForFileUtil';
+import ActionButtonsForFileUtil from '@pega/react-sdk-components/lib/components/widgets/FileUtility/ActionButtonsForFileUtil';
 import './FileUtility.css';
 import  { IconButton, Menu, MenuItem } from '@material-ui/core';
 import MoreVertIcon from '@material-ui/icons/MoreVert';

package/lib/widgets/FileUtility/FileUtility/index.tsx

@@ -0,0 +1 @@
+export { default } from './FileUtility';

package/lib/widgets/SummaryItem/SummaryItem.tsx

@@ -44,7 +44,7 @@ export default function SummaryItem(props) {
             <img className="psdk-utility-card-actions-svg-icon" src={`${imagePath$}${item.primary.icon}.svg`}></img>
           </button>
         </div>)}
-        {item.secondary.text && (<div>{item.secondary.text}</div>)}
+        {item.secondary.text && (<div style={{ color: item.secondary.error ? 'red' : undefined }}>{item.secondary.text}</div>)}
       </div>
       <div className="psdk-utility-action">
         {menuIconOverride$ && (<button type="button" className="psdk-utility-button" onClick={removeAttachment}>

package/package.json

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