@pega/dx-component-builder-sdk 0.1.22 → 0.1.24

package/src/tasks/create/templates/SDK-React/template/DETAILS-region/mock.stories.js.mustache

@@ -0,0 +1,34 @@
+const operatorDetails = {
+  data: {
+    "pzLoadTime": "March 13, 2023 10:58:15 AM EDT",
+    "pzPageNameHash": "_pa134221491644431pz",
+    "pyOperatorInfo": {
+        "pyUserName": "User DigV2",
+        "pyPosition": "",
+        "pyImageInsKey": "",
+        "pySkills": [
+            {
+                "pySkillName": "",
+                "pzIndexOwnerKey": "DATA-ADMIN-OPERATOR-ID USER.DIGV2",
+                "pySkillRating": 0
+            }
+        ],
+        "pyReportToUserName": "",
+        "pyReportTo": "",
+        "pyOrganization": "DXIL",
+        "pyTitle": "",
+        "pyLabel": "User.DigV2",
+        "pyEmailAddress": "User@DigV2",
+        "pyTelephone": ""
+    }
+  },
+  status: 200,
+  statusText: '',
+  headers: {
+    'content-length': '435',
+    'content-type': 'application/json;charset=UTF-8'
+  },
+  request: {}
+};
+
+export default operatorDetails;

package/src/tasks/create/templates/SDK-React/template/FORM/demo.stories.jsx.mustache

@@ -0,0 +1,200 @@
+import { useState } from 'react';
+
+import { withKnobs } from '@storybook/addon-knobs';
+
+import {{COMPONENT_CLASS_NAME}} from './index.tsx';
+
+export default {
+  title: '{{COMPONENT_CLASS_NAME}}',
+  decorators: [withKnobs],
+  component: {{COMPONENT_CLASS_NAME}}
+};
+
+if (!window.PCore) {
+  window.PCore = {};
+}
+
+window.PCore = {
+  getErrorHandler() {
+    return {
+      getGenericFailedMessage() {
+        /* nothing */
+      }
+    };
+  }
+};
+
+export const Base{{COMPONENT_CLASS_NAME}} = () => {
+
+  const [firstName, setFirstName] = useState('John');
+  const [middleName, setMiddleName] = useState('');
+  const [lastName, setLastName] = useState('Joe');
+  const [phone, setPhone] = useState('+16397975093');
+  const [suffix, setSuffix] = useState('');
+  const [email, setEmail] = useState('john@doe.com');
+
+  const props = {
+    NumCols: "1",
+    template: 'DefaultForm',
+
+    getPConnect: () => {
+      return {
+        getChildren: () => {
+          return [
+            {
+              getPConnect: () => {
+                return {
+                  getChildren: () => {
+                    return [
+                      {
+                        readOnly: undefined,
+                        placeholder: 'First Name',
+                        value: firstName,
+                        label: 'First Name',
+                        hasSuggestions: false,
+                        onChange: val => {
+                          setFirstName(val.target.value);
+                        }
+                      },
+                      {
+                        readOnly: undefined,
+                        placeholder: 'Middle Name',
+                        value: middleName,
+                        label: 'Middle Name',
+                        hasSuggestions: false,
+                        onChange: val => {
+                          setMiddleName(val.target.value);
+                        }
+                      },
+
+                      {
+                        value: lastName,
+                        label: 'Last Name',
+                        required: true,
+                        placeholder: 'Last Name',
+                        testId: '77587239BF4C54EA493C7033E1DBF636',
+                        hasSuggestions: false,
+                        onChange: val => {
+                          setLastName(val.target.value);
+                        }
+                      },
+
+                      {
+                        readOnly: undefined,
+                        value: phone,
+                        label: 'Phone Number',
+                        datasource: {
+                          fields: {
+                            value: undefined
+                          },
+                          source: [
+                            {
+                              value: '+1'
+                            },
+                            {
+                              value: '+91'
+                            },
+                            {
+                              value: '+48'
+                            },
+                            {
+                              value: '+44'
+                            }
+                          ]
+                        },
+                        hasSuggestions: false,
+                        onChange: val => {
+                          setPhone(val.value);
+                        },
+                        onBlur: () => {
+                          /* nothing */
+                        }
+                      },
+
+                      {
+                        value: suffix,
+                        label: 'Suffix',
+                        placeholder: 'Select...',
+                        listType: 'associated',
+                        datasource: [
+                          {
+                            key: 'Sr',
+                            value: 'Sr'
+                          },
+                          {
+                            key: 'Jr',
+                            value: 'Jr'
+                          },
+                          {
+                            key: 'III',
+                            value: 'III'
+                          },
+                          {
+                            key: 'IV',
+                            value: 'IV'
+                          },
+                          {
+                            key: 'V',
+                            value: 'V'
+                          }
+                        ],
+                        testId: '56E6DDD1CB6CEC596B433440DFB21C17',
+                        hasSuggestions: false,
+                        deferDatasource: false,
+                        getPConnect: () => {
+                          return {
+                            getContextName: () => {
+                              return null;
+                            },
+                            getDataObject: () => {
+                              return null;
+                            },
+                            getActionsApi: () => {
+                              return {
+                                updateFieldValue: (propName, value) => {
+                                  setSuffix(value);
+                                },
+                                triggerFieldChange: () => {
+                                  /* nothing */
+                                }
+                              };
+                            },
+                            getStateProps: () => {
+                              return {
+                                value: ''
+                              };
+                            }
+                          };
+                        },
+                        onChange: val => {
+                          setSuffix(val.target.value);
+                        }
+                      },
+
+                      {
+                        value: email,
+                        label: 'Email',
+                        required: true,
+                        testId: 'CE8AE9DA5B7CD6C3DF2929543A9AF92D',
+                        hasSuggestions: false,
+                        onChange: val => {
+                          setEmail(val.target.value);
+                        }
+                      }
+                    ];
+                  }
+                };
+              }
+            }
+          ];
+        }
+      };
+    }
+  };
+
+  return (
+    <>
+      <{{COMPONENT_CLASS_NAME}} {...props}></{{COMPONENT_CLASS_NAME}}>
+    </>
+  );
+};

