@zohodesk/library-platform 1.0.2 → 1.1.0-exp.2

package/es/desk-frameworks/table-connected/frameworks/__tests__/TableConnectedFactory.spec.js

@@ -0,0 +1,453 @@
+import fetchMock from 'jest-fetch-mock';
+import React from 'react';
+import { render, screen, waitFor } from '@testing-library/react';
+import '@testing-library/jest-dom';
+import TableConnectedFactory from "../TableConnectedFactory";
+import dataBroker from "./mock/data-broker";
+describe('Table Connected Factory', () => {
+  fetchMock.enableMocks();
+  it('should mount the component and check the rendering', () => {
+    const TableConnected = TableConnectedFactory.create({
+      name: 'TableConnected'
+    });
+    let {
+      container
+    } = render( /*#__PURE__*/React.createElement(TableConnected, null));
+    expect(container).toBeInTheDocument();
+  });
+});
+describe('Table header', () => {
+  fetchMock.enableMocks();
+  it('Number of Columns', async () => {
+    const TableConnected = TableConnectedFactory.create({
+      name: 'TableConnected',
+      dataBroker
+    });
+    const filter = {
+      viewId: '',
+      orgId: '',
+      departmentId: ''
+    };
+    let {
+      container
+    } = render( /*#__PURE__*/React.createElement(TableConnected, {
+      filter: filter,
+      limit: 25
+    }));
+    await waitFor(() => {
+      const rows = container.querySelectorAll('th');
+      expect(rows.length).toBe(8);
+    });
+  });
+  it('Field names', async () => {
+    const TableConnected = TableConnectedFactory.create({
+      name: 'TableConnected',
+      dataBroker
+    });
+    const filter = {
+      viewId: '',
+      orgId: '',
+      departmentId: ''
+    };
+    let {
+      container
+    } = render( /*#__PURE__*/React.createElement(TableConnected, {
+      filter: filter,
+      limit: 25
+    }));
+    await waitFor(() => {
+      const rows = container.querySelectorAll('th');
+      const columnName = rows[3];
+      expect(columnName.textContent).toBe("Is Admin");
+    });
+  });
+  it('Field order', async () => {
+    const TableConnected = TableConnectedFactory.create({
+      name: 'TableConnected',
+      dataBroker
+    });
+    const filter = {
+      viewId: '',
+      orgId: '',
+      departmentId: ''
+    };
+    let {
+      container
+    } = render( /*#__PURE__*/React.createElement(TableConnected, {
+      filter: filter,
+      limit: 25
+    }));
+    await waitFor(() => {
+      const rows = container.querySelectorAll('th');
+      const rowsText = [];
+      rows.forEach(row => {
+        rowsText.push(row.textContent);
+      });
+      const columnOrder = ['ID', 'Name', 'Email', 'Is Admin', 'Created Time', 'Created By', 'Owner', 'URL'];
+      expect(rowsText).toStrictEqual(columnOrder);
+    });
+  });
+});
+describe('Table body', () => {
+  fetchMock.enableMocks();
+  it('The Table should have 5 records after fetch', async () => {
+    const TableConnected = TableConnectedFactory.create({
+      name: 'TableConnected',
+      dataBroker
+    });
+    const filter = {
+      viewId: '',
+      orgId: '',
+      departmentId: ''
+    };
+    let {
+      container
+    } = render( /*#__PURE__*/React.createElement(TableConnected, {
+      filter: filter,
+      limit: 5
+    }));
+    await waitFor(() => {
+      var _container$querySelec;
+
+      const rows = (_container$querySelec = container.querySelector('tbody')) === null || _container$querySelec === void 0 ? void 0 : _container$querySelec.childNodes;
+      expect(rows.length).toBe(5);
+    });
+  }); // fit('The Table should render 5 records on scroll to the end', async () => {
+  //     const TableConnected = TableConnectedFactory.create({ name: 'TableConnected', dataBroker });
+  //     const filter = { viewId: '', orgId: '', departmentId: '' };
+  //     let { container } = render(
+  //         <div id="tableContainer" style={{ height: '300px', width: '100%' }}>
+  //             <TableConnected filter={filter} limit={15} />
+  //         </div>
+  //     );
+  //     await waitFor(() => {
+  //         const rows = container.querySelector('tbody')?.childNodes;
+  //         expect(rows?.length).toBe(15);
+  //     });
+  //     const scrollableElement = container.querySelector('table');
+  //     if (scrollableElement) {
+  //         Object.defineProperty(scrollableElement, 'scrollHeight', { value: 2000, writable: true });
+  //         Object.defineProperty(scrollableElement, 'clientHeight', { value: 300, writable: true });
+  //         // fireEvent.scroll(scrollableElement, { target: { scrollTop: 2000 } });
+  //         // fireEvent.scroll(scrollableElement, new Event('scroll'));
+  //         scrollableElement.scrollTop = 2000;
+  //         scrollableElement.dispatchEvent(new Event('scroll'));
+  //     }
+  //     });
+  // });
+});
+describe('Field cases', () => {
+  fetchMock.enableMocks();
+  it('Field type order', async () => {
+    const TableConnected = TableConnectedFactory.create({
+      name: 'TableConnected',
+      dataBroker
+    });
+    const uiMapping = {
+      fields: {
+        "cf_isAdmin": "Switch"
+      }
+    };
+    const filter = {
+      viewId: '',
+      orgId: '',
+      departmentId: ''
+    };
+    let {
+      container
+    } = render( /*#__PURE__*/React.createElement(TableConnected, {
+      uiMapping: uiMapping,
+      filter: filter,
+      limit: 1
+    }));
+    await waitFor(() => {
+      const rows = container.querySelectorAll('td');
+      const rowsText = [];
+      rows.forEach(row => {
+        rowsText.push(row.textContent);
+      });
+      const columnOrder = ['1', 'Record 1', 'odin@asgard@thundermail.com', "", '2025-01-13T07:01:50.686Z', 'ODOdin ', 'GodSpecies', 'https://en.wikipedia.org/wiki/Asgard'];
+      expect(rowsText).toStrictEqual(columnOrder);
+    });
+  });
+  it('Text rendered', async () => {
+    const TableConnected = TableConnectedFactory.create({
+      name: 'TableConnected',
+      dataBroker: dataBroker
+    });
+    const uiMapping = {
+      fields: {
+        "cf_isAdmin": "Switch"
+      }
+    };
+    const filter = {
+      viewId: '',
+      orgId: '',
+      departmentId: ''
+    };
+    let {
+      container
+    } = render( /*#__PURE__*/React.createElement(TableConnected, {
+      uiMapping: uiMapping,
+      filter: filter,
+      limit: 1
+    }));
+    await waitFor(() => {
+      const rows = container.querySelectorAll('td');
+      const rowsText = [];
+      rows.forEach(row => {
+        rowsText.push(row.textContent);
+      });
+      const textEle = "ODOdin ";
+      expect(rowsText[5]).toStrictEqual(textEle);
+    });
+  });
+  it('Switch rendered', async () => {
+    const TableConnected = TableConnectedFactory.create({
+      name: 'TableConnected',
+      dataBroker: dataBroker
+    });
+    const uiMapping = {
+      fields: {
+        "cf_isAdmin": "Switch"
+      }
+    };
+    const filter = {
+      viewId: '',
+      orgId: '',
+      departmentId: ''
+    };
+    let {
+      container
+    } = render( /*#__PURE__*/React.createElement(TableConnected, {
+      uiMapping: uiMapping,
+      filter: filter,
+      limit: 25
+    }));
+    await waitFor(() => {
+      expect(screen.getByText('Is Admin')).toBeInTheDocument();
+      const switchField = screen.getAllByRole('switch');
+      const firstSwitch = switchField[0];
+      expect(firstSwitch).toBeInTheDocument();
+    });
+  });
+  it('Switch checked', async () => {
+    const TableConnected = TableConnectedFactory.create({
+      name: 'TableConnected',
+      dataBroker: dataBroker
+    });
+    const uiMapping = {
+      fields: {
+        "cf_isAdmin": "Switch"
+      }
+    };
+    const filter = {
+      viewId: '',
+      orgId: '',
+      departmentId: ''
+    };
+    let {
+      container
+    } = render( /*#__PURE__*/React.createElement(TableConnected, {
+      uiMapping: uiMapping,
+      filter: filter,
+      limit: 25
+    }));
+    await waitFor(() => {
+      expect(screen.getByText('Is Admin')).toBeInTheDocument();
+      const switchField = screen.getAllByRole('switch');
+      const firstSwitch = switchField[1];
+      const isChecked = firstSwitch.getAttribute('aria-checked');
+      expect(isChecked).toBe('true');
+    });
+  });
+  it('Switch unchecked', async () => {
+    const TableConnected = TableConnectedFactory.create({
+      name: 'TableConnected',
+      dataBroker: dataBroker
+    });
+    const uiMapping = {
+      fields: {
+        "cf_isAdmin": "Switch"
+      }
+    };
+    const filter = {
+      viewId: '',
+      orgId: '',
+      departmentId: ''
+    };
+    let {
+      container
+    } = render( /*#__PURE__*/React.createElement(TableConnected, {
+      uiMapping: uiMapping,
+      filter: filter,
+      limit: 25
+    }));
+    await waitFor(() => {
+      expect(screen.getByText('Is Admin')).toBeInTheDocument();
+      const switchField = screen.getAllByRole('switch');
+      const firstSwitch = switchField[0];
+      const isChecked = firstSwitch.getAttribute('aria-checked');
+      expect(isChecked).toBe('false');
+    });
+  });
+  it('Checkbox rendered', async () => {
+    const TableConnected = TableConnectedFactory.create({
+      name: 'TableConnected',
+      dataBroker: dataBroker
+    });
+    const filter = {
+      viewId: '',
+      orgId: '',
+      departmentId: ''
+    };
+    let {
+      container
+    } = render( /*#__PURE__*/React.createElement(TableConnected, {
+      filter: filter,
+      limit: 25
+    }));
+    await waitFor(() => {
+      expect(screen.getByText('Is Admin')).toBeInTheDocument();
+      const checkboxField = screen.getAllByRole('checkbox');
+      const firstCheckbox = checkboxField[0];
+      expect(firstCheckbox).toBeInTheDocument();
+    });
+  });
+  it('Checkbox checked', async () => {
+    const TableConnected = TableConnectedFactory.create({
+      name: 'TableConnected',
+      dataBroker: dataBroker
+    });
+    const filter = {
+      viewId: '',
+      orgId: '',
+      departmentId: ''
+    };
+    let {
+      container
+    } = render( /*#__PURE__*/React.createElement(TableConnected, {
+      filter: filter,
+      limit: 25
+    }));
+    await waitFor(() => {
+      expect(screen.getByText('Is Admin')).toBeInTheDocument();
+      const checkboxField = screen.getAllByRole('checkbox');
+      const firstCheckbox = checkboxField[1];
+      const isChecked = firstCheckbox.checked;
+      expect(isChecked).toBe(true);
+    });
+  });
+  it('Checkbox unchecked', async () => {
+    const TableConnected = TableConnectedFactory.create({
+      name: 'TableConnected',
+      dataBroker: dataBroker
+    });
+    const filter = {
+      viewId: '',
+      orgId: '',
+      departmentId: ''
+    };
+    let {
+      container
+    } = render( /*#__PURE__*/React.createElement(TableConnected, {
+      filter: filter,
+      limit: 25
+    }));
+    await waitFor(() => {
+      expect(screen.getByText('Is Admin')).toBeInTheDocument();
+      const checkboxField = screen.getAllByRole('checkbox');
+      const firstCheckbox = checkboxField[0];
+      const isChecked = firstCheckbox.checked;
+      expect(isChecked).toBe(false);
+    });
+  });
+  it('Tags rendered', async () => {
+    const TableConnected = TableConnectedFactory.create({
+      name: 'TableConnected',
+      dataBroker: dataBroker
+    });
+    const filter = {
+      viewId: '',
+      orgId: '',
+      departmentId: ''
+    };
+    let {
+      container
+    } = render( /*#__PURE__*/React.createElement(TableConnected, {
+      filter: filter,
+      limit: 25
+    }));
+    await waitFor(() => {
+      expect(screen.getByText('Owner')).toBeInTheDocument();
+      const rows = container.querySelectorAll('[data-title="God"]');
+      expect(rows[0]).toBeInTheDocument();
+    });
+  });
+  it('Avatar rendered', async () => {
+    const TableConnected = TableConnectedFactory.create({
+      name: 'TableConnected',
+      dataBroker: dataBroker
+    });
+    const filter = {
+      viewId: '',
+      orgId: '',
+      departmentId: ''
+    };
+    let {
+      container
+    } = render( /*#__PURE__*/React.createElement(TableConnected, {
+      filter: filter,
+      limit: 25
+    }));
+    await waitFor(() => {
+      expect(screen.getByText('Created By')).toBeInTheDocument();
+      const rows = container.querySelectorAll('[data-title="Odin "]');
+      expect(rows[0]).toBeInTheDocument();
+    });
+  });
+  it('Email rendered', async () => {
+    const TableConnected = TableConnectedFactory.create({
+      name: 'TableConnected',
+      dataBroker: dataBroker
+    });
+    const filter = {
+      viewId: '',
+      orgId: '',
+      departmentId: ''
+    };
+    let {
+      container
+    } = render( /*#__PURE__*/React.createElement(TableConnected, {
+      filter: filter,
+      limit: 25
+    }));
+    await waitFor(() => {
+      expect(screen.getByText('Email')).toBeInTheDocument();
+      const rows = container.querySelectorAll('[data-title="odin@asgard@thundermail.com"]');
+      expect(rows[0]).toBeInTheDocument();
+    });
+  });
+  it('URL rendered', async () => {
+    const TableConnected = TableConnectedFactory.create({
+      name: 'TableConnected',
+      dataBroker: dataBroker
+    });
+    const filter = {
+      viewId: '',
+      orgId: '',
+      departmentId: ''
+    };
+    let {
+      container
+    } = render( /*#__PURE__*/React.createElement(TableConnected, {
+      filter: filter,
+      limit: 25
+    }));
+    await waitFor(() => {
+      expect(screen.getByText('URL')).toBeInTheDocument();
+      const rows = container.querySelectorAll('[data-title="https://en.wikipedia.org/wiki/Asgard"]');
+      expect(rows[0]).toBeInTheDocument();
+    });
+  });
+});

