@pega/custom-dx-components 24.2.15 → 25.1.10-alpha-0.1

package/src/tasks/create/templates/Constellation/Template/DETAILS/demo.stories.tsx.mustache

@@ -24,6 +24,7 @@ if (!window.PCore) {
   window.PCore = {} as any;
 }
 
+
 window.PCore.getLocaleUtils = () => {
   return {
     getLocaleValue: (value: any) => {

package/src/tasks/create/templates/Constellation/Template/DETAILS/demo.test.tsx.mustache

@@ -0,0 +1,47 @@
+// import { expect, test } from '@jest/globals';
+import { fireEvent, render, screen } from '@testing-library/react';
+import { composeStories } from '@storybook/react';
+import '@testing-library/jest-dom';
+
+import * as DemoStories from './demo.stories';
+
+
+
+const { Base{{COMPONENT_CLASS_NAME}} } = composeStories(DemoStories);
+
+test('renders {{COMPONENT_CLASS_NAME}}', async () => {
+  render(<Base{{COMPONENT_CLASS_NAME}} />);
+  expect(await screen.findByText('Details template')).toBeVisible();
+  expect(await screen.findByText('Work Status')).toBeVisible();
+  expect(await screen.findByText('Case ID')).toBeVisible();
+  expect(await screen.findByText('Create date/time')).toBeVisible();
+  expect(await screen.findByText('Create Operator')).toBeVisible();
+
+  // expect(await screen.findByText('New')).toBeVisible();
+
+  expect(await screen.findByText('M-1002')).toBeVisible();
+  expect(await screen.findByText('December 11, 2022 at 8:06:27 PM')).toBeVisible();
+
+  expect(await screen.findByText('SLA Deadline')).toBeVisible();
+  expect(await screen.findByText('SLA Goal')).toBeVisible();
+  expect(await screen.findByText('SLA Start Time')).toBeVisible();
+
+  expect(await screen.findByText('Deadline')).toBeVisible();
+  expect(await screen.findByText('Goal')).toBeVisible();
+  expect(await screen.findByText('Start Time')).toBeVisible();
+
+  const frenchBefore = screen.queryByText('french DigV2');
+  expect(frenchBefore).not.toBeInTheDocument();
+
+  // admin button
+  const adminButton = screen.getByRole('button');
+  fireEvent.click(adminButton);
+
+  const frenchArr = await screen.findAllByText('french DigV2');
+  expect(frenchArr[0]).toBeVisible();
+  expect(frenchArr[1]).toBeVisible();
+
+
+
+
+});

package/src/tasks/create/templates/Constellation/Template/DETAILS-region/config.json.mustache

@@ -9,6 +9,7 @@
   "componentKey": "{{COMPONENT_KEY}}",
   "type": "{{TYPE}}",
   "subtype": {{{SUB_TYPE}}},
+  "subtypeLabel": "{{SUB_TYPE_LABEL}}",
   "icon": "TwoColumnDetails.svg",
   "properties": [
     {

package/src/tasks/create/templates/Constellation/Template/DETAILS-region/create-nonce.ts.mustache

@@ -2,5 +2,6 @@
 // @ts-ignore
 if (window?.__webpack_nonce__) {
   // @ts-ignore
+  // eslint-disable-next-line no-undef
   __webpack_nonce__ = window.__webpack_nonce__;
 }

package/src/tasks/create/templates/Constellation/Template/DETAILS-region/demo.test.tsx.mustache

@@ -0,0 +1,58 @@
+// import { expect, test } from '@jest/globals';
+import { fireEvent, render, screen } from '@testing-library/react';
+import { composeStories } from '@storybook/react';
+import '@testing-library/jest-dom';
+
+import * as DemoStories from './demo.stories';
+
+
+
+const { Base{{COMPONENT_CLASS_NAME}} } = composeStories(DemoStories);
+
+test('renders {{COMPONENT_CLASS_NAME}}', async () => {
+  render(<Base{{COMPONENT_CLASS_NAME}} />);
+  expect(await screen.findByText('Details Region template')).toBeVisible();
+  expect(await screen.findByText('Work Status')).toBeVisible();
+  expect(await screen.findByText('Case ID')).toBeVisible();
+  expect(await screen.findByText('Create date/time')).toBeVisible();
+  expect(await screen.findByText('Create Operator')).toBeVisible();
+
+  // expect(await screen.findByText('New')).toBeVisible();
+
+  expect(await screen.findByText('M-1002')).toBeVisible();
+  expect(await screen.findByText('December 11, 2022 at 8:06:27 PM')).toBeVisible();
+
+  // 2 columns of same
+  const SLADeadline = await screen.findAllByText('SLA Deadline');
+  expect(SLADeadline).toHaveLength(2);
+
+  const SLAGoal = await screen.findAllByText('SLA Goal');
+  expect(SLAGoal).toHaveLength(2);
+
+  const SLAStartTime = await screen.findAllByText('SLA Start Time');
+  expect(SLAStartTime).toHaveLength(2);
+
+  const Deadline = await screen.findAllByText('Deadline');
+  expect(Deadline).toHaveLength(2);
+
+  const Goal = await screen.findAllByText('Goal');
+  expect(Goal).toHaveLength(2);
+
+  const StartTime = await screen.findAllByText('Start Time');
+  expect(StartTime).toHaveLength(2);
+
+  const frenchBefore = screen.queryByText('french DigV2');
+  expect(frenchBefore).not.toBeInTheDocument();
+
+  // admin button
+  const adminButton = screen.getByRole('button');
+  fireEvent.click(adminButton);
+
+  const frenchArr = await screen.findAllByText('french DigV2');
+  expect(frenchArr[0]).toBeVisible();
+  expect(frenchArr[1]).toBeVisible();
+
+
+
+
+});

package/src/tasks/create/templates/Constellation/Template/FORM/config.json.mustache

@@ -9,6 +9,7 @@
   "componentKey": "{{COMPONENT_KEY}}",
   "type": "{{TYPE}}",
   "subtype": {{{SUB_TYPE}}},
+  "subtypeLabel": "{{SUB_TYPE_LABEL}}",
   "icon": "DefaultForm.svg",
     "properties": [
     {

package/src/tasks/create/templates/Constellation/Template/FORM/create-nonce.ts.mustache

@@ -2,5 +2,6 @@
 // @ts-ignore
 if (window?.__webpack_nonce__) {
   // @ts-ignore
+  // eslint-disable-next-line no-undef
   __webpack_nonce__ = window.__webpack_nonce__;
 }

package/src/tasks/create/templates/Constellation/Template/FORM/demo.test.tsx.mustache

@@ -0,0 +1,40 @@
+// import { expect, test } from '@jest/globals';
+import { render, screen } from '@testing-library/react';
+import { composeStories } from '@storybook/react';
+import '@testing-library/jest-dom';
+
+import * as DemoStories from './demo.stories';
+
+const { Base{{COMPONENT_CLASS_NAME}} } = composeStories(DemoStories);
+
+test('renders {{COMPONENT_CLASS_NAME}}', async () => {
+  render(<Base{{COMPONENT_CLASS_NAME}} />);
+  expect(await screen.findByText('Form template')).toBeVisible();
+
+  // labels
+  expect(await screen.findByText('First Name')).toBeVisible();
+  expect(await screen.findByText('Middle Name')).toBeVisible();
+  expect(await screen.findByText('Last Name')).toBeVisible();
+  expect(await screen.findByText('Email')).toBeVisible();
+  expect(await screen.findByText('Phone Number')).toBeVisible();
+  expect(await screen.findByText('Service Date')).toBeVisible();
+
+  const inputElements = screen.getAllByTestId(':input:control');
+  expect((inputElements[0] as HTMLInputElement).value).toBe('John');
+  expect((inputElements[1] as HTMLInputElement).value).toBe('');
+  expect((inputElements[2] as HTMLInputElement).value).toBe('Doe');
+  expect((inputElements[3] as HTMLInputElement).value).toBe('John@doe.com');
+
+  const myPhone = (screen.getByTestId(':phone-input:control') as HTMLInputElement).value;
+  expect(myPhone).toContain('(639) 797-5093');
+
+  const myClearMonth = (screen.getByTestId(':date-input:control-month') as HTMLInputElement).value;
+  expect(myClearMonth).toContain('01');
+
+  const myClearDay = (screen.getByTestId(':date-input:control-day') as HTMLInputElement).value;
+  expect(myClearDay).toContain('25');
+
+  const myClearYear = (screen.getByTestId(':date-input:control-year') as HTMLInputElement).value;
+  expect(myClearYear).toContain('2023');
+
+});

package/src/tasks/create/templates/Constellation/Template/FORM-region/config.json.mustache

@@ -9,6 +9,7 @@
   "componentKey": "{{COMPONENT_KEY}}",
   "type": "{{TYPE}}",
   "subtype": {{{SUB_TYPE}}},
+  "subtypeLabel": "{{SUB_TYPE_LABEL}}",
   "icon": "TwoColumn.svg",
   "properties": [
     {

package/src/tasks/create/templates/Constellation/Template/FORM-region/create-nonce.ts.mustache

@@ -2,5 +2,6 @@
 // @ts-ignore
 if (window?.__webpack_nonce__) {
   // @ts-ignore
+  // eslint-disable-next-line no-undef
   __webpack_nonce__ = window.__webpack_nonce__;
 }

package/src/tasks/create/templates/Constellation/Template/FORM-region/demo.test.tsx.mustache

@@ -0,0 +1,56 @@
+// import { expect, test } from '@jest/globals';
+import { render, screen } from '@testing-library/react';
+import { composeStories } from '@storybook/react';
+import '@testing-library/jest-dom';
+
+import * as DemoStories from './demo.stories';
+
+const { Base{{COMPONENT_CLASS_NAME}} } = composeStories(DemoStories);
+
+test('renders {{COMPONENT_CLASS_NAME}}', async () => {
+  render(<Base{{COMPONENT_CLASS_NAME}} />);
+  expect(await screen.findByText('Form Region template')).toBeVisible();
+
+  // labels
+  expect(await screen.findByText('First Name')).toBeVisible();
+  expect(await screen.findByText('Middle Name')).toBeVisible();
+  expect(await screen.findByText('Last Name')).toBeVisible();
+  expect(await screen.findByText('Email')).toBeVisible();
+  expect(await screen.findByText('Phone Number')).toBeVisible();
+  expect(await screen.findByText('Service Date')).toBeVisible();
+
+  const inputElements = screen.getAllByTestId(':input:control');
+  expect((inputElements[0] as HTMLInputElement).value).toBe('John');
+  expect((inputElements[1] as HTMLInputElement).value).toBe('');
+  expect((inputElements[2] as HTMLInputElement).value).toBe('Doe');
+  expect((inputElements[3] as HTMLInputElement).value).toBe('John@doe.com');
+
+  const myPhone = (screen.getByTestId(':phone-input:control') as HTMLInputElement).value;
+  expect(myPhone).toContain('(639) 797-5093');
+
+  const myClearMonth = (screen.getByTestId(':date-input:control-month') as HTMLInputElement).value;
+  expect(myClearMonth).toContain('01');
+
+  const myClearDay = (screen.getByTestId(':date-input:control-day') as HTMLInputElement).value;
+  expect(myClearDay).toContain('25');
+
+  const myClearYear = (screen.getByTestId(':date-input:control-year') as HTMLInputElement).value;
+  expect(myClearYear).toContain('2023');
+
+  // verify 2 columns
+  const fieldSet = screen.getByRole('group');
+
+  // <fieldset>
+  // <legend></legend>
+  // <div>
+  //  <div>
+  //    <div> 2 divs (columns) </div>
+  //  </div>
+  // </div>
+  // </fieldset>
+
+  // eslint-disable-next-line testing-library/no-node-access
+  expect(fieldSet.children[1].children[0].children[0].children).toHaveLength(2);
+
+
+});

package/src/tasks/create/templates/Constellation/Template/PAGE/config.json.mustache

@@ -9,6 +9,7 @@
   "componentKey": "{{COMPONENT_KEY}}",
   "type": "{{TYPE}}",
   "subtype": {{{SUB_TYPE}}},
+  "subtypeLabel": "{{SUB_TYPE_LABEL}}",
   "icon": "OneColumnPage.svg",
   "properties": [
     {

package/src/tasks/create/templates/Constellation/Template/PAGE/create-nonce.ts.mustache

@@ -2,5 +2,6 @@
 // @ts-ignore
 if (window?.__webpack_nonce__) {
   // @ts-ignore
+  // eslint-disable-next-line no-undef
   __webpack_nonce__ = window.__webpack_nonce__;
 }

package/src/tasks/create/templates/Constellation/Template/PAGE/demo.stories.tsx.mustache

@@ -4,6 +4,7 @@
 import type { Meta, StoryObj } from '@storybook/react';
 
 import { AppAnnouncement as PegaAppAnnouncement } from '@pega/cosmos-react-work';
+import { useRef } from 'react';
 
 import {{COMPONENT_CLASS_NAME}} from './index';
 import { pyHome1Resolved, pyHome1Raw } from './mock';
@@ -32,6 +33,8 @@ export const Base{{COMPONENT_CLASS_NAME}}: Story = (args: any) => {
 
   const configProps = pyHome1Resolved.children[0].children[0].config;
 
+  const myRef = useRef(null);
+
   const props = {
     useConfigurableLayout: false,
     icon: pyHome1Raw.config.icon,
@@ -82,6 +85,7 @@ export const Base{{COMPONENT_CLASS_NAME}}: Story = (args: any) => {
                     }
                   };
                 }}
+                ref={myRef}
               />
             );
           }

package/src/tasks/create/templates/Constellation/Template/PAGE/demo.test.tsx.mustache

@@ -0,0 +1,24 @@
+// import { expect, test } from '@jest/globals';
+import { render, screen } from '@testing-library/react';
+import { composeStories } from '@storybook/react';
+import '@testing-library/jest-dom';
+
+import * as DemoStories from './demo.stories';
+
+
+
+const { Base{{COMPONENT_CLASS_NAME}} } = composeStories(DemoStories);
+
+test('renders {{COMPONENT_CLASS_NAME}}', async () => {
+  render(<Base{{COMPONENT_CLASS_NAME}} />);
+  expect(await screen.findByText('Page Template')).toBeVisible();
+  expect(await screen.findByText('Announcements')).toBeVisible();
+  expect(await screen.findByText('Get next work')).toBeVisible();
+  expect(await screen.findByText("We've launched a brand new experience to accelerate your workflow. Check out the guides to help you get the most of Cosmos.")).toBeVisible();
+
+
+
+
+
+
+});

package/src/tasks/create/templates/Constellation/Widget/CASE/config.json.mustache

@@ -9,6 +9,7 @@
   "componentKey": "{{COMPONENT_KEY}}",
   "type": "{{TYPE}}",
   "subtype": {{{SUB_TYPE}}},
+  "subtypeLabel": "{{SUB_TYPE_LABEL}}",
   "icon": "OneColumnPage.svg",
   "properties": [
    {

package/src/tasks/create/templates/Constellation/Widget/CASE/create-nonce.ts.mustache

@@ -2,5 +2,6 @@
 // @ts-ignore
 if (window?.__webpack_nonce__) {
   // @ts-ignore
+  // eslint-disable-next-line no-undef
   __webpack_nonce__ = window.__webpack_nonce__;
 }

package/src/tasks/create/templates/Constellation/Widget/CASE/demo.stories.tsx.mustache

@@ -40,6 +40,7 @@ export const Base{{COMPONENT_CLASS_NAME}}: Story = (args: any) => {
     return {
       getData: () => {
         return new Promise(resolve => {
+          // @ts-ignore
           resolve(historyData);
         });
       }

package/src/tasks/create/templates/Constellation/Widget/CASE/demo.test.tsx.mustache

@@ -0,0 +1,28 @@
+// import { expect, test } from '@jest/globals';
+import { render, screen } from '@testing-library/react';
+import { composeStories } from '@storybook/react';
+import '@testing-library/jest-dom';
+
+import * as DemoStories from './demo.stories';
+
+
+
+const { Base{{COMPONENT_CLASS_NAME}} } = composeStories(DemoStories);
+
+test('renders {{COMPONENT_CLASS_NAME}}', async () => {
+  render(<Base{{COMPONENT_CLASS_NAME}} />);
+
+  const caseHistoryArr = await screen.findAllByText('Case history');
+  expect(caseHistoryArr[0]).toBeVisible();
+  expect(caseHistoryArr[1]).toBeVisible();
+
+  expect(await screen.findByText('Date')).toBeVisible();
+  expect(await screen.findByText('Description')).toBeVisible();
+  expect(await screen.findByText('Performed by')).toBeVisible();
+
+  const peformedArr = await screen.findAllByText('User DigV2');
+  expect(peformedArr[0]).toBeVisible();
+  expect(peformedArr[1]).toBeVisible();
+
+
+});

package/src/tasks/create/templates/Constellation/Widget/CASE/localizations.json.mustache

@@ -0,0 +1,8 @@
+{
+  "fields": {
+    "Date": "Date",
+    "Description" : "Description",
+    "Performed by" : "Performed by",
+    "Loading case history" : "Loading case history"
+  }
+}

package/src/tasks/create/templates/Constellation/Widget/PAGE/config.json.mustache

@@ -9,6 +9,7 @@
   "componentKey": "{{COMPONENT_KEY}}",
   "type": "{{TYPE}}",
   "subtype": {{{SUB_TYPE}}},
+  "subtypeLabel": "{{SUB_TYPE_LABEL}}",
   "icon": "OneColumnPage.svg",
   "properties": [
       {

package/src/tasks/create/templates/Constellation/Widget/PAGE/create-nonce.ts.mustache

@@ -2,5 +2,6 @@
 // @ts-ignore
 if (window?.__webpack_nonce__) {
   // @ts-ignore
+  // eslint-disable-next-line no-undef
   __webpack_nonce__ = window.__webpack_nonce__;
 }

package/src/tasks/create/templates/Constellation/Widget/PAGE/demo.stories.tsx.mustache

@@ -51,11 +51,13 @@ export const Base{{COMPONENT_CLASS_NAME}}: Story = (args: any) => {
     return {
       getData: () => {
         return new Promise(resolve => {
+          // @ts-ignore
           resolve(worklistData);
         });
       },
       getDataAsync: () => {
         return new Promise(resolve => {
+          // @ts-ignore
           resolve(worklistData);
         });
       }

package/src/tasks/create/templates/Constellation/Widget/PAGE/demo.test.tsx.mustache

@@ -0,0 +1,36 @@
+// import { expect, test } from '@jest/globals';
+import { render, screen } from '@testing-library/react';
+import { composeStories } from '@storybook/react';
+import '@testing-library/jest-dom';
+
+import * as DemoStories from './demo.stories';
+
+
+
+const { Base{{COMPONENT_CLASS_NAME}} } = composeStories(DemoStories);
+
+test('renders {{COMPONENT_CLASS_NAME}}', async () => {
+  render(<Base{{COMPONENT_CLASS_NAME}} />);
+  expect(await screen.findByText('Announcements')).toBeVisible();
+  expect(await screen.findByText("See what's new")).toBeVisible();
+  expect(
+    await screen.findByText('Welcome to MediaCo Application for testing SDK frameworks.')
+  ).toBeVisible();
+
+  const workListArr = screen.getAllByText('Work list');
+  expect(workListArr[0]).toBeVisible();
+  expect(workListArr[1]).toBeInTheDocument();
+
+  expect(await screen.findByText('Case type')).toBeVisible();
+  expect(await screen.findByText('Key')).toBeVisible();
+  expect(await screen.findByText('Status')).toBeVisible();
+  expect(await screen.findByText('Stage')).toBeVisible();
+
+  expect(await screen.findByText('A-8002')).toBeVisible();
+  expect(await screen.findByText('A-7001')).toBeVisible();
+  expect(await screen.findByText('A-9000')).toBeVisible();
+
+
+
+
+});

package/src/tasks/create/templates/Constellation/Widget/PAGE/index.tsx.mustache

@@ -1,4 +1,4 @@
-import { useEffect, useState } from 'react';
+import { useEffect, useState, useRef } from 'react';
 import { withConfiguration, Table } from '@pega/cosmos-react-core';
 import { AppAnnouncement as PegaAppAnnouncement } from '@pega/cosmos-react-work';
 import type { PConnFieldProps } from './PConnProps';
@@ -42,6 +42,8 @@ function {{COMPONENT_CLASS_NAME}}(props: {{COMPONENT_CLASS_NAME}}Props) {
     { renderer: 'stage', label: PConnect.getLocalizedValue('Stage', '', '') }
   ];
 
+  const myRef = useRef(null);
+
   // going to get data for worklist to put into a table
   // data comes from calling a PCore function to get
   // get data from a data page and a PConnect function
@@ -90,6 +92,7 @@ function {{COMPONENT_CLASS_NAME}}(props: {{COMPONENT_CLASS_NAME}}Props) {
       details={details}
       whatsNewLink={whatsnewlink}
       image={image.replace(/ /g, '+')}
+      ref={myRef}
     />
     <br />
     <Table

package/src/tasks/create/templates/Constellation/Widget/PAGE/localizations.json.mustache

@@ -0,0 +1,10 @@
+{
+  "fields": {
+    "Case type": "Case type",
+    "Key" : "Key",
+    "Status" : "Status",
+    "Stage" : "Stage",
+    "Work list" : "Work list",
+    "Loading Work list" : "Loading Work list"
+  }
+}

package/src/tasks/create/templates/Constellation/Widget/PAGE-CASE/config.json.mustache

@@ -9,6 +9,7 @@
   "componentKey": "{{COMPONENT_KEY}}",
   "type": "{{TYPE}}",
   "subtype": {{{SUB_TYPE}}},
+  "subtypeLabel": "{{SUB_TYPE_LABEL}}",
   "icon": "OneColumnPage.svg",
    "properties": [
     {

package/src/tasks/create/templates/Constellation/Widget/PAGE-CASE/create-nonce.ts.mustache

@@ -2,5 +2,6 @@
 // @ts-ignore
 if (window?.__webpack_nonce__) {
   // @ts-ignore
+  // eslint-disable-next-line no-undef
   __webpack_nonce__ = window.__webpack_nonce__;
 }

package/src/tasks/create/templates/Constellation/Widget/PAGE-CASE/demo.stories.tsx.mustache

@@ -30,6 +30,7 @@ window.PCore.getUserApi = () => {
   return {
     getOperatorDetails: () => {
       return new Promise(resolve => {
+        // @ts-ignore
         resolve(operatorDetails);
       });
     }

package/src/tasks/create/templates/Constellation/Widget/PAGE-CASE/demo.test.tsx.mustache

@@ -0,0 +1,29 @@
+// import { expect, test } from '@jest/globals';
+import { fireEvent, render, screen } from '@testing-library/react';
+import { composeStories } from '@storybook/react';
+import '@testing-library/jest-dom';
+
+import * as DemoStories from './demo.stories';
+
+
+
+const { Base{{COMPONENT_CLASS_NAME}} } = composeStories(DemoStories);
+
+test('renders {{COMPONENT_CLASS_NAME}}', async () => {
+  render(<Base{{COMPONENT_CLASS_NAME}} />);
+  expect(await screen.findByText('Create operator')).toBeVisible();
+  // expect(await screen.findByText('last year')).toBeVisible();
+
+  const frenchBefore = screen.queryByText('french DigV2');
+  expect(frenchBefore).not.toBeInTheDocument();
+
+  // admin button
+  const adminButton = screen.getByRole('button');
+  fireEvent.click(adminButton);
+
+  const frenchArr = await screen.findAllByText('french DigV2');
+  expect(frenchArr[0]).toBeVisible();
+  expect(frenchArr[1]).toBeVisible();
+
+
+});

package/src/tasks/create/templates/Launchpad/Field/Icon-Button-URL/config.json.mustache

@@ -9,6 +9,7 @@
   "componentKey": "{{COMPONENT_KEY}}",
   "type": "{{TYPE}}",
   "subtype": {{{SUB_TYPE}}},
+  "subtypeLabel": "{{SUB_TYPE_LABEL}}",
   "icon": "images/pz-url-active.svg",
   "properties": [
     {

package/src/tasks/create/templates/Launchpad/Field/Icon-Button-URL/create-nonce.ts.mustache

@@ -2,5 +2,6 @@
 // @ts-ignore
 if (window?.__webpack_nonce__) {
   // @ts-ignore
+  // eslint-disable-next-line no-undef
   __webpack_nonce__ = window.__webpack_nonce__;
 }

package/src/tasks/create/templates/Launchpad/Field/Icon-Button-URL/demo.stories.tsx.mustache

@@ -14,6 +14,7 @@ const meta: Meta<typeof {{COMPONENT_CLASS_NAME}}> = {
 export default meta;
 type Story = StoryObj<typeof {{COMPONENT_CLASS_NAME}}>;
 
+
 if (!window.PCore) {
   window.PCore = {} as any;
 }

package/src/tasks/create/templates/Launchpad/Field/Icon-Button-URL/demo.test.tsx.mustache

@@ -0,0 +1,27 @@
+// import { expect, test } from '@jest/globals';
+import { fireEvent, render, screen } from '@testing-library/react';
+import { composeStories } from '@storybook/react';
+import '@testing-library/jest-dom';
+
+import * as DemoStories from './demo.stories';
+
+const { Base{{COMPONENT_CLASS_NAME}} } = composeStories(DemoStories);
+
+test('renders {{COMPONENT_CLASS_NAME}}', async () => {
+  render(<Base{{COMPONENT_CLASS_NAME}} />);
+  expect(await screen.findByText('List of countries')).toBeVisible();
+
+  expect(screen.queryByText('United States of America')).not.toBeInTheDocument();
+  expect(screen.queryByText('Canada')).not.toBeInTheDocument();
+  expect(screen.queryByText('Mexico')).not.toBeInTheDocument();
+
+  const iconButton = screen.getByRole('button');
+  fireEvent.click(iconButton);
+
+  expect(await screen.findByText('United States of America')).toBeVisible();
+  expect(await screen.findByText('Canada')).toBeVisible();
+  expect(await screen.findByText('Mexico')).toBeVisible();
+
+  const iconLink = screen.getByRole('link');
+  expect(iconLink).toHaveAttribute('href', 'about:blank');
+});

package/src/tasks/create/templates/Launchpad/Widget/CASE/config.json.mustache

@@ -9,6 +9,7 @@
   "componentKey": "{{COMPONENT_KEY}}",
   "type": "{{TYPE}}",
   "subtype": {{{SUB_TYPE}}},
+  "subtypeLabel": "{{SUB_TYPE_LABEL}}",
   "icon": "OneColumnPage.svg",
   "properties": [
    {

package/src/tasks/create/templates/Launchpad/Widget/CASE/create-nonce.ts.mustache

@@ -2,5 +2,6 @@
 // @ts-ignore
 if (window?.__webpack_nonce__) {
   // @ts-ignore
+  // eslint-disable-next-line no-undef
   __webpack_nonce__ = window.__webpack_nonce__;
 }

package/src/tasks/create/templates/Launchpad/Widget/CASE/demo.stories.tsx.mustache

@@ -38,6 +38,7 @@ window.PCore.getDataApiUtils = () => {
   return {
     getData: () => {
       return new Promise(resolve => {
+        // @ts-ignore
         resolve(historyData);
       });
     }