package/src/tasks/index.js

@@ -1,5 +1,6 @@
 export { default as createComponent } from './create/index.js';
 export { default as overrideComponent } from './override/index.js';
+export { default as overrideAllComponents } from './override-all/index.js';
 export { default as deleteComponent } from './delete/index.js';
 export { default as deleteAllComponents } from './delete-all/index.js';
 export { default as mapAllComponents } from './map-all/index.js';

package/src/tasks/override/index.js

@@ -57,7 +57,7 @@ const checkAndCreateConfigComponentKey = async (targetDirectory) => {
       }
 
 
-      // stringify "4", makes the json string look like JSON in the file
+      // stringify "4", makes the json string look like JSON in the file, formated instead of a single line
       const configContent = JSON.stringify(configObj, null, 4);
 
       // update file
@@ -67,7 +67,9 @@ const checkAndCreateConfigComponentKey = async (targetDirectory) => {
   }
   catch (err) {
     // no config-ext.json file, so no update, which is ok
-    console.log(chalk.yellow("Component has no config file for extension."));
+    const arPaths = targetDirectory.split("/");
+    const compName = arPaths[arPaths.length-1] ;
+    console.log(chalk.yellow(`Component ${compName} has no config file for extension.`));
   }
 }
 

package/src/tasks/override-all/index.js