package/es/desk-frameworks/table-connected/frameworks/__tests__/mock/data-broker/http-template/getAvailableFields.js

@@ -0,0 +1,86 @@
+let getAvailableFields = {
+  name: 'availableFields',
+  api: '/api/v1/support-email-address/availableFields',
+  getResponse: _ref => {
+    let {
+      payload,
+      params
+    } = _ref;
+    return {
+      fields: availableFields
+    };
+  },
+  parameters: `{
+                "departmentId":"{{departmentId}}"
+        }`,
+  type: 'GET',
+  transformer: res => res.fields,
+  properties: {
+    departmentId: {
+      required: true,
+      typeMetadata: {
+        schema: {
+          type: 'string'
+        }
+      }
+    }
+  }
+};
+export default getAvailableFields;
+const availableFields = [{
+  name: 'id',
+  id: 'id',
+  isSortable: false,
+  displayLabel: 'ID',
+  isCustomField: false,
+  type: 'Text'
+}, {
+  name: 'name',
+  id: 'name',
+  isSortable: false,
+  displayLabel: 'Name',
+  isCustomField: false,
+  type: 'Text'
+}, {
+  name: 'email',
+  id: 'email',
+  isSortable: false,
+  displayLabel: 'Email',
+  isCustomField: false,
+  type: 'Email'
+}, {
+  name: 'cf_isAdmin',
+  id: 'cf_isAdmin',
+  isSortable: false,
+  displayLabel: 'Is Admin',
+  isCustomField: true,
+  type: 'Boolean'
+}, {
+  name: 'createdTime',
+  id: 'createdTime',
+  isSortable: false,
+  displayLabel: 'Created Time',
+  isCustomField: false,
+  type: 'DateTime'
+}, {
+  name: 'createdBy',
+  id: 'createdBy',
+  isSortable: false,
+  displayLabel: 'Created By',
+  isCustomField: false,
+  type: 'LookUp'
+}, {
+  name: 'cf_owner',
+  id: 'cf_owner',
+  isSortable: false,
+  displayLabel: 'Owner',
+  isCustomField: false,
+  type: 'Multiselect'
+}, {
+  name: 'of_url',
+  id: 'of_url',
+  isSortable: false,
+  displayLabel: 'URL',
+  isCustomField: false,
+  type: 'URL'
+}];

