@pega/react-sdk-overrides 8.8.21 → 8.23.11-debug

package/lib/field/UserReference/UserReference.tsx

@@ -1,8 +1,9 @@
 import React, { Fragment, memo, useEffect, useState } from 'react';
+import PropTypes from 'prop-types';
 import { Typography } from '@material-ui/core';
+import AutoComplete from '@pega/react-sdk-components/lib/components/field/AutoComplete';
+import Dropdown from '@pega/react-sdk-components/lib/components/field/Dropdown';
 import { getUserId, isUserNameAvailable } from './UserReferenceUtils';
-import { getComponentFromMap } from '@pega/react-sdk-components/lib/bridge/helpers/sdk_component_map';
-import type { PConnProps } from '@pega/react-sdk-components/lib/types/PConnProps';
 
 // Remove this and use "real" PCore type once .d.ts is fixed (currently shows 1 errors)
 declare const PCore: any;
@@ -10,48 +11,23 @@ declare const PCore: any;
 const DROPDOWN_LIST = 'Drop-down list';
 const SEARCH_BOX = 'Search box';
 
-interface UserReferenceProps extends PConnProps {
-  // If any, enter additional props that only exist on URLComponent here
-  displayAs?: string;
-  label?: string;
-  value?: any;
-  testId?: string;
-  placeholder?: string;
-  helperText?: string;
-  disabled?: boolean;
-  readOnly?: boolean;
-  required?: boolean;
-  validatemessage?: string;
-  showAsFormattedText?: boolean;
-  additionalProps?: object;
-  hideLabel?: boolean;
-  variant?: string;
-  onChange?: any;
-}
-
-const UserReference = (props: UserReferenceProps) => {
-  // Get emitted components from map (so we can get any override that may exist)
-  const AutoComplete = getComponentFromMap('AutoComplete');
-  const Dropdown = getComponentFromMap('Dropdown');
-
+const UserReference = props => {
   const {
-    label = '',
-    displayAs = '',
+    label,
+    displayAs,
     getPConnect,
-    value = '',
-    testId = '',
-    helperText = '',
-    validatemessage = '',
-    placeholder = '',
-    showAsFormattedText = false,
-    additionalProps = {},
-    hideLabel = false,
-    readOnly = false,
-    required = false,
-    disabled = false,
-    onChange,
-    // eslint-disable-next-line no-unused-vars, @typescript-eslint/no-unused-vars
-    variant = 'inline'
+    value,
+    testId,
+    helperText,
+    validatemessage,
+    placeholder,
+    showAsFormattedText,
+    additionalProps,
+    hideLabel,
+    readOnly,
+    required,
+    disabled,
+    onChange
   } = props;
   const [dropDownDataSource, setDropDownDataSource] = useState([]);
   const [userName, setUserName] = useState('');
@@ -66,7 +42,7 @@ const UserReference = (props: UserReferenceProps) => {
         // if same user ref field is referred in view as editable & readonly formatted text
         // referenced users won't be available, so get user details from dx api
         const { getOperatorDetails } = PCore.getUserApi();
-        getOperatorDetails(userId).then((res) => {
+        getOperatorDetails(userId).then(res => {
           if (res.data && res.data.pyOperatorInfo && res.data.pyOperatorInfo.pyUserName) {
             setUserName(res.data.pyOperatorInfo.pyUserName);
           }
@@ -78,14 +54,14 @@ const UserReference = (props: UserReferenceProps) => {
       };
       PCore.getRestClient()
         .invokeRestApi('getListData', { queryPayload })
-        .then((res) => {
-          const ddDataSource = res.data.data.map((listItem) => ({
+        .then(res => {
+          const ddDataSource = res.data.data.map(listItem => ({
             key: listItem.pyUserIdentifier,
             value: listItem.pyUserName
           }));
           setDropDownDataSource(ddDataSource);
         })
-        .catch((err) => {
+        .catch(err => {
           // eslint-disable-next-line no-console
           console.error(err);
         });
@@ -102,8 +78,8 @@ const UserReference = (props: UserReferenceProps) => {
             TODO: This has to be replaced with Operator Component
           */}
           <div>
-            <Typography variant="caption">{label}</Typography>
-            <Typography variant="body1">{userName}</Typography>
+            <Typography variant='caption'>{label}</Typography>
+            <Typography variant='body1'>{userName}</Typography>
           </div>
         </Fragment>
       );
@@ -133,7 +109,7 @@ const UserReference = (props: UserReferenceProps) => {
           label={label}
           getPConnect={getPConnect}
           datasource={OPERATORS_DP}
-          listType="datapage"
+          listType='datapage'
           columns={columns}
           testId={testId}
           placeholder={placeholder}
@@ -153,7 +129,7 @@ const UserReference = (props: UserReferenceProps) => {
         <Dropdown
           additionalProps={additionalProps}
           datasource={dropDownDataSource}
-          listType="associated"
+          listType='associated'
           getPConnect={getPConnect}
           label={label}
           value={userId}
@@ -174,6 +150,40 @@ const UserReference = (props: UserReferenceProps) => {
   return userReferenceComponent;
 };
 
+UserReference.propTypes = {
+  getPConnect: PropTypes.func.isRequired,
+  displayAs: PropTypes.string,
+  label: PropTypes.string,
+  value: PropTypes.oneOfType([PropTypes.string, PropTypes.objectOf(PropTypes.any)]),
+  testId: PropTypes.string,
+  placeholder: PropTypes.string,
+  helperText: PropTypes.string,
+  disabled: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),
+  readOnly: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),
+  required: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),
+  validatemessage: PropTypes.string,
+  showAsFormattedText: PropTypes.bool,
+  additionalProps: PropTypes.objectOf(PropTypes.any),
+  hideLabel: PropTypes.bool
+};
+
+UserReference.defaultProps = {
+  displayAs: null,
+  label: null,
+  value: null,
+  readOnly: false,
+  testId: null,
+  placeholder: null,
+  helperText: null,
+  disabled: false,
+  required: false,
+  validatemessage: null,
+  showAsFormattedText: false,
+  additionalProps: {},
+  variant: 'inline',
+  hideLabel: false
+};
+
 // as objects are there in props, shallow comparision fails & re-rendering of comp happens even with
 // same key value pairs in obj. hence using custom comparison function on when to re-render
 const comparisonFn = (prevProps, nextProps) => {

package/lib/helpers/attachmentHelpers.ts

@@ -1,6 +1,6 @@
 import download from 'downloadjs';
 
-export const validateMaxSize = (fileObj: any, maxSizeInMB: string): boolean => {
+export const validateMaxSize = (fileObj, maxSizeInMB) => {
   const fileSize = (fileObj.size / 1048576).toFixed(2);
   return parseFloat(fileSize) < parseFloat(maxSizeInMB);
 };
@@ -15,7 +15,7 @@ export const fileDownload = (data, fileName, ext) => {
   }
 };
 
-export const getIconFromFileType = (fileType): string => {
+export const getIconFromFileType = (fileType) => {
   let icon = 'document-doc';
   if (!fileType) return icon;
   if (fileType.startsWith('audio')) {
@@ -42,7 +42,7 @@ export const getIconFromFileType = (fileType): string => {
   return icon;
 };
 
-export const getIconForAttachment = (inThis:any , attachment:any): string => {
+export const getIconForAttachment = (inThis:any , attachment:any) => {
   let icon;
   switch (attachment.type) {
     case "FILE":
@@ -57,7 +57,7 @@ export const getIconForAttachment = (inThis:any , attachment:any): string => {
   return icon;
 };
 
-export const buildFilePropsFromResponse = (respObj): { props: { meta: string, name: string, icon: string}, responseProps: any} => {
+export const buildFilePropsFromResponse = (respObj) => {
   return {
     props: {
       meta: `${respObj.pyCategoryName}, ${respObj.pxCreateOperator}`,