@@ -0,0 +1,218 @@
+import path from 'path';
+import fs from 'fs';
+import { promisify } from 'util';
+import { join } from 'path';
+
+import inquirer from 'inquirer';
+import ncp from 'ncp';
+import chalk from 'chalk';
+import { updateComponentMap  } from '../map/map.js';
+
+import { checkPathAccess, showVersion, getPegaConfig } from '../../util.js';
+import {
+  getComponentDirectoryPath,
+  getComponents,
+  getComponentDefaults
+} from '../../util.js';
+
+import { COMPONENT_SCHEMA, 
+  CATEGORY_OVERRIDE, 
+  SDK_CONFIG_JSON_FILENAME, 
+  DXCB_CONFIG, 
+  DXCB_COMPONENT_DEFAULTS,
+  CUSTOM_TEMPLATES,
+  OVERRIDE_TEMPLATE_PATH,
+  OVERRIDE_LIB_PATH } from '../../constants.js';
+import { compileMustacheTemplates } from '@pega/dx-component-builder-sdk/src/tasks/create/index.js';
+
+const pegaConfigJsonPath = path.join(path.resolve(), SDK_CONFIG_JSON_FILENAME);
+
+const copy = promisify(ncp);
+
+const copyComponentTemplate = async options => {
+  return copy(options.overrideDirectory, options.targetDirectory, {
+    clobber: false
+  });
+};
+
+
+const checkAndCreateConfigComponentKey = async (targetDirectory) => {
+
+  const configFile = path.join(targetDirectory, "config-ext.json");
+  try {
+    const configData = fs.readFileSync(path.resolve(configFile), 'utf8');
+    let configObj = JSON.parse(configData);
+
+    let writeUpdate = false;
+    if (!configObj.componentKey || !configObj.label) {
+      const name = configObj.name;
+
+      if (!configObj.componentKey) {
+        const componentKey = name;
+        configObj = { componentKey, ...configObj };
+      }
+
+      if (!configObj.label) {
+        const label = name;
+        configObj = { label, ...configObj };
+      }
+
+
+      // stringify "4", makes the json string look like JSON in the file, formated instead of a single line
+      const configContent = JSON.stringify(configObj, null, 4);
+
+      // update file
+      fs.writeFileSync(configFile, configContent, { encoding: 'utf8' });
+    }
+
+  }
+  catch (err) {
+    // no config-ext.json file, so no update, which is ok
+    const arPaths = targetDirectory.split("/");
+    const compName = arPaths[arPaths.length-1] ;
+    console.log(chalk.yellow(`Component ${compName} has no config file for extension.`));
+  }
+}
+
+
+const getListAvailableComponents = async (type) => {
+  const components = await getComponents(false, CATEGORY_OVERRIDE);
+  const fullList = COMPONENT_SCHEMA.overrideComponent[type];
+  let availList = [];
+  for (var el in fullList) {
+
+    let listEl = fullList[el].value;
+
+    if (listEl.indexOf("/") >=0) {
+      const arKey = listEl.split("/");
+      listEl = arKey[arKey.length - 1];
+    }
+
+    if (components.includes(listEl)) {
+      // currently don't show, because too many separators inquirer flaky
+      //availList.push(new inquirer.Separator("** " + fullList[el].name));
+    }
+    else {
+      availList.push(fullList[el]);
+    }
+  }
+
+  return availList;
+}
+
+
+const validateCompile = async (
+  {
+    componentName,
+    type
+  },
+  options
+) => {
+
+  let pegaConfig =
+  await getPegaConfig();
+  let templateParentDir = OVERRIDE_LIB_PATH;
+
+  if (pegaConfig[DXCB_CONFIG] &&
+    pegaConfig[DXCB_CONFIG][CUSTOM_TEMPLATES] &&
+    pegaConfig[DXCB_CONFIG][CUSTOM_TEMPLATES][OVERRIDE_TEMPLATE_PATH] && 
+    pegaConfig[DXCB_CONFIG][CUSTOM_TEMPLATES][OVERRIDE_TEMPLATE_PATH] != "") {
+    templateParentDir = pegaConfig[DXCB_CONFIG][CUSTOM_TEMPLATES][OVERRIDE_TEMPLATE_PATH];
+  }
+
+  // componentName has sub directory if components are in a sub directory of main "type"
+  const overrideDirectory = `${templateParentDir}/${type}/${componentName}`;
+
+  await checkPathAccess(overrideDirectory);
+
+  let componentKey = componentName;
+  if (componentKey.indexOf("/") >= 0) {
+    componentKey = componentKey.split("/")[1];
+  }
+  const typeLC = type.toLowerCase();
+  const targetDirectory = await getComponentDirectoryPath(join(typeLC, "/",componentKey), CATEGORY_OVERRIDE);
+
+  const components = await getComponents(false, CATEGORY_OVERRIDE);
+  if (components.includes(componentKey)) {
+    console.log(chalk.red(`${componentKey} component already exists in ${targetDirectory}`));
+    return;
+  }
+
+  await copyComponentTemplate({
+    ...options,
+    targetDirectory,
+    overrideDirectory
+  });
+
+  await checkAndCreateConfigComponentKey(targetDirectory);
+
+
+  console.log(chalk.green(`> Created ${componentKey} component in ${targetDirectory}`));
+
+  const componentKeyWithType = join(type, componentKey);
+  await updateComponentMap(componentKeyWithType, CATEGORY_OVERRIDE);
+
+  console.log(chalk.green(`> Added ${componentKeyWithType} to map`));
+
+};
+
+const buildOverridComponents = async (type, compList, options) => {
+  if (compList.length > 0) {
+    for (var index in compList) {
+      let componentName = compList[index].value;
+      await validateCompile(
+        {
+          componentName,
+          type
+        },
+        options
+      );
+    }
+  }
+  else {
+    console.log(chalk.green(`> All ${type} components have already been created.`));
+  }
+
+
+}
+
+export default async options => {
+  showVersion();
+
+  await checkPathAccess(pegaConfigJsonPath);
+
+  let data = fs.readFileSync(pegaConfigJsonPath, { encoding: 'utf8' });
+  data = data && JSON.parse(data);
+
+  if (!data[DXCB_CONFIG] || !data[DXCB_CONFIG][DXCB_COMPONENT_DEFAULTS]) {
+    console.error(
+      `${chalk.red.bold('ERROR')} Could not able find components defaults path in config.json`
+    );
+    process.exit(1);
+  }
+
+  const componentData = data[DXCB_CONFIG][DXCB_COMPONENT_DEFAULTS];
+
+  const { organization, library} = componentData;
+
+  let componentDefaults = await getComponentDefaults();
+  componentDefaults.library = library;
+
+  const fieldList = await getListAvailableComponents("field");
+  const desList = await getListAvailableComponents("designSystemExtension");
+  const templateList = await getListAvailableComponents("template");
+  const widgetList = await getListAvailableComponents("widget");
+  const infraList = await getListAvailableComponents("infra");
+
+ 
+  await buildOverridComponents("field", fieldList, options);
+  await buildOverridComponents("template", templateList, options);
+  await buildOverridComponents("widget", widgetList, options);
+  await buildOverridComponents("designSystemExtension", desList, options);
+  await buildOverridComponents("infra", infraList, options);
+
+ 
+
+};
+
+