package/es/desk-frameworks/table-connected/frameworks/__tests__/mock/data-broker/http-template/getRecords.js

@@ -0,0 +1,81 @@
+const getRecords = {
+  name: 'records',
+  api: `/supportapi/zd/{{orgName}}/api/v1/supportEmailAddress`,
+  parameters: `{
+          "departmentId": "{{departmentId}}",
+          "from":{{from}},
+          "limit":{{limit}}
+      }`,
+  type: 'GET',
+  getResponse: _ref => {
+    let {
+      payload,
+      params
+    } = _ref;
+    const records = [];
+    const start = params.from;
+    const end = start + params.limit;
+
+    for (let i = start; i < end; i++) {
+      const date = new Date();
+      records.push({
+        id: `${i}`,
+        name: `Record ${i}`,
+        email: 'odin@asgard@thundermail.com',
+        cf: {
+          cf_isAdmin: i % 2 === 0
+        },
+        createdTime: "2025-01-13T07:01:50.686Z",
+        createdBy: {
+          "firstName": "Odin",
+          "lastName": ""
+        },
+        cf_owner: `God;Species`,
+        of_url: `https://en.wikipedia.org/wiki/Asgard`
+      });
+    }
+
+    params.limit += 10;
+    return {
+      "data": records
+    };
+  },
+  transformer: response => response.data,
+  properties: {
+    orgName: {
+      required: false,
+      typeMetadata: {
+        schema: {
+          type: 'string'
+        }
+      }
+    },
+    departmentId: {
+      required: false,
+      typeMetadata: {
+        schema: {
+          type: 'string'
+        }
+      }
+    },
+    from: {
+      required: false,
+      defaultValue: 1,
+      typeMetadata: {
+        schema: {
+          type: 'number'
+        }
+      }
+    },
+    limit: {
+      required: false,
+      defaultValue: 20,
+      typeMetadata: {
+        schema: {
+          type: 'number'
+        }
+      }
+    }
+  }
+};
+export default getRecords;

