@pega/custom-dx-components 0.25.9 → 0.25.11

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pega/custom-dx-components",
-  "version": "0.25.9",
+  "version": "0.25.11",
   "description": "Utility for building custom UI components",
   "bin": "./bin/index.js",
   "scripts": {

package/src/constants.js

@@ -71,9 +71,7 @@ export const AUTHENTICATE_DEFAULTS = {
 export const SHARED_FILE_NAMES = [
   "suggestions-handler.ts",
   "PConnProps.d.ts",
-  "create-nonce.ts",
-  "Operator.tsx",
-  "Avatar.tsx"
+  "create-nonce.ts"
 ];
 
 export const AUTHENTICATE_SCHEMA = {

package/src/tasks/delete-lib/index.js

@@ -152,7 +152,7 @@ addDebugLog("deleteLibraryVersion", "END", "-");
       if (archiveLibraries.includes(libraryName)) {
         const archLibVersions = await getLibraryArchivesVersions(libraryName, "");
         const lastVersion = archLibVersions[archLibVersions.length -1];
-        const switchToFileName = `${libraryName}_${lastVersion}.zip`;
+        const switchToFileName = `${libraryName}_${lastVersion}.arch.zip`;
         await restoreFromArchive(switchToFileName, libraryName, lastVersion);
 
         await forceDefaultsUpdate();
@@ -166,7 +166,7 @@ addDebugLog("deleteLibraryVersion", "END", "-");
         const newLib = archiveLibraries[0];
         const archLibVersions = await getLibraryArchivesVersions(newLib, "");
         const lastVersion = archLibVersions[archLibVersions.length -1];
-        const switchToFileName = `${newLib}_${lastVersion}.zip`;
+        const switchToFileName = `${newLib}_${lastVersion}.arch.zip`;
         await restoreFromArchive(switchToFileName, newLib, lastVersion);
 
 

package/src/tasks/export-archive/index.js

@@ -170,7 +170,7 @@ export const exportArch = async(exportPath, orgLibName, selectedVersion, fullArc
 addDebugLog("exportArch", `exportPath: ${exportPath}, orgLibName: ${orgLibName}, selectedVersion: ${selectedVersion}`, "");
   const currentDirectory = process.cwd();
   const archiveDirectory = join (currentDirectory, ARCHIVES_PATH, `${orgLibName}`, `${selectedVersion}`);
-  const fileName = `${orgLibName}_${selectedVersion}.zip`;
+  const fileName = `${orgLibName}_${selectedVersion}.arch.zip`;
   const archFileName = join(archiveDirectory, fileName);
   const configDef = await getConfigDefaults();
 

package/src/tasks/import-archive/index.js

@@ -186,7 +186,7 @@ export const moveComp = async(componentKey, orgLibName, version, copyShared, opt
     const currentDirectory = process.cwd();
     const tempDirectory = join(currentDirectory, TEMP_PATH);
     const archiveDirectory = join (currentDirectory, ARCHIVES_PATH, `${orgLibName}`, `${version}`);
-    const fileName = `${orgLibName}_${version}.zip`;
+    const fileName = `${orgLibName}_${version}.arch.zip`;
     const archFileName = join(archiveDirectory, fileName);
 
 
@@ -372,7 +372,7 @@ addDebugLog("importArch", `filePath: ${filePath}, fileName: ${fileName}`, "");
     console.log(`You can switch to ${chalk.green(`${orgLibName}/${version}`)} via npm run switchLib.\n`);
   }
   else {
-    const switchToFileName = `${orgLibName}_${version}.zip`;
+    const switchToFileName = `${orgLibName}_${version}.arch.zip`;
 
     const tasks = new Listr(
       [

package/src/tasks/init/template/package.json.mustache

@@ -106,7 +106,7 @@
     "@babel/preset-react": "^7.26.3",
     "@babel/preset-typescript": "^7.26.0",
     "@pega/configs": "^0.16.2",
-    "@pega/custom-dx-components": "~0.25.9",
+    "@pega/custom-dx-components": "~0.25.11",
     "@pega/pcore-pconnect-typedefs": "^4.1.0-alpha.1",
     "@storybook/addon-actions": "^7.6.19",
     "@storybook/addon-essentials": "^7.6.19",
@@ -119,7 +119,7 @@
     "@storybook/theming": "^7.6.19",
     "@testing-library/dom": "^10.4.0",
     "@testing-library/jest-dom": "^6.6.3",
-    "@testing-library/react": "^16.2.0",
+    "@testing-library/react": "^12.1.5",
     "@types/emoji-mart": "^3.0.14",
     "@types/jest": "^29.5.14",
     "@types/lodash.get": "^4.4.9",

package/src/tasks/move/index.js

@@ -176,7 +176,7 @@ export const moveComp = async(componentKey, copyMove, orgLibName, version, copyS
     const currentDirectory = process.cwd();
     const tempDirectory = join(currentDirectory, TEMP_PATH);
     const archiveDirectory = join (currentDirectory, ARCHIVES_PATH, `${orgLibName}`, `${version}`);
-    const fileName = `${orgLibName}_${version}.zip`;
+    const fileName = `${orgLibName}_${version}.arch.zip`;
     const archFileName = join(archiveDirectory, fileName);
     const currentCompPath = join(currentDirectory, "src", "components");
     const tempCompPath = join(tempDirectory, "src", "components");

package/src/tasks/switch-lib/index.js

@@ -103,7 +103,7 @@ addDebugLog("switchLibrary", "", "+");
   const existingOrgLib = orgLib.currentOrgLib;
   let oldVersion = orgLib.buildVersion;
 
-  const switchToFileName = `${newOrgLib}_${newVersion}.zip`;
+  const switchToFileName = `${newOrgLib}_${newVersion}.arch.zip`;
 
   console.log("");
 

package/src/tasks/switch-version/index.js

@@ -75,7 +75,7 @@ addDebugLog("switchVersion", "", "+");
     const existingOrgLib = orgLib.currentOrgLib;
     const oldVersion = orgLib.buildVersion;
 
-    const switchToFileName = `${existingOrgLib}_${newVersion}.zip`;
+    const switchToFileName = `${existingOrgLib}_${newVersion}.arch.zip`;
 
     console.log("");
 

package/src/util.js

@@ -262,7 +262,7 @@ if (showDebug) addDebugLog("updateUseWebPackPromotion", "", "");
 }
 
 export const getAboutData = async (currentOrgLib, buildVersion, dateStamp) => {
-if (showDebug) addDebugLog("getAboutData", `currentOrgLib: ${currentOrgLib}, buildVersion: ${buildVersion}, dateStamp: ${dateStamp}`)
+if (showDebug) addDebugLog("getAboutData", `currentOrgLib: ${currentOrgLib}, buildVersion: ${buildVersion}, dateStamp: ${dateStamp}`,"");
   const tokenAndStaticServer = await getC11NB2STokenAndStaticServer();
 
   if (tokenAndStaticServer.C11NB2S === undefined) {
@@ -277,6 +277,40 @@ if (showDebug) addDebugLog("getAboutData", `currentOrgLib: ${currentOrgLib}, bui
   return `${currentOrgLib} ${buildVersion}, ${dateStamp}, ${infinityVersion}`;
 }
 
+export const applyPegaData = async (configJson) => {
+if (showDebug) addDebugLog("applyPegaData", "", "");
+  const tokenAndStaticServer = await getC11NB2STokenAndStaticServer();
+  const currentDirectory = process.cwd()
+  const currentPackagePath = join(currentDirectory, PACKAGE_JSON_FILENAME);
+  let currentPackageData;
+
+  try {
+    currentPackageData = fs.readFileSync(currentPackagePath);
+  }
+  catch (ex) {
+    console.log($chalk.red(`\nUnable to retrieve current package.json.`))
+    process.exit(1);
+  }
+
+  const cData = JSON.parse(currentPackageData);
+  const cosmosVersion = cData.dependencies["@pega/cosmos-react-core"];
+  let infinityVersion = "";
+
+  if (tokenAndStaticServer.C11NB2S === undefined) {
+  }
+  else {
+    const jwt = jwtDecode(tokenAndStaticServer.C11NB2S);
+    infinityVersion= jwt.infinity_version;
+    // don't remove "8." from infinity version so can do a comparison
+  }
+
+  // apply info to config.json
+  configJson.infinityVersion = infinityVersion;
+  configJson.packageCosmosVersion = cosmosVersion;
+
+
+}
+
 export const checkJWTExpiration = async () => {
   const tokenAndStaticServer = await getC11NB2STokenAndStaticServer();
 
@@ -953,6 +987,7 @@ if (showDebug) addDebugLog("updateConfigVersion", `componentKey: ${componentKey}
 
   if (addAboutData) {
     data.buildDate = dateStamp;
+    await applyPegaData(data);
   }
 
 
@@ -1509,7 +1544,7 @@ if (showDebug) addDebugLog("deletePublishExtras", `libraryName: ${libraryName},
   // check if .DS_store file exists in Library, if so delete it because causes issue with services
 
   const currentDirectory = process.cwd();
-  const zipFile = libraryName.concat(".zip");
+  const zipFile = libraryName.concat(".arch.zip");
 
   // delete zip file
   const zipPath = join(currentDirectory, zipFile);
@@ -1593,7 +1628,7 @@ if (showDebug) addDebugLog("zipVersionAndArchive", `orgLibName: ${orgLibName}, v
   const srcDirectoryPath = join(currentDirectory, "src");
   const tasksConfig = join(currentDirectory, TASKS_CONFIG_JSON_FILENAME);
   const packageJson = join(currentDirectory, PACKAGE_JSON_FILENAME);
-  const archiveFileName = `${orgLibName}_${version}.zip`;
+  const archiveFileName = `${orgLibName}_${version}.arch.zip`;
 
 
   // const configContent = Buffer.from(fs.readFileSync(configJson)).toString();

package/tests/assets/library/components/{create/shared → createAll/Constellation/Pega_DXIL_MyDetails}/Avatar.tsx

@@ -2,7 +2,7 @@
 import  React from 'react';
 import { useEffect, useState } from 'react';
 import { Avatar as CosmosAvatar, withConfiguration } from '@pega/cosmos-react-core';
-import type { PConnFieldProps } from './PConnProps';
+import type { PConnFieldProps } from '../shared/PConnProps';
 
 
 // interface for props

package/tests/assets/{original/components/create/shared → library/components/createAll/Constellation/Pega_DXIL_MyDetails}/Operator.tsx

@@ -14,7 +14,7 @@ import {
 import { Glimpse } from '@pega/cosmos-react-work';
 import { EmailDisplay } from '@pega/cosmos-react-core';
 
-import type { PConnFieldProps } from './PConnProps';
+import type { PConnFieldProps } from '../shared/PConnProps';
 
 import Avatar from './Avatar';
 

package/tests/assets/library/components/createAll/Constellation/Pega_DXIL_MyDetails/demo.stories.tsx

@@ -5,7 +5,7 @@ import { Text, FieldValueList, Button, DateTimeDisplay, useTheme } from '@pega/c
 import PegaDxilMyDetails from './index';
 import { pyReviewRaw, pyReviewResolved, regionChildrenResolved, operatorDetails, configProps } from './mock';
 import StatusWorkRenderer from './StatusWork';
-import Operator from '../shared/Operator';
+import Operator from './Operator';
 import type C11nEnv from '@pega/pcore-pconnect-typedefs/interpreter/c11n-env';
 
 const meta: Meta<typeof PegaDxilMyDetails> = {

package/tests/assets/{original/components/create/shared → library/components/createAll/Constellation/Pega_DXIL_MyPageCaseWidget}/Avatar.tsx

@@ -2,18 +2,18 @@
 import  React from 'react';
 import { useEffect, useState } from 'react';
 import { Avatar as CosmosAvatar, withConfiguration } from '@pega/cosmos-react-core';
-import type { PConnFieldProps } from './PConnProps';
+import type { PConnFieldProps } from '../shared/PConnProps';
 
 
 // interface for props
-interface PegaDxilMyDetailsAvatarProps extends PConnFieldProps {
+interface PegaDxilMyPageCaseWidgetAvatarProps extends PConnFieldProps {
   // If any, enter additional props that only exist on TextInput here
   metaObj: any;
   showStatus: boolean;
 
 }
 
-function Avatar(props: PegaDxilMyDetailsAvatarProps) {
+function Avatar(props: PegaDxilMyPageCaseWidgetAvatarProps) {
   const { metaObj, showStatus = false } = props;
   const [imageBlobUrl, setImageBlobUrl] = useState(null);
   let userName: string;
@@ -59,7 +59,6 @@ function Avatar(props: PegaDxilMyDetailsAvatarProps) {
         PCore.getMessagingServiceManager().getUserPresence().unsubscribe(userIdentifier, subId);
       };
     }, [userIdentifier, handleUserStateChange]);
-
     return <CosmosAvatar name={userName} imageSrc={imageBlobUrl as React.SetStateAction<any>} status={userState} />;
   }
 

package/tests/assets/library/components/{create/shared → createAll/Constellation/Pega_DXIL_MyPageCaseWidget}/Operator.tsx

@@ -14,13 +14,13 @@ import {
 import { Glimpse } from '@pega/cosmos-react-work';
 import { EmailDisplay } from '@pega/cosmos-react-core';
 
-import type { PConnFieldProps } from './PConnProps';
+import type { PConnFieldProps } from '../shared/PConnProps';
 
 import Avatar from './Avatar';
 
 
 // interface for props
-interface PegaDxilMyDetailsOperatorProps extends PConnFieldProps {
+interface PegaDxilMyPageCaseWidgetOperatorProps extends PConnFieldProps {
   // If any, enter additional props that only exist on TextInput here
   name: string;
   id: string;
@@ -31,7 +31,7 @@ interface PegaDxilMyDetailsOperatorProps extends PConnFieldProps {
 
 let pTarget = null;
 
-function Operator(props: PegaDxilMyDetailsOperatorProps) {
+function Operator(props: PegaDxilMyPageCaseWidgetOperatorProps) {
   const { id, name, label, testId, helperText, externalUser, metaObj } = props;
   const [isOpen, setIsOpen] = useState(false);
   const [isLoading, setIsLoading] = useState(true);

package/tests/assets/library/components/createAll/Constellation/Pega_DXIL_MyPageCaseWidget/index.tsx

@@ -6,7 +6,7 @@ import { DateTimeDisplay, Card, CardHeader, CardContent, Flex, withConfiguration
 import type { PConnFieldProps } from '../shared/PConnProps';
 
 // includes in bundle
-import Operator from '../shared/Operator';
+import Operator from './Operator';
 
 import StyledPegaDxilMyPageCaseWidgetWrapper from './styles';
 

package/tests/assets/library/components/createAll/Constellation/{shared → Pega_DXIL_MyTwoColumnDetails}/Avatar.tsx

@@ -2,18 +2,18 @@
 import  React from 'react';
 import { useEffect, useState } from 'react';
 import { Avatar as CosmosAvatar, withConfiguration } from '@pega/cosmos-react-core';
-import type { PConnFieldProps } from './PConnProps';
+import type { PConnFieldProps } from '../shared/PConnProps';
 
 
 // interface for props
-interface PegaDxilMyDetailsAvatarProps extends PConnFieldProps {
+interface PegaDxilMyTwoColumnDetailsAvatarProps extends PConnFieldProps {
   // If any, enter additional props that only exist on TextInput here
   metaObj: any;
   showStatus: boolean;
 
 }
 
-function Avatar(props: PegaDxilMyDetailsAvatarProps) {
+function Avatar(props: PegaDxilMyTwoColumnDetailsAvatarProps) {
   const { metaObj, showStatus = false } = props;
   const [imageBlobUrl, setImageBlobUrl] = useState(null);
   let userName: string;
@@ -46,20 +46,20 @@ function Avatar(props: PegaDxilMyDetailsAvatarProps) {
     const currentState = PCore.getMessagingServiceManager().getUserPresence().getUserState(userIdentifier);
     const [userState, setUserState]: any  = useState(currentState === 'online' ? 'active' : 'inactive');
 
-    const handleUserStateChange = ({ state }: any) => {
+    const handleUserStateChange = ({ state } : any) => {
       setUserState(state === 'online' ? 'active' : 'inactive');
     };
 
     useEffect(() => {
       const subId = PCore.getMessagingServiceManager()
         .getUserPresence()
-        .subscribe(userIdentifier, handleUserStateChange, '');
+        // @ts-ignore
+        .subscribe(userIdentifier, handleUserStateChange);
 
       return function cleanup() {
         PCore.getMessagingServiceManager().getUserPresence().unsubscribe(userIdentifier, subId);
       };
     }, [userIdentifier, handleUserStateChange]);
-
     return <CosmosAvatar name={userName} imageSrc={imageBlobUrl as React.SetStateAction<any>} status={userState} />;
   }
 

package/tests/assets/{original/components/createAll/Constellation/shared → library/components/createAll/Constellation/Pega_DXIL_MyTwoColumnDetails}/Operator.tsx

@@ -14,13 +14,13 @@ import {
 import { Glimpse } from '@pega/cosmos-react-work';
 import { EmailDisplay } from '@pega/cosmos-react-core';
 
-import type { PConnFieldProps } from './PConnProps';
+import type { PConnFieldProps } from '../shared/PConnProps';
 
 import Avatar from './Avatar';
 
 
 // interface for props
-interface PegaDxilMyDetailsOperatorProps extends PConnFieldProps {
+interface PegaDxilMyTwoColumnDetailsOperatorProps extends PConnFieldProps {
   // If any, enter additional props that only exist on TextInput here
   name: string;
   id: string;
@@ -31,7 +31,7 @@ interface PegaDxilMyDetailsOperatorProps extends PConnFieldProps {
 
 let pTarget = null;
 
-function Operator(props: PegaDxilMyDetailsOperatorProps) {
+function Operator(props: PegaDxilMyTwoColumnDetailsOperatorProps) {
   const { id, name, label, testId, helperText, externalUser, metaObj } = props;
   const [isOpen, setIsOpen] = useState(false);
   const [isLoading, setIsLoading] = useState(true);

package/tests/assets/library/components/createAll/Constellation/Pega_DXIL_MyTwoColumnDetails/demo.stories.tsx

@@ -4,7 +4,7 @@ import { Text, FieldValueList, Button, DateTimeDisplay, useTheme } from '@pega/c
 import PegaDxilMyTwoColumnDetails from './index';
 import { pyReviewRaw, pyReviewResolved, regionChildrenResolved, operatorDetails, configProps } from './mock';
 import StatusWorkRenderer from './StatusWork';
-import Operator from '../shared/Operator';
+import Operator from './Operator';
 import type C11nEnv from '@pega/pcore-pconnect-typedefs/interpreter/c11n-env';
 
 const meta: Meta<typeof PegaDxilMyTwoColumnDetails> = {

package/tests/functional/localCreatePublishAllDeleteAll.test.js

@@ -211,6 +211,6 @@ describe(`create publish deleteAll local: ${serverDir} - ${compType}`, () => {
     // const createFile = path.resolve(path.join(`src/components/${newFileName}`, 'index.tsx'));
     // const doesExist = fs.existsSync(createFile);
     // expect(doesExist).not.toBeTruthy();
-  }, 10000);
+  }, 100000);
 
 });

package/tests/functional/localLibCreateLibExportImportLib.test.js

@@ -176,12 +176,12 @@ describe(`createLib createAll exportStore importStore deleteLib: ${serverDir} -
     const script = `npm run exportLibVersion Full Pega_DXIL 0.0.1-dev ${defaultPath} Current --prefix ../../..`;
     const { stdout, stderr } = await exec(script);
 
-    expect(stdout).toContain('Pega_DXIL_0.0.1-dev.zip has been exported');
-    const zipFile = path.join(defaultPath, "Pega_DXIL_0.0.1-dev.zip");
+    expect(stdout).toContain('Pega_DXIL_0.0.1-dev.arch.zip has been exported');
+    const zipFile = path.join(defaultPath, "Pega_DXIL_0.0.1-dev.arch.zip");
     expect(fs.existsSync(zipFile)).toBeTruthy();
 
 
-  }, 30000);
+  }, 90000);
 
   it(`npm run import lib (delete zip) - ${isLibraryBased}`, async() => {
 
@@ -192,13 +192,13 @@ describe(`createLib createAll exportStore importStore deleteLib: ${serverDir} -
       defaultPath = "/".concat(defaultPath);
     }
 
-    const script = `npm run importLibVersion ${defaultPath} Pega_DXIL_0.0.1-dev.zip --prefix ../../..`;
+    const script = `npm run importLibVersion ${defaultPath} Pega_DXIL_0.0.1-dev.arch.zip --prefix ../../..`;
     const { stdout, stderr } = await exec(script);
 
-    expect(stdout).toContain('Pega_DXIL_0.0.1-dev.zip has been imported!');
+    expect(stdout).toContain('Pega_DXIL_0.0.1-dev.arch.zip has been imported!');
     expect(stdout).toContain('You can switch to Pega_DXIL/0.0.1-dev via npm run switchLib.');
 
-    const zipFile = path.join(defaultPath, "Pega_DXIL_0.0.1-dev.zip");
+    const zipFile = path.join(defaultPath, "Pega_DXIL_0.0.1-dev.arch.zip");
     expect(fs.existsSync(zipFile)).toBeTruthy();
 
     // delete zip file
@@ -217,7 +217,7 @@ describe(`createLib createAll exportStore importStore deleteLib: ${serverDir} -
       defaultPath = "/".concat(defaultPath);
     }
 
-    const zipFile = path.join(defaultPath, "Pega_DXIL_0.0.1-dev.zip");
+    const zipFile = path.join(defaultPath, "Pega_DXIL_0.0.1-dev.arch.zip");
     expect(fs.existsSync(zipFile)).toBeTruthy();
 
     // delete zip file

package/tests/functional/localLibCreateLibExportLib.test.js

@@ -176,8 +176,8 @@ describe(`createLib createAll exportStore deleteLib: ${serverDir} - ${compType}`
     const script = `npm run exportLibVersion Full Pega_DXIL 0.0.1-dev ${defaultPath} Current --prefix ../../..`;
     const { stdout, stderr } = await exec(script);
 
-    expect(stdout).toContain('Pega_DXIL_0.0.1-dev.zip has been exported');
-    const zipFile = path.join(defaultPath, "Pega_DXIL_0.0.1-dev.zip");
+    expect(stdout).toContain('Pega_DXIL_0.0.1-dev.arch.zip has been exported');
+    const zipFile = path.join(defaultPath, "Pega_DXIL_0.0.1-dev.arch.zip");
     expect(fs.existsSync(zipFile)).toBeTruthy();
 
     // delete zip file
@@ -195,7 +195,7 @@ describe(`createLib createAll exportStore deleteLib: ${serverDir} - ${compType}`
       defaultPath = "/".concat(defaultPath);
     }
 
-    const zipFile = path.join(defaultPath, "Pega_DXIL_0.0.1-dev.zip");
+    const zipFile = path.join(defaultPath, "Pega_DXIL_0.0.1-dev.arch.zip");
     expect(fs.existsSync(zipFile)).toBeTruthy();
 
     // delete zip file

package/tests/assets/library/components/createAll/Constellation/shared/Operator.tsx

@@ -1,215 +0,0 @@
-// @ts-nocheck
-import { useState, useEffect, Fragment } from 'react';
-import {
-  Link,
-  Button,
-  Popover,
-  useOuterEvent,
-  useElement,
-  Progress,
-  FormField,
-  useTheme,
-  withConfiguration
-} from '@pega/cosmos-react-core';
-import { Glimpse } from '@pega/cosmos-react-work';
-import { EmailDisplay } from '@pega/cosmos-react-core';
-
-import type { PConnFieldProps } from './PConnProps';
-
-import Avatar from './Avatar';
-
-
-// interface for props
-interface PegaDxilMyDetailsOperatorProps extends PConnFieldProps {
-  // If any, enter additional props that only exist on TextInput here
-  name: string;
-  id: string;
-  label: string;
-  metaObj: any;
-  externalUser: any;
-}
-
-let pTarget = null;
-
-function Operator(props: PegaDxilMyDetailsOperatorProps) {
-  const { id, name, label, testId, helperText, externalUser, metaObj } = props;
-  const [isOpen, setIsOpen] = useState(false);
-  const [isLoading, setIsLoading] = useState(true);
-  const [popoverEl, setPopoverEl] = useElement(null);
-  const [popoverContent, setpopoverContent] = useState(null);
-  const theme: any = useTheme();
-
-  /* If the id has changed, we need to reset the popover */
-  useEffect(() => {
-    pTarget = null;
-  }, [id]);
-
-
-
-  const OperatorPreview = () => {
-    const localizedVal = PCore.getLocaleUtils().getLocaleValue;
-    const localeCategory = 'Operator';
-    setpopoverContent(
-      <Progress variant='ring' message={localizedVal('Loading operator...', localeCategory)} placement='local' />
-    );
-    if (externalUser && externalUser.classID !== 'Data-Party-Operator') {
-      const fields = [
-        {
-          id: 'pyFirstName',
-          name: localizedVal('Name', localeCategory),
-          value: externalUser.name
-        },
-        {
-          id: 'pyEmail1',
-          name: localizedVal('Email', localeCategory),
-          value:
-            externalUser.email !== '' ? <Link href={`mailto:${externalUser.email}`}>{externalUser.email}</Link> : ''
-        },
-        {
-          id: 'pyPhoneNumber',
-          name: localizedVal('Phone', localeCategory),
-          value: externalUser.phone !== '' ? <Link href={`tel:${externalUser.phone}`}>{externalUser.phone}</Link> : ''
-        }
-      ];
-      setIsLoading(false);
-      setpopoverContent(
-        <Glimpse
-          visual={
-            <Avatar
-              metaObj={{
-                name: externalUser.name
-              }}
-            />
-          }
-          primary={externalUser.name}
-          secondary={[externalUser.position]}
-          fields={fields}
-          target={pTarget}
-        />
-      );
-    } else {
-      return PCore.getUserApi()
-        .getOperatorDetails(id, true)
-        .then(res => {
-          if (res.data?.pyOperatorInfo) {
-            const fields = [];
-            const data = res.data;
-            if (data.pyOperatorInfo && data.pyOperatorInfo.pyUserName) {
-              fields.push({
-                id: 'Name',
-                name: localizedVal('Name', localeCategory),
-                value: data.pyOperatorInfo.pyUserName
-              });
-            }
-            if (data.pyOperatorInfo && data.pyOperatorInfo.pyEmailAddress) {
-              fields.push({
-                id: 'Email',
-                name: localizedVal('Email address', localeCategory),
-                value: <EmailDisplay value={data.pyOperatorInfo.pyEmailAddress} />
-              });
-            }
-            const opAvatar = (
-              <Avatar
-                metaObj={{
-                  image: '',
-                  name: data.pyOperatorInfo.pyUserName
-                }}
-              />
-            );
-
-            setIsLoading(false);
-            setpopoverContent(
-              <Glimpse
-                heading={{
-                  primary: data.pyOperatorInfo.pyUserName,
-                  secondary: data.pyOperatorInfo.pyEmailAddress,
-                  visual: opAvatar
-                }}
-                fields={fields}
-                target={pTarget}
-                onDismiss={() => {pTarget = null;}}
-              />
-            );
-          }
-        });
-    }
-  };
-
-
-  const clickAction = (e: any) => {
-
-    setIsOpen(!isOpen);
-    if (pTarget === null) {
-      pTarget = e.currentTarget;
-      OperatorPreview();
-    }
-  };
-
-  const hidePopover = () => {
-    if (isOpen) {
-      setIsOpen(false);
-    }
-  };
-
-  useOuterEvent('mousedown', [popoverEl], hidePopover); // Call the method on clicking outside these elements
-
-  const hideOnEscape = (e: any) => {
-    if (e.key === 'Escape') hidePopover(); // Call the method when Escape key is pressed
-  };
-
-  const comp = (
-    <Fragment>
-      {metaObj ? (
-        <Button
-          variant='text'
-          aria-haspopup
-          aria-expanded={isOpen}
-          onClick={clickAction}
-          onKeyDown={hideOnEscape}
-          data-test-id={testId}
-          style={label !== null ? { width: 'max-content', height: theme.components.input.height } : undefined}
-        >
-          <Avatar {...props} />
-        </Button>
-      ) : (
-        <Button
-          variant='link'
-          aria-haspopup
-          aria-expanded={isOpen}
-          onClick={clickAction}
-          onKeyDown={hideOnEscape}
-          data-test-id={testId}
-          style={label !== null ? { width: 'max-content', height: theme.components.input.height } : undefined}
-        >
-          {name}
-        </Button>
-      )}
-
-      {isOpen && (
-        <Popover
-          ref={setPopoverEl}
-          groupId='operator'
-          target={pTarget}
-          placement='bottom-start'
-          style={isLoading ? { position: 'relative', width: '10rem', minHeight: '4rem' } : undefined}
-          strategy='fixed'
-        >
-          {popoverContent}
-        </Popover>
-      )}
-    </Fragment>
-  );
-
-  if (label !== null) {
-    return (
-      <FormField label={label} info={helperText}>
-        {comp}
-      </FormField>
-    );
-  }
-
-  return comp;
-};
-
-
-export default withConfiguration(Operator);

package/tests/assets/original/components/create/shared/PConnProps.d.ts

@@ -1,46 +0,0 @@
-import  {PConnect } from '@pega/pcore-pconnect-typedefs';
-
-// PConnProps.d.ts
-// This gives us a place to have each component (which is most DX Components) that is
-//  expected to have a getPConnect extend its props (from BaseProps)
-//  such that every component will be expected to have a getPConnect() function
-//  that returns a PConnect object. (new/better way of doing .propTypes).
-//  This PConnProps can be extended to include other props that we know are in every component
-export interface PConnProps {
-  // getPConnect should exist for every C11n component. (add @ts-ignore in special cases where it isn't)
-  getPConnect: () => typeof PConnect;
-
-  // Allow any/all other key/value pairs in the BaseProps for now
-  //  TODO: refine which other props are always expected for various component
-  //    types and consider further interface "subclassing". For example, we may
-  //    want to create a "BasePropsForm" that gives guidance on required, readonly, etc.
-  //    and any other props that every Form component expects.
-  //    For example, see the PConnFieldProps below.
-  // NOTE: if you uncomment the line below, the PConnProps type will allow
-  //  otherwise undefined types to appear. This can be helpful for debugging
-  //  or when adding new components whose types aren't yet known.
-  // [key: string]: any;
-}
-
-
-// PConnFieldProps extends PConnProps to bring in the common properties that are
-// associated with most field components (ex: Dropdown, TextInput, etc.) in the
-//  components/field directory
-export interface PConnFieldProps extends PConnProps {
-  label: string,
-  required: boolean,
-  disabled: boolean,
-  value: any,
-  validatemessage: string,
-  status?: string,
-  onChange?: any,
-  onBlur?: any,
-  readOnly: boolean,
-  testId: string,
-  helperText: string,
-  displayMode?: string,
-  hideLabel: boolean,
-  placeholder?: string,
-  fieldMetadata?: any,
-  additionalProps?: any
-}

package/tests/assets/original/components/create/shared/create-nonce.ts

@@ -1,6 +0,0 @@
-/* eslint-disable camelcase */
-// @ts-ignore
-if (window?.__webpack_nonce__) {
-  // @ts-ignore
-  __webpack_nonce__ = window.__webpack_nonce__;
-}

package/tests/assets/original/components/create/shared/suggestions-handler.ts

@@ -1,9 +0,0 @@
-export const suggestionsHandler = (accepted: boolean, pConn: any, setStatus: any) => {
-  if (accepted) {
-    pConn.acceptSuggestion();
-    setStatus('success');
-  } else {
-    pConn.ignoreSuggestion();
-    setStatus(undefined);
-  }
-};

package/tests/assets/original/components/createAll/Constellation/shared/Avatar.tsx

@@ -1,76 +0,0 @@
-/* eslint-disable react-hooks/rules-of-hooks */
-import  React from 'react';
-import { useEffect, useState } from 'react';
-import { Avatar as CosmosAvatar, withConfiguration } from '@pega/cosmos-react-core';
-import type { PConnFieldProps } from './PConnProps';
-
-
-// interface for props
-interface PegaDxilMyDetailsAvatarProps extends PConnFieldProps {
-  // If any, enter additional props that only exist on TextInput here
-  metaObj: any;
-  showStatus: boolean;
-
-}
-
-function Avatar(props: PegaDxilMyDetailsAvatarProps) {
-  const { metaObj, showStatus = false } = props;
-  const [imageBlobUrl, setImageBlobUrl] = useState(null);
-  let userName: string;
-  let userIdentifier: string;
-
-  // TODO Below if conditions can be removed once we have apis to get worklist/mywork info
-  // This is non CaseView case (Dashboard, MyWork etc)
-  if (!metaObj) {
-    userName = PCore.getEnvironmentInfo().getOperatorName() ?? "";
-    userIdentifier = PCore.getEnvironmentInfo().getOperatorIdentifier() ?? "";
-  } else {
-    userName = metaObj.name;
-    userIdentifier = metaObj.ID;
-  }
-  if (!userName && userIdentifier) {
-    userName = userIdentifier;
-  }
-
-  useEffect(() => {
-    const imageKey = !metaObj ? PCore.getEnvironmentInfo().getOperatorImageInsKey() : metaObj.image;
-    if (imageKey) {
-      PCore.getAssetLoader()
-        .getSvcImage(imageKey)
-        .then((blob) => window.URL.createObjectURL(blob))
-        .then((imagePath) => setImageBlobUrl(imagePath as React.SetStateAction<any>));
-    }
-  }, [metaObj]);
-
-  if (showStatus) {
-    const currentState = PCore.getMessagingServiceManager().getUserPresence().getUserState(userIdentifier);
-    const [userState, setUserState]: any  = useState(currentState === 'online' ? 'active' : 'inactive');
-
-    const handleUserStateChange = ({ state }: any) => {
-      setUserState(state === 'online' ? 'active' : 'inactive');
-    };
-
-    useEffect(() => {
-      const subId = PCore.getMessagingServiceManager()
-        .getUserPresence()
-        .subscribe(userIdentifier, handleUserStateChange, '');
-
-      return function cleanup() {
-        PCore.getMessagingServiceManager().getUserPresence().unsubscribe(userIdentifier, subId);
-      };
-    }, [userIdentifier, handleUserStateChange]);
-
-    return <CosmosAvatar name={userName} imageSrc={imageBlobUrl as React.SetStateAction<any>} status={userState} />;
-  }
-
-  // Do not render when userName does not exists
-  // TODO : In CNR case, pxRequestor is not available, please remove this condition once it populates
-  if (!userName) {
-    return null;
-  }
-
-  return <CosmosAvatar name={userName} imageSrc={imageBlobUrl as React.SetStateAction<any>} />;
-}
-
-
-export default withConfiguration(Avatar);

package/tests/assets/original/components/createAll/Constellation/shared/PConnProps.d.ts

@@ -1,46 +0,0 @@
-import  {PConnect } from '@pega/pcore-pconnect-typedefs';
-
-// PConnProps.d.ts
-// This gives us a place to have each component (which is most DX Components) that is
-//  expected to have a getPConnect extend its props (from BaseProps)
-//  such that every component will be expected to have a getPConnect() function
-//  that returns a PConnect object. (new/better way of doing .propTypes).
-//  This PConnProps can be extended to include other props that we know are in every component
-export interface PConnProps {
-  // getPConnect should exist for every C11n component. (add @ts-ignore in special cases where it isn't)
-  getPConnect: () => typeof PConnect;
-
-  // Allow any/all other key/value pairs in the BaseProps for now
-  //  TODO: refine which other props are always expected for various component
-  //    types and consider further interface "subclassing". For example, we may
-  //    want to create a "BasePropsForm" that gives guidance on required, readonly, etc.
-  //    and any other props that every Form component expects.
-  //    For example, see the PConnFieldProps below.
-  // NOTE: if you uncomment the line below, the PConnProps type will allow
-  //  otherwise undefined types to appear. This can be helpful for debugging
-  //  or when adding new components whose types aren't yet known.
-  // [key: string]: any;
-}
-
-
-// PConnFieldProps extends PConnProps to bring in the common properties that are
-// associated with most field components (ex: Dropdown, TextInput, etc.) in the
-//  components/field directory
-export interface PConnFieldProps extends PConnProps {
-  label: string,
-  required: boolean,
-  disabled: boolean,
-  value: any,
-  validatemessage: string,
-  status?: string,
-  onChange?: any,
-  onBlur?: any,
-  readOnly: boolean,
-  testId: string,
-  helperText: string,
-  displayMode?: string,
-  hideLabel: boolean,
-  placeholder?: string,
-  fieldMetadata?: any,
-  additionalProps?: any
-}

package/tests/assets/original/components/createAll/Constellation/shared/create-nonce.ts

@@ -1,6 +0,0 @@
-/* eslint-disable camelcase */
-// @ts-ignore
-if (window?.__webpack_nonce__) {
-  // @ts-ignore
-  __webpack_nonce__ = window.__webpack_nonce__;
-}

package/tests/assets/original/components/createAll/Constellation/shared/suggestions-handler.ts

@@ -1,9 +0,0 @@
-export const suggestionsHandler = (accepted: boolean, pConn: any, setStatus: any) => {
-  if (accepted) {
-    pConn.acceptSuggestion();
-    setStatus('success');
-  } else {
-    pConn.ignoreSuggestion();
-    setStatus(undefined);
-  }
-};

package/tests/assets/original/components/createAll/Launchpad/shared/Avatar.tsx

@@ -1,76 +0,0 @@
-/* eslint-disable react-hooks/rules-of-hooks */
-import  React from 'react';
-import { useEffect, useState } from 'react';
-import { Avatar as CosmosAvatar, withConfiguration } from '@pega/cosmos-react-core';
-import type { PConnFieldProps } from './PConnProps';
-
-
-// interface for props
-interface PegaDxilMyDetailsAvatarProps extends PConnFieldProps {
-  // If any, enter additional props that only exist on TextInput here
-  metaObj: any;
-  showStatus: boolean;
-
-}
-
-function Avatar(props: PegaDxilMyDetailsAvatarProps) {
-  const { metaObj, showStatus = false } = props;
-  const [imageBlobUrl, setImageBlobUrl] = useState(null);
-  let userName: string;
-  let userIdentifier: string;
-
-  // TODO Below if conditions can be removed once we have apis to get worklist/mywork info
-  // This is non CaseView case (Dashboard, MyWork etc)
-  if (!metaObj) {
-    userName = PCore.getEnvironmentInfo().getOperatorName() ?? "";
-    userIdentifier = PCore.getEnvironmentInfo().getOperatorIdentifier() ?? "";
-  } else {
-    userName = metaObj.name;
-    userIdentifier = metaObj.ID;
-  }
-  if (!userName && userIdentifier) {
-    userName = userIdentifier;
-  }
-
-  useEffect(() => {
-    const imageKey = !metaObj ? PCore.getEnvironmentInfo().getOperatorImageInsKey() : metaObj.image;
-    if (imageKey) {
-      PCore.getAssetLoader()
-        .getSvcImage(imageKey)
-        .then((blob) => window.URL.createObjectURL(blob))
-        .then((imagePath) => setImageBlobUrl(imagePath as React.SetStateAction<any>));
-    }
-  }, [metaObj]);
-
-  if (showStatus) {
-    const currentState = PCore.getMessagingServiceManager().getUserPresence().getUserState(userIdentifier);
-    const [userState, setUserState]: any  = useState(currentState === 'online' ? 'active' : 'inactive');
-
-    const handleUserStateChange = ({ state }: any) => {
-      setUserState(state === 'online' ? 'active' : 'inactive');
-    };
-
-    useEffect(() => {
-      const subId = PCore.getMessagingServiceManager()
-        .getUserPresence()
-        .subscribe(userIdentifier, handleUserStateChange, '');
-
-      return function cleanup() {
-        PCore.getMessagingServiceManager().getUserPresence().unsubscribe(userIdentifier, subId);
-      };
-    }, [userIdentifier, handleUserStateChange]);
-
-    return <CosmosAvatar name={userName} imageSrc={imageBlobUrl as React.SetStateAction<any>} status={userState} />;
-  }
-
-  // Do not render when userName does not exists
-  // TODO : In CNR case, pxRequestor is not available, please remove this condition once it populates
-  if (!userName) {
-    return null;
-  }
-
-  return <CosmosAvatar name={userName} imageSrc={imageBlobUrl as React.SetStateAction<any>} />;
-}
-
-
-export default withConfiguration(Avatar);

package/tests/assets/original/components/createAll/Launchpad/shared/Operator.tsx

@@ -1,215 +0,0 @@
-// @ts-nocheck
-import { useState, useEffect, Fragment } from 'react';
-import {
-  Link,
-  Button,
-  Popover,
-  useOuterEvent,
-  useElement,
-  Progress,
-  FormField,
-  useTheme,
-  withConfiguration
-} from '@pega/cosmos-react-core';
-import { Glimpse } from '@pega/cosmos-react-work';
-import { EmailDisplay } from '@pega/cosmos-react-core';
-
-import type { PConnFieldProps } from './PConnProps';
-
-import Avatar from './Avatar';
-
-
-// interface for props
-interface PegaDxilMyDetailsOperatorProps extends PConnFieldProps {
-  // If any, enter additional props that only exist on TextInput here
-  name: string;
-  id: string;
-  label: string;
-  metaObj: any;
-  externalUser: any;
-}
-
-let pTarget = null;
-
-function Operator(props: PegaDxilMyDetailsOperatorProps) {
-  const { id, name, label, testId, helperText, externalUser, metaObj } = props;
-  const [isOpen, setIsOpen] = useState(false);
-  const [isLoading, setIsLoading] = useState(true);
-  const [popoverEl, setPopoverEl] = useElement(null);
-  const [popoverContent, setpopoverContent] = useState(null);
-  const theme: any = useTheme();
-
-  /* If the id has changed, we need to reset the popover */
-  useEffect(() => {
-    pTarget = null;
-  }, [id]);
-
-
-
-  const OperatorPreview = () => {
-    const localizedVal = PCore.getLocaleUtils().getLocaleValue;
-    const localeCategory = 'Operator';
-    setpopoverContent(
-      <Progress variant='ring' message={localizedVal('Loading operator...', localeCategory)} placement='local' />
-    );
-    if (externalUser && externalUser.classID !== 'Data-Party-Operator') {
-      const fields = [
-        {
-          id: 'pyFirstName',
-          name: localizedVal('Name', localeCategory),
-          value: externalUser.name
-        },
-        {
-          id: 'pyEmail1',
-          name: localizedVal('Email', localeCategory),
-          value:
-            externalUser.email !== '' ? <Link href={`mailto:${externalUser.email}`}>{externalUser.email}</Link> : ''
-        },
-        {
-          id: 'pyPhoneNumber',
-          name: localizedVal('Phone', localeCategory),
-          value: externalUser.phone !== '' ? <Link href={`tel:${externalUser.phone}`}>{externalUser.phone}</Link> : ''
-        }
-      ];
-      setIsLoading(false);
-      setpopoverContent(
-        <Glimpse
-          visual={
-            <Avatar
-              metaObj={{
-                name: externalUser.name
-              }}
-            />
-          }
-          primary={externalUser.name}
-          secondary={[externalUser.position]}
-          fields={fields}
-          target={pTarget}
-        />
-      );
-    } else {
-      return PCore.getUserApi()
-        .getOperatorDetails(id, true)
-        .then(res => {
-          if (res.data?.pyOperatorInfo) {
-            const fields = [];
-            const data = res.data;
-            if (data.pyOperatorInfo && data.pyOperatorInfo.pyUserName) {
-              fields.push({
-                id: 'Name',
-                name: localizedVal('Name', localeCategory),
-                value: data.pyOperatorInfo.pyUserName
-              });
-            }
-            if (data.pyOperatorInfo && data.pyOperatorInfo.pyEmailAddress) {
-              fields.push({
-                id: 'Email',
-                name: localizedVal('Email address', localeCategory),
-                value: <EmailDisplay value={data.pyOperatorInfo.pyEmailAddress} />
-              });
-            }
-            const opAvatar = (
-              <Avatar
-                metaObj={{
-                  image: '',
-                  name: data.pyOperatorInfo.pyUserName
-                }}
-              />
-            );
-
-            setIsLoading(false);
-            setpopoverContent(
-              <Glimpse
-                heading={{
-                  primary: data.pyOperatorInfo.pyUserName,
-                  secondary: data.pyOperatorInfo.pyEmailAddress,
-                  visual: opAvatar
-                }}
-                fields={fields}
-                target={pTarget}
-                onDismiss={() => {pTarget = null;}}
-              />
-            );
-          }
-        });
-    }
-  };
-
-
-  const clickAction = (e: any) => {
-
-    setIsOpen(!isOpen);
-    if (pTarget === null) {
-      pTarget = e.currentTarget;
-      OperatorPreview();
-    }
-  };
-
-  const hidePopover = () => {
-    if (isOpen) {
-      setIsOpen(false);
-    }
-  };
-
-  useOuterEvent('mousedown', [popoverEl], hidePopover); // Call the method on clicking outside these elements
-
-  const hideOnEscape = (e: any) => {
-    if (e.key === 'Escape') hidePopover(); // Call the method when Escape key is pressed
-  };
-
-  const comp = (
-    <Fragment>
-      {metaObj ? (
-        <Button
-          variant='text'
-          aria-haspopup
-          aria-expanded={isOpen}
-          onClick={clickAction}
-          onKeyDown={hideOnEscape}
-          data-test-id={testId}
-          style={label !== null ? { width: 'max-content', height: theme.components.input.height } : undefined}
-        >
-          <Avatar {...props} />
-        </Button>
-      ) : (
-        <Button
-          variant='link'
-          aria-haspopup
-          aria-expanded={isOpen}
-          onClick={clickAction}
-          onKeyDown={hideOnEscape}
-          data-test-id={testId}
-          style={label !== null ? { width: 'max-content', height: theme.components.input.height } : undefined}
-        >
-          {name}
-        </Button>
-      )}
-
-      {isOpen && (
-        <Popover
-          ref={setPopoverEl}
-          groupId='operator'
-          target={pTarget}
-          placement='bottom-start'
-          style={isLoading ? { position: 'relative', width: '10rem', minHeight: '4rem' } : undefined}
-          strategy='fixed'
-        >
-          {popoverContent}
-        </Popover>
-      )}
-    </Fragment>
-  );
-
-  if (label !== null) {
-    return (
-      <FormField label={label} info={helperText}>
-        {comp}
-      </FormField>
-    );
-  }
-
-  return comp;
-};
-
-
-export default withConfiguration(Operator);

package/tests/assets/original/components/createAll/Launchpad/shared/PConnProps.d.ts

@@ -1,46 +0,0 @@
-import  {PConnect } from '@pega/pcore-pconnect-typedefs';
-
-// PConnProps.d.ts
-// This gives us a place to have each component (which is most DX Components) that is
-//  expected to have a getPConnect extend its props (from BaseProps)
-//  such that every component will be expected to have a getPConnect() function
-//  that returns a PConnect object. (new/better way of doing .propTypes).
-//  This PConnProps can be extended to include other props that we know are in every component
-export interface PConnProps {
-  // getPConnect should exist for every C11n component. (add @ts-ignore in special cases where it isn't)
-  getPConnect: () => typeof PConnect;
-
-  // Allow any/all other key/value pairs in the BaseProps for now
-  //  TODO: refine which other props are always expected for various component
-  //    types and consider further interface "subclassing". For example, we may
-  //    want to create a "BasePropsForm" that gives guidance on required, readonly, etc.
-  //    and any other props that every Form component expects.
-  //    For example, see the PConnFieldProps below.
-  // NOTE: if you uncomment the line below, the PConnProps type will allow
-  //  otherwise undefined types to appear. This can be helpful for debugging
-  //  or when adding new components whose types aren't yet known.
-  // [key: string]: any;
-}
-
-
-// PConnFieldProps extends PConnProps to bring in the common properties that are
-// associated with most field components (ex: Dropdown, TextInput, etc.) in the
-//  components/field directory
-export interface PConnFieldProps extends PConnProps {
-  label: string,
-  required: boolean,
-  disabled: boolean,
-  value: any,
-  validatemessage: string,
-  status?: string,
-  onChange?: any,
-  onBlur?: any,
-  readOnly: boolean,
-  testId: string,
-  helperText: string,
-  displayMode?: string,
-  hideLabel: boolean,
-  placeholder?: string,
-  fieldMetadata?: any,
-  additionalProps?: any
-}

package/tests/assets/original/components/createAll/Launchpad/shared/create-nonce.ts

@@ -1,6 +0,0 @@
-/* eslint-disable camelcase */
-// @ts-ignore
-if (window?.__webpack_nonce__) {
-  // @ts-ignore
-  __webpack_nonce__ = window.__webpack_nonce__;
-}

package/tests/assets/original/components/createAll/Launchpad/shared/suggestions-handler.ts

@@ -1,9 +0,0 @@
-export const suggestionsHandler = (accepted: boolean, pConn: any, setStatus: any) => {
-  if (accepted) {
-    pConn.acceptSuggestion();
-    setStatus('success');
-  } else {
-    pConn.ignoreSuggestion();
-    setStatus(undefined);
-  }
-};