@pega/dx-component-builder-sdk 0.1.6 → 0.1.8

package/src/util.js

@@ -34,7 +34,9 @@ import {
   COMPONENT_PREFIX_TEMPLATES_PATH,
   COMPONENT_PREFIX_WIDGETS_PATH,
   COMPONENT_PREFIX_DSE_PATH,
-  COMPONENT_PREFIX_INFRA_PATH
+  COMPONENT_PREFIX_INFRA_PATH,
+  CATEGORY_CUSTOM,
+  CATEGORY_OVERRIDE
 } from './constants.js';
 
 
@@ -54,7 +56,7 @@ export const checkPathAccess = async (path, options = {}) => {
   }
 };
 
-export const deleteLocalComponent = async (componentKey, category = "custom") => {
+export const deleteLocalComponent = async (componentKey, category = CATEGORY_CUSTOM) => {
   const currentDirectory = process.cwd();
   const pegaConfigJsonPath = join(currentDirectory, DXCB_CONFIG_JSON_FILENAME);
   const categoryDirectory = join("/", category.toLowerCase());
@@ -128,7 +130,26 @@ export const deleteServerComponent = async componentKey => {
   }
 };
 
-export const getComponents = async (showSeparator = false, category = "custom") => {
+export const getOptionsCategory = (options) => {
+  let categoryType = null;
+  if (options.params[3]) {
+    let catType = options.params[3];
+
+    switch (catType.toLowerCase()) {
+      case "override" :
+      case "o" :
+        categoryType = "override";
+        break;
+      case "custom" :
+        case "c" :
+          categoryType = "custom";
+          break;
+      }
+  }
+  return categoryType;
+}
+
+export const getComponents = async (showSeparator = false, category = CATEGORY_CUSTOM) => {
   const currentDirectory = process.cwd();
   const pegaConfigJsonPath = join(currentDirectory, DXCB_CONFIG_JSON_FILENAME);
   const categoryDirectory = join("/", category.toLowerCase());
@@ -150,7 +171,7 @@ export const getComponents = async (showSeparator = false, category = "custom")
   let compList = new Array();
 
   switch (category) {
-    case "custom":
+    case CATEGORY_CUSTOM:
       const fieldComps = await getSubComponents(directory, FIELD_PATH);
       const templateComps = await getSubComponents(directory, TEMPLATE_PATH);
       const widgetComps = await getSubComponents(directory, WIDGET_PATH);
@@ -172,7 +193,7 @@ export const getComponents = async (showSeparator = false, category = "custom")
         compList.push(...widgetComps);
       }
       break;
-    case "override":
+    case CATEGORY_OVERRIDE:
       const formsComps = await getSubComponents(directory, FORMS_PATH);
       const templatesComps = await getSubComponents(directory, TEMPLATES_PATH);
       const widgetsComps = await getSubComponents(directory, WIDGETS_PATH);
@@ -223,7 +244,30 @@ export const getSubComponents = async (directory, type) => {
   .map(dirent => dirent.name);
 }
 
-export const getComponentsObj = async (showSeparator = false, category = "custom") => {
+
+export const getDirectoryFiles = async (directory) => {
+  return fs
+  .readdirSync(directory, { withFileTypes: true })
+  .filter(dirent => !dirent.isDirectory())
+  .map(dirent => dirent.name);
+}
+
+/*
+export const createBlankConfigExt = async (directory, name) => {
+
+  let fileData = "{";
+  fileData = fileData.concat("\n\t");
+  fileData = fileData.concat("\"name\" : \"");
+  fileData = fileData.concat(`${name}`);
+  fileData = fileData.concat("\", \n\t");
+  fileData = fileData.concat("\"properties\" : [ ] \n");
+  fileData = fileData.concat("}");
+  return fs.writeFileSync( join(directory, "/config-ext.json"), fileData, { encoding: 'utf8' });
+}
+*/
+
+
+export const getComponentsObj = async (showSeparator = false, category = CATEGORY_CUSTOM) => {
   const currentDirectory = process.cwd();
   const pegaConfigJsonPath = join(currentDirectory, DXCB_CONFIG_JSON_FILENAME);
   const categoryDirectory = join("/", category.toLowerCase());
@@ -244,7 +288,7 @@ export const getComponentsObj = async (showSeparator = false, category = "custom
   let compList = new Array();
 
   switch (category) {
-    case "custom":
+    case CATEGORY_CUSTOM:
       const fieldComps = await getSubComponents(directory, FIELD_PATH);
       const templateComps = await getSubComponents(directory, TEMPLATE_PATH);
       const widgetComps = await getSubComponents(directory, WIDGET_PATH);
@@ -289,7 +333,7 @@ export const getComponentsObj = async (showSeparator = false, category = "custom
         ));
       }
       break;
-    case "override":
+    case CATEGORY_OVERRIDE:
       const formsComps = await getSubComponents(directory, FORMS_PATH);
       const templatesComps = await getSubComponents(directory, TEMPLATES_PATH);
       const widgetsComps = await getSubComponents(directory, WIDGETS_PATH);
@@ -381,7 +425,9 @@ export const getSubComponentsAndDir = async (directory, type) => {
   .map(dirent => prefix + dirent.name);
 }
 
-export const getComponentsAndSubDirectory = async (category = "custom") => {
+
+
+export const getComponentsAndSubDirectory = async (category = CATEGORY_CUSTOM) => {
   const currentDirectory = process.cwd();
   const pegaConfigJsonPath = join(currentDirectory, DXCB_CONFIG_JSON_FILENAME);
   const categoryDirectory = join("/", category.toLowerCase());
@@ -465,7 +511,7 @@ export const getComponentDefaults = async () => {
   return config.component;
 };
 
-export const getComponentDirectoryPath = async (componentKey, category = "custom") => {
+export const getComponentDirectoryPath = async (componentKey, category = CATEGORY_CUSTOM) => {
   const currentDirectory = process.cwd();
   const pegaConfigJsonPath = join(currentDirectory, DXCB_CONFIG_JSON_FILENAME);
   const categoryDirectory = join("/", category.toLowerCase());

package/src/tasks/create/templates/Constellation/Field/Picklist/picklist.js.mustache

@@ -1,43 +0,0 @@
-import {EmailDisplay, PhoneDisplay, URLDisplay } from "@pega/cosmos-react-core";
-
-export const formatExists = (formatterVal) => {
-    const formatterValues = [
-      "TextInput",
-      "WorkStatus",
-      "RichText",
-      "Email",
-      "Phone",
-      "URL",
-      "Operator"
-    ];
-    let isformatter = false;
-    if (formatterValues.includes(formatterVal)) {
-      isformatter = true;
-    }
-    return isformatter;
-  };
-
-
-export const textFormatter = (formatter,value) => {
-  let displayComponent = null;
-  switch(formatter){
-    case "TextInput" : {
-      displayComponent = value;
-      break;
-    }
-    case "Email" : {
-      displayComponent = (<EmailDisplay value={value} displayText={value} variant="link" />);
-      break;
-    }
-    case "Phone" : {
-      displayComponent = (<PhoneDisplay value={value} variant="link" />);
-      break;
-    }
-    case "URL" : {
-      displayComponent = (<URLDisplay target="_blank" value={value} displayText={value} variant="link" />);
-      break;
-    }
-    // no default
-  }
-  return displayComponent;
-};

package/src/tasks/create/templates/Constellation/Field/Text-Email/text-email.js.mustache

@@ -1,43 +0,0 @@
-import {EmailDisplay, PhoneDisplay, URLDisplay } from "@pega/cosmos-react-core";
-
-export const formatExists = (formatterVal) => {
-    const formatterValues = [
-      "TextInput",
-      "WorkStatus",
-      "RichText",
-      "Email",
-      "Phone",
-      "URL",
-      "Operator"
-    ];
-    let isformatter = false;
-    if (formatterValues.includes(formatterVal)) {
-      isformatter = true;
-    }
-    return isformatter;
-  };
-
-
-export const textFormatter = (formatter,value) => {
-  let displayComponent = null;
-  switch(formatter){
-    case "TextInput" : {
-      displayComponent = value;
-      break;
-    }
-    case "Email" : {
-      displayComponent = (<EmailDisplay value={value} displayText={value} variant="link" />);
-      break;
-    }
-    case "Phone" : {
-      displayComponent = (<PhoneDisplay value={value} variant="link" />);
-      break;
-    }
-    case "URL" : {
-      displayComponent = (<URLDisplay target="_blank" value={value} displayText={value} variant="link" />);
-      break;
-    }
-    // no default
-  }
-  return displayComponent;
-};

package/src/tasks/create/templates/Constellation/Field/Text-Input/text-input.js.mustache

@@ -1,43 +0,0 @@
-import {EmailDisplay, PhoneDisplay, URLDisplay } from "@pega/cosmos-react-core";
-
-export const formatExists = (formatterVal) => {
-    const formatterValues = [
-      "TextInput",
-      "WorkStatus",
-      "RichText",
-      "Email",
-      "Phone",
-      "URL",
-      "Operator"
-    ];
-    let isformatter = false;
-    if (formatterValues.includes(formatterVal)) {
-      isformatter = true;
-    }
-    return isformatter;
-  };
-
-
-export const textFormatter = (formatter,value) => {
-  let displayComponent = null;
-  switch(formatter){
-    case "TextInput" : {
-      displayComponent = value;
-      break;
-    }
-    case "Email" : {
-      displayComponent = (<EmailDisplay value={value} displayText={value} variant="link" />);
-      break;
-    }
-    case "Phone" : {
-      displayComponent = (<PhoneDisplay value={value} variant="link" />);
-      break;
-    }
-    case "URL" : {
-      displayComponent = (<URLDisplay target="_blank" value={value} displayText={value} variant="link" />);
-      break;
-    }
-    // no default
-  }
-  return displayComponent;
-};

package/src/tasks/create/templates/Constellation/Field/Text-Paragraph/text-paragraph.js.mustache

@@ -1,43 +0,0 @@
-import {EmailDisplay, PhoneDisplay, URLDisplay } from "@pega/cosmos-react-core";
-
-export const formatExists = (formatterVal) => {
-    const formatterValues = [
-      "TextInput",
-      "WorkStatus",
-      "RichText",
-      "Email",
-      "Phone",
-      "URL",
-      "Operator"
-    ];
-    let isformatter = false;
-    if (formatterValues.includes(formatterVal)) {
-      isformatter = true;
-    }
-    return isformatter;
-  };
-
-
-export const textFormatter = (formatter,value) => {
-  let displayComponent = null;
-  switch(formatter){
-    case "TextInput" : {
-      displayComponent = value;
-      break;
-    }
-    case "Email" : {
-      displayComponent = (<EmailDisplay value={value} displayText={value} variant="link" />);
-      break;
-    }
-    case "Phone" : {
-      displayComponent = (<PhoneDisplay value={value} variant="link" />);
-      break;
-    }
-    case "URL" : {
-      displayComponent = (<URLDisplay target="_blank" value={value} displayText={value} variant="link" />);
-      break;
-    }
-    // no default
-  }
-  return displayComponent;
-};

package/src/tasks/create/templates/Constellation/Field/Text-Phone/text-phone.js.mustache

@@ -1,43 +0,0 @@
-import {EmailDisplay, PhoneDisplay, URLDisplay } from "@pega/cosmos-react-core";
-
-export const formatExists = (formatterVal) => {
-    const formatterValues = [
-      "TextInput",
-      "WorkStatus",
-      "RichText",
-      "Email",
-      "Phone",
-      "URL",
-      "Operator"
-    ];
-    let isformatter = false;
-    if (formatterValues.includes(formatterVal)) {
-      isformatter = true;
-    }
-    return isformatter;
-  };
-
-
-export const textFormatter = (formatter,value) => {
-  let displayComponent = null;
-  switch(formatter){
-    case "TextInput" : {
-      displayComponent = value;
-      break;
-    }
-    case "Email" : {
-      displayComponent = (<EmailDisplay value={value} displayText={value} variant="link" />);
-      break;
-    }
-    case "Phone" : {
-      displayComponent = (<PhoneDisplay value={value} variant="link" />);
-      break;
-    }
-    case "URL" : {
-      displayComponent = (<URLDisplay target="_blank" value={value} displayText={value} variant="link" />);
-      break;
-    }
-    // no default
-  }
-  return displayComponent;
-};

package/src/tasks/create/templates/Constellation/Field/Text-URL/text-url.js.mustache

@@ -1,172 +0,0 @@
-import {EmailDisplay, PhoneDisplay, URLDisplay } from "@pega/cosmos-react-core";
-
-export const formatExists = (formatterVal) => {
-    const formatterValues = [
-      "TextInput",
-      "WorkStatus",
-      "RichText",
-      "Email",
-      "Phone",
-      "URL",
-      "Operator"
-    ];
-    let isformatter = false;
-    if (formatterValues.includes(formatterVal)) {
-      isformatter = true;
-    }
-    return isformatter;
-  };
-
-const urlLabelVal = (urlLabelSelection, btnVal, urlLabel, propUrlLabel) => {
-  if ((urlLabel !== '' || propUrlLabel !== '') && btnVal !== null) {
-    switch (urlLabelSelection) {
-      case 'constant': {
-        btnVal = urlLabel;
-        break;
-      }
-      case 'propertyRef': {
-        btnVal = propUrlLabel;
-        break;
-      }
-      // no default
-    }
-  }
-  return btnVal;
-};
-
-const isImage = (url) => /\.(jpg|jpeg|png|webp|avif|gif|svg)$/.test(url);
-
-const TableImage = (imageProps) => {
-  const { value, altText, altTextOfImage, propaltTextOfImage, urlLabelSelection, urlLabel, propUrlLabel } = imageProps;
-  const demoButtonRef = useRef(null);
-  let imageDisplayComp = null;
-  const [images, setImages] = useState(null);
-  const imgDescription = {
-    id: 'url',
-    name: urlLabelSelection === 'constant' ? urlLabel : propUrlLabel,
-    description: altText === 'constant' ? altTextOfImage : propaltTextOfImage,
-    src: value
-  };
-  const onClick = () => {
-    setImages([imgDescription]);
-  };
-  const onItemDownload = async (id) => {
-    const a = document.createElement('a');
-    a.href = await fetch(images[0].src)
-      .then((response) => {
-        return response.blob();
-      })
-      .then((blob) => {
-        return URL.createObjectURL(blob);
-      });
-    a.download = images?.find((image) => image.id === id)?.name ?? id;
-    document.body.appendChild(a);
-    a.click();
-    document.body.removeChild(a);
-  };
-  let btnVal = value;
-  btnVal = urlLabelVal(urlLabelSelection, btnVal, urlLabel, propUrlLabel);
-  imageDisplayComp = (
-    <React.Fragment>
-      {btnVal !== null && (
-        <Button ref={demoButtonRef} variant='link' compact={false} onClick={onClick} autoFocus>
-          {btnVal}
-        </Button>
-      )}
-      {images && (
-        <Lightbox
-          items={images}
-          cycle={false}
-          onAfterClose={() => {
-            setImages(null);
-            demoButtonRef.current?.focus();
-          }}
-          onItemDownload={isImage(images[0].src) ? onItemDownload : undefined}
-        />
-      )}
-    </React.Fragment>
-  );
-  return imageDisplayComp;
-};
-
-export const textFormatter = (formatter,value) => {
-  let displayComponent = null;
-  switch(formatter){
-    case "TextInput" : {
-      displayComponent = value;
-      break;
-    }
-    case "Email" : {
-      displayComponent = (<EmailDisplay value={value} displayText={value} variant="link" />);
-      break;
-    }
-    case "Phone" : {
-      displayComponent = (<PhoneDisplay value={value} variant="link" />);
-      break;
-    }
-    case "URL" : {
-      displayComponent = (<URLDisplay target="_blank" value={value} displayText={value} variant="link" />);
-      break;
-    }
-    // no default
-  }
-  return displayComponent;
-};
-
-/**
- * Returns a URL display component based on the options
- * @function urlFormatter
- * @param {string} value value
- * @param {object} options options for formatting
- * { displayAs,tableDisplayAs,isTableFormatter,altText,altTextOfImage,propaltTextOfImage,urlLabelSelection, urlLabel,propUrlLabel, widthSel, customWidth}
- */
-export const urlFormatter = (value, options) => {
-  const {
-    displayAs,
-    tableDisplayAs,
-    isTableFormatter,
-    altText,
-    altTextOfImage,
-    propaltTextOfImage,
-    urlLabelSelection,
-    urlLabel,
-    propUrlLabel,
-    widthSel,
-    customWidth
-  } = options;
-
-  let urlFormatComp = null;
-  if (
-    (displayAs === 'labelText' || (isTableFormatter && tableDisplayAs === 'link')) &&
-    (urlLabel !== '' || propUrlLabel !== '')
-  ) {
-    urlFormatComp = (
-      <URLDisplay
-        target='_blank'
-        value={value}
-        displayText={urlLabelSelection === 'constant' ? urlLabel : propUrlLabel}
-        variant='link'
-      />
-    );
-  } else if ((displayAs === 'Image' || tableDisplayAs === 'Image') && !!value) {
-    if (isTableFormatter) {
-      urlFormatComp = TableImage({
-        value,
-        altText,
-        altTextOfImage,
-        propaltTextOfImage,
-        urlLabelSelection,
-        urlLabel,
-        propUrlLabel
-      });
-    } else {
-      const width = widthSel === 'widthpx' ? customWidth : null;
-      urlFormatComp = (
-        <Image src={value} width={width} alt={altText === 'constant' ? altTextOfImage : propaltTextOfImage} />
-      );
-    }
-  } else {
-    urlFormatComp = <URLDisplay target='_blank' value={value} displayText={value} variant='link' />;
-  }
-  return urlFormatComp;
-};