package/es/desk-frameworks/table-connected/frameworks/__tests__/mock/data-broker/http-template/getSelectedFields.js

@@ -0,0 +1,32 @@
+let getSelectedFields = {
+  name: 'selectedFields',
+  api: '/api/v1/support-email-address/selectedFields',
+  parameters: `{
+                "departmentId": "{{departmentId}}",
+                "module": "{{moduleName}}"
+        }`,
+  type: 'GET',
+  getResponse: _ref => {
+    let {
+      payload,
+      params
+    } = _ref;
+    const fields = ['id', 'name', 'email', 'cf_isAdmin', 'createdTime', 'createdBy', 'cf_owner', 'of_url'];
+    return {
+      fields
+    };
+  },
+  transformer: res => res.fields,
+  properties: {
+    departmentId: {
+      required: true,
+      defaultValue: 1,
+      typeMetadata: {
+        schema: {
+          type: 'number'
+        }
+      }
+    }
+  }
+};
+export default getSelectedFields;

package/es/desk-frameworks/table-connected/frameworks/__tests__/mock/data-broker/index.js

@@ -0,0 +1,11 @@
+import getAvailableFields from "./http-template/getAvailableFields";
+import getRecords from "./http-template/getRecords";
+import getSelectedFields from "./http-template/getSelectedFields";
+const dataBroker = {
+  "httpTemplates": {
+    getRecords,
+    getAvailableFields,
+    getSelectedFields
+  }
+};
+export default dataBroker;

package/es/library/behaviours/list-selection/adapters/gateways/Repository.js

@@ -1,6 +1,6 @@
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
-import ListItemSelection from "../../entities/ListItemSelection";
+import ListItemSelection from "../../domain/entities/ListItemSelection";
 
 class Repository {
   constructor() {

package/es/library/behaviours/list-selection/adapters/gateways/Service.js

@@ -1,10 +1,10 @@
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
-import Initialize from "../../usecases/interactors/Initialize";
-import AllItemsSelection from "../../usecases/interactors/AllItemSelection";
-import ItemRangeSelection from "../../usecases/interactors/RangeSelection";
-import ItemsSelection from "../../usecases/interactors/ItemsSelection";
-import Destruct from "../../usecases/interactors/Destruct";
+import Initialize from "../../applications/usecases/Initialize";
+import AllItemsSelection from "../../applications/usecases/AllItemSelection";
+import ItemRangeSelection from "../../applications/usecases/RangeSelection";
+import ItemsSelection from "../../applications/usecases/ItemsSelection";
+import Destruct from "../../applications/usecases/Destruct";
 
 class Service {
   constructor(dependencies) {