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

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

@@ -11,7 +11,9 @@ import { Button } from '@material-ui/core';
 import { validateMaxSize } from '@pega/react-sdk-components/lib/components/helpers/attachmentHelpers';
 import { CircularProgress } from "@material-ui/core";
 
-declare const PCore;
+// Remove this and use "real" PCore type once .d.ts is fixed (currently shows 5 errors)
+declare const PCore: any;
+
 
 export default function FileUtility(props) {
   const { getPConnect } = props;
@@ -22,8 +24,8 @@ export default function FileUtility(props) {
     count: 0
   };
   const [list, setList] = useState(listTemp);
-  const headerSvgIcon$ = Utils.getImageSrc('paper-clip', PCore.getAssetLoader().getStaticServerUrl());
-  const closeSvgIcon = Utils.getImageSrc("times", PCore.getAssetLoader().getStaticServerUrl());
+  const headerSvgIcon$ = Utils.getImageSrc('paper-clip', Utils.getSDKStaticConentUrl());
+  const closeSvgIcon = Utils.getImageSrc("times", Utils.getSDKStaticConentUrl());
   const configProps: any = thePConn.resolveConfigProps(thePConn.getConfigProps());
 
   const header = configProps.label;
@@ -31,16 +33,16 @@ export default function FileUtility(props) {
     showfileModal: false,
     fileList: [],
     attachedFiles: [],
-    fileMainButtons: [{ actionID: "attach", jsAction: "attachFiles", name: "Attach files"}],
-    fileSecondaryButtons: [{ actionID: "cancel", jsAction: "cancel", name: "Cancel"}]
+    fileMainButtons: [{ actionID: "attach", jsAction: "attachFiles", name: thePConn.getLocalizedValue('Attach files')}],
+    fileSecondaryButtons: [{ actionID: "cancel", jsAction: "cancel", name: thePConn.getLocalizedValue('Cancel')}]
   };
   const [fileData, setFileData] = useState(fileTemp);
   const linkTemp = {
     showLinkModal: false,
     linksList: [],
     attachedLinks: [],
-    linkMainButtons: [{ actionID: "attach", jsAction: "attachLinks", name: "Attach links"}],
-    linkSecondaryButtons: [{ actionID: "cancel", jsAction: "cancel", name: "Cancel"}]
+    linkMainButtons: [{ actionID: "attach", jsAction: "attachLinks", name: thePConn.getLocalizedValue('Attach links')}],
+    linkSecondaryButtons: [{ actionID: "cancel", jsAction: "cancel", name: thePConn.getLocalizedValue('Cancel')}]
   };
   const [linkData, setLinkData] = useState(linkTemp);
   const [anchorEl, setAnchorEl] = useState(null);
@@ -75,12 +77,11 @@ export default function FileUtility(props) {
   }) {
     let actions;
 
-
     if (att.progress && att.progress !== 100) {
       actions = [
         {
           id: `Cancel-${att.ID}`,
-          text: "Cancel",
+          text: thePConn.getLocalizedValue('Cancel'),
           icon: "times",
           onClick: cancelFile
         }
@@ -93,7 +94,7 @@ export default function FileUtility(props) {
           "download",
           {
             id: `download-${ID}`,
-            text: isFile ? "Download" : "Open",
+            text: isFile ? thePConn.getLocalizedValue('Download') : thePConn.getLocalizedValue('Open'),
             icon: isFile ? "download" : "open",
             onClick: downloadFile
           }
@@ -102,7 +103,7 @@ export default function FileUtility(props) {
           "delete",
           {
             id: `Delete-${ID}`,
-            text: "Delete",
+            text: thePConn.getLocalizedValue('Delete'),
             icon: "trash",
             onClick: deleteFile
           }
@@ -118,7 +119,7 @@ export default function FileUtility(props) {
       actions = [
         {
           id: `Remove-${att.ID}`,
-          text: "Remove",
+          text: thePConn.getLocalizedValue('Remove'),
           icon: "trash",
           onClick: removeFile
         }
@@ -492,8 +493,8 @@ export default function FileUtility(props) {
             open={Boolean(anchorEl)}
             onClose={handleClose}
           >
-            <MenuItem style={{fontSize: '14px'}} onClick={onAddFilesClick}>Add Files</MenuItem>
-            <MenuItem style={{fontSize: '14px'}} onClick={onAddLinksClick}>Add Links</MenuItem>
+            <MenuItem style={{fontSize: '14px'}} onClick={onAddFilesClick}>{thePConn.getLocalizedValue('Add files')}</MenuItem>
+            <MenuItem style={{fontSize: '14px'}} onClick={onAddLinksClick}>{thePConn.getLocalizedValue('Add links')}</MenuItem>
           </Menu>
         </div>
       </div>
@@ -506,12 +507,12 @@ export default function FileUtility(props) {
       {fileData.showfileModal && (
         <div className="psdk-dialog-background">
         <div className="psdk-modal-file-top">
-          <h3>Add local files</h3>
+          <h3>{thePConn.getLocalizedValue('Add local files')}</h3>
           <div className="psdk-modal-body">
             <div className="psdk-modal-file-selector">
               <label htmlFor='upload-files'>
                 <input style={{ display: 'none' }} id='upload-files' name='upload-files' type='file' multiple onChange={uploadMyFiles}/>
-                <Button variant='outlined' color='primary' component="span">Upload file(s)</Button>
+                <Button variant='outlined' color='primary' component="span">{thePConn.getLocalizedValue('Attach files')}</Button>
               </label>
             </div>
             {fileData.fileList.length > 0 && (<div style={{marginTop: '1rem'}}>
@@ -527,7 +528,7 @@ export default function FileUtility(props) {
       {linkData.showLinkModal && (
         <div className="psdk-dialog-background">
           <div className="psdk-modal-file-top">
-            <h3>Add links</h3>
+            <h3>{thePConn.getLocalizedValue('Add links')}</h3>
             <div className="psdk-modal-body">
               <div className="psdk-modal-links-row">
                   <div className="psdk-links-two-column">
@@ -539,7 +540,7 @@ export default function FileUtility(props) {
                     </div>
                   </div>
                   <div className="psdk-modal-link-add">
-                    <Button className="psdk-add-link-action" color="primary" variant="contained" component="span" onClick={addLink} disabled={link.disable}>Add Link</Button>
+                    <Button className="psdk-add-link-action" color="primary" variant="contained" component="span" onClick={addLink} disabled={link.disable}>{thePConn.getLocalizedValue('Add link')}</Button>
                   </div>
                 </div>
                 {linkData.linksList.length > 0 && (<div style={{marginTop: '1rem'}}>
@@ -554,7 +555,7 @@ export default function FileUtility(props) {
       {showViewAllModal && (<div className="psdk-dialog-background">
         <div className="psdk-modal-file-top">
           <div className="psdk-view-all-header">
-              <h3>Attachments</h3>
+              <h3>{thePConn.getLocalizedValue('Attachments')}</h3>
               {/* eslint-disable-next-line jsx-a11y/control-has-associated-label */}
               <button type="button" className="psdk-close-button" onClick = {() => setViewAll(false)}><img className="psdk-utility-card-actions-svg-icon" src={closeSvgIcon}></img></button>
           </div>

package/lib/widget/QuickCreate/QuickCreate.tsx

@@ -2,7 +2,10 @@ import React from "react";
 import WssQuickCreate from '@pega/react-sdk-components/lib/components/designSystemExtension/WssQuickCreate';
 import { Utils } from '@pega/react-sdk-components/lib/components/helpers/utils';
 
-declare const PCore: any;
+import PCoreType from '@pega/pcore-pconnect-typedefs/types/pcore';
+
+declare const PCore: typeof PCoreType;
+
 
 export default function QuickCreate(props) {
   const { getPConnect, heading, showCaseIcons, classFilter } = props;
@@ -26,11 +29,11 @@ export default function QuickCreate(props) {
     envInfo.environmentInfoObject.pyCaseTypeList.length > 0
   ) {
     classFilter.forEach((item) => {
-      let icon = Utils.getImageSrc('polaris-solid', PCore.getAssetLoader().getStaticServerUrl());
+      let icon = Utils.getImageSrc('polaris-solid', Utils.getSDKStaticConentUrl());
       let label = '';
       envInfo.environmentInfoObject.pyCaseTypeList.forEach((casetype) => {
         if (casetype.pyWorkTypeImplementationClassName === item) {
-          icon = casetype.pxIcon && Utils.getImageSrc(casetype?.pxIcon, PCore.getAssetLoader().getStaticServerUrl());
+          icon = casetype.pxIcon && Utils.getImageSrc(casetype?.pxIcon, Utils.getSDKStaticConentUrl());
           label = casetype.pyWorkTypeName ?? '';
         }
       });

package/lib/widget/SummaryItem/SummaryItem.tsx

@@ -4,19 +4,17 @@ import './SummaryItem.css'
 import  { IconButton, Menu, MenuItem } from '@material-ui/core';
 import MoreVertIcon from '@material-ui/icons/MoreVert';
 
-declare const PCore: any;
-
 export default function SummaryItem(props) {
   let imagePath$ = "";
   let menuIconOverride$;
   menuIconOverride$ = props.menuIconOverride$
-  imagePath$ = Utils.getIconPath(PCore.getAssetLoader().getStaticServerUrl());
+  imagePath$ = Utils.getIconPath(Utils.getSDKStaticConentUrl());
   const item = props.arItems$;
   const srcImg = `${imagePath$}${item.visual.icon}.svg`
   const [anchorEl, setAnchorEl] = useState(null);
   const open = Boolean(anchorEl);
   if (menuIconOverride$) {
-    menuIconOverride$ = Utils.getImageSrc(menuIconOverride$ , PCore.getAssetLoader().getStaticServerUrl());
+    menuIconOverride$ = Utils.getImageSrc(menuIconOverride$ , Utils.getSDKStaticConentUrl());
   }
 
   function removeAttachment() {

package/lib/widget/ToDo/ToDo.tsx

@@ -26,9 +26,11 @@ import { makeStyles } from '@material-ui/core/styles';
 import { useTheme } from '@material-ui/core/styles';
 import useMediaQuery from '@material-ui/core/useMediaQuery';
 
+import PCoreType from '@pega/pcore-pconnect-typedefs/types/pcore';
+
 import './ToDo.css';
 
-declare const PCore: any;
+declare const PCore: typeof PCoreType;
 
 const isChildCase = assignment => {
   return assignment.isChild;
@@ -90,6 +92,10 @@ export default function ToDo(props) {
   const classes = useStyles();
   const theme = useTheme();
   const isDesktop = useMediaQuery(theme.breakpoints.up('md'));
+  const localizedVal = PCore.getLocaleUtils().getLocaleValue;
+  const localeCategory = 'Todo';
+  const showlessLocalizedValue = localizedVal('show_less', 'CosmosFields');
+  const showMoreLocalizedValue = localizedVal('show_more', 'CosmosFields');
   // const { setOpen } = useNavBar();
 
   function initAssignments(): Array<any> {
@@ -191,20 +197,20 @@ export default function ToDo(props) {
     if (isDesktop) {
       return (
         <>
-          Task in
+          {localizedVal('Task in', localeCategory)}
           {renderTaskId(type, getPConnect, showTodoList, assignment)}
           {type === CONSTS.WORKLIST && assignment.status ? `\u2022 ` : undefined}
           {type === CONSTS.WORKLIST && assignment.status ? (
             <span className='psdk-todo-assignment-status'>{assignment.status}</span>
           ) : undefined}
-          {` \u2022  Urgency  ${getPriority(assignment)}`}
+          {` \u2022  ${localizedVal('Urgency', localeCategory)}  ${getPriority(assignment)}`}
         </>
       );
     }
     return (
       <>
         <Button size='small' color='primary'>{`${assignment.name} ${getID(assignment)}`}</Button>
-        {` \u2022  Urgency  ${getPriority(assignment)}`}
+        {` \u2022 ${localizedVal('Urgency', localeCategory)}  ${getPriority(assignment)}`}
       </>
     );
   };
@@ -223,18 +229,18 @@ export default function ToDo(props) {
       <List>
         {assignments.map(assignment => (
           <>
-            <div className='psdk-todo-avatar-header'>
+            <div className='psdk-todo-avatar-header' key={getAssignmentId(assignment)}>
               <Avatar className={classes.avatar} style={{ marginRight: '16px' }}>
                 {currentUserInitials}
               </Avatar>
               <div style={{ display: 'block' }}>
                 <Typography variant='h6'>{assignment?.name}</Typography>
-                {`Task in ${renderTaskId(
+                {`${localizedVal('Task in', localeCategory)} ${renderTaskId(
                   type,
                   getPConnect,
                   showTodoList,
                   assignment
-                )} \u2022  Urgency  ${getPriority(assignment)}`}
+                )} \u2022  ${localizedVal('Urgency', localeCategory)}  ${getPriority(assignment)}`}
               </div>
               {!isConfirm && (
                 <div style={{ marginLeft: 'auto' }}>
@@ -298,10 +304,12 @@ export default function ToDo(props) {
         <Box display='flex' justifyContent='center'>
           {bShowMore ? (
             <Button color='primary' onClick={_showMore}>
-              Show more
+              {showMoreLocalizedValue ===  'show_more' ? 'Show more': showMoreLocalizedValue}
             </Button>
           ) : (
-            <Button onClick={_showLess}>Show less</Button>
+            <Button onClick={_showLess}>
+              {showlessLocalizedValue ===  'show_less' ? 'Show less': showlessLocalizedValue}
+            </Button>
           )}
         </Box>
       )}

package/package.json

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

package/lib/helpers/formatters/common.js

@@ -1,14 +0,0 @@
-export function getLocale(locale) {
-  // use locale if specified
-  if (locale) return locale;
-  // otherwise, use operator locale if it's defined
-  if (window.PCore.getEnvironmentInfo().getUseLocale()) return window.PCore.getEnvironmentInfo().getUseLocale();
-  // fallback
-  return Intl.DateTimeFormat().resolvedOptions().locale;
-}
-
-export function getCurrentTimezone(timezone) {
-  if (timezone) return timezone;
-  // eslint-disable-next-line no-undef
-  return PCore?.getLocaleUtils?.().getTimeZoneInUse?.();
-}