@zohodesk/library-platform 1.0.0-exp.1

package/src/cc/table-list/model/TableModel.ts

@@ -0,0 +1,28 @@
+type TableModelInput = {
+  data: any;
+  isLoading: boolean
+  properties: any;
+  behaviours: any
+  resizerConfig?: any
+  selectionConfig?: any
+  isFlexibleColumns?: boolean
+}
+export default function TableModel({
+  data,
+  isLoading,
+  properties,
+  behaviours,
+  resizerConfig,
+  selectionConfig,
+  isFlexibleColumns
+}: TableModelInput) {
+  return {
+    data,
+    isLoading,
+    properties,
+    behaviours,
+    resizerConfig,
+    selectionConfig,
+    isFlexibleColumns
+  };
+}

package/src/cc/table-list/model/index.ts

@@ -0,0 +1,9 @@
+import TableModel from "./TableModel";
+import RowModel from "./RowModel";
+import HeaderModel from "./HeaderModel";
+
+export default class TableListModel {
+  static TableModel = TableModel;
+  static HeaderModel = HeaderModel;
+  static RowModel = RowModel;
+}

package/src/cc/table-list/row/Constants.ts

@@ -0,0 +1,7 @@
+class TableRowConstants {
+  static readonly TABLE_ROW_CLICKED = 'TABLE_ROW#CLICKED';
+  static readonly TABLE_ROW_FIELD_CLICKED = 'TABLE_ROW#FIELD_CLICKED';
+  static readonly TABLE_ROW_FIELD_CHANGED = 'TABLE_ROW#FIELD_CHANGED';
+}
+
+export default TableRowConstants;

package/src/cc/table-list/row/Properties.ts

@@ -0,0 +1,104 @@
+import Properties from '@cc/component/properties';
+
+const TableRowProperties: Properties = {
+  isSelectionEnabled: {
+    required: false,
+    defaultValue: false,
+    typeMetadata: {
+      schema: {
+        type: 'boolean'
+      }
+    }
+  },
+  isSelectable: {
+    required: false,
+    defaultValue: false,
+    typeMetadata: {
+      schema: {
+        type: 'boolean'
+      }
+    }
+  },
+  isSelected: {
+    required: false,
+    defaultValue: false,
+    typeMetadata: {
+      schema: {
+        type: 'boolean'
+      }
+    }
+  },
+  selectionTooltip: {
+    required: false,
+    defaultValue: '',
+    typeMetadata: {
+      schema: {
+        type: 'string'
+      }
+    }
+  },
+  id: {
+    required: true,
+    typeMetadata: {
+      schema: {
+        type: 'string'
+      }
+    }
+  },
+  columns: {
+    required: true,
+    typeMetadata: {
+      schema: {
+        type: 'array'
+        // TODO: Add Field Properties
+      }
+    }
+  },
+  clickAction: {
+    required: false,
+    defaultValue: {},
+    typeMetadata: {
+      schema: {
+        type: 'object'
+      }
+    }
+  },
+  rowActions: {
+    required: false,
+    defaultValue: [],
+    typeMetadata: {
+      schema: {
+        type: 'array'
+      }
+    }
+  },
+  isFlexibleColumns: {
+    required: false,
+    defaultValue: false,
+    typeMetadata: {
+      schema: {
+        type: 'boolean'
+      }
+    }
+  },
+  resizedColumnsWidth: {
+    required: false,
+    defaultValue: false,
+    typeMetadata: {
+      schema: {
+        type: 'object'
+      }
+    }
+  },
+  hasActions: {
+    required: false,
+    defaultValue: false,
+    typeMetadata: {
+      schema: {
+        type: 'boolean'
+      }
+    }
+  }
+};
+
+export default TableRowProperties;

package/src/cc/tags/ActionHandlers.ts

@@ -0,0 +1 @@
+export default {}

package/src/cc/tags/Actions.ts

@@ -0,0 +1,7 @@
+import Constants from "./Constants";
+
+export default [
+  {
+    type: Constants.TAG_CLICKED
+  }
+];

package/src/cc/tags/Constants.ts

@@ -0,0 +1,5 @@
+class Constants {
+  static TAG_CLICKED = "TAG#CLICKED";
+}
+
+export default Constants;

package/src/cc/tags/Data.ts

@@ -0,0 +1,23 @@
+enum Size {
+  Small = 'small',
+  Medium = 'medium'
+}
+
+type TagDataType = {
+  id: string;
+  label: string;
+  color?: string;
+  imageSrc?: string;
+  imageAltText?: string;
+  iconName?: string;
+  disabled?: boolean;
+  size?: Size;
+  tooltip?: string;
+};
+
+type TagsDataType = {
+  tags: Array<TagDataType>;
+  title: string;
+};
+
+export default TagsDataType;

package/src/cc/tags/Properties.ts

@@ -0,0 +1,69 @@
+import Properties from '../component/properties';
+
+const TagsProperties: Properties = {
+  title: {
+    required: false,
+    typeMetadata: {
+      schema: {
+        type: 'string'
+      }
+    }
+  },
+  tags: {
+    required: true,
+    defaultValue: [],
+    typeMetadata: {
+      schema: {
+        $schema: 'http://json-schema.org/draft-07/schema#',
+        definitions: {
+          Schema: {
+            type: 'object',
+            properties: {
+              type: {}
+            }
+          },
+          TagsProperties: {
+            type: 'object',
+            properties: {
+              id: {
+                type: 'string'
+              },
+              label: {
+                type: 'string'
+              },
+              color: {
+                type: 'string'
+              },
+              imageSrc: {
+                type: 'string'
+              },
+              imageAltText: {
+                type: 'string'
+              },
+              iconName: {
+                type: 'string'
+              },
+              disabled: {
+                type: 'boolean'
+              },
+              size: {
+                type: 'string',
+                enum: ['small', 'medium']
+              },
+              tooltip: {
+                type: 'string'
+              }
+            },
+            required: ['id', 'label']
+          }
+        },
+        type: 'array',
+        items: {
+          $ref: '#/definitions/TagsProperties'
+        }
+      }
+    }
+  }
+};
+
+export default TagsProperties;

package/src/cc/tags/index.ts

@@ -0,0 +1,5 @@
+export { default as TagsProperties } from "./Properties";
+export { default as TagsModel } from "./model";
+export { default as TagsActions } from "./Actions";
+export { default as TagsActionHandlers } from "./ActionHandlers";
+export { default as TagsConstants } from "./Constants";

package/src/cc/tags/model/TagModel.ts

@@ -0,0 +1,14 @@
+function TagModel({ id, label, color, imageSrc, imageAltText, iconName, disabled, size, tooltip }) {
+  return {
+    id,
+    label,
+    color,
+    imageSrc,
+    imageAltText,
+    iconName,
+    disabled,
+    size,
+    tooltip
+  };
+}
+export default TagModel;

package/src/cc/tags/model/TagsDataModel.ts

@@ -0,0 +1,10 @@
+function TagsDataModel({
+  tags,
+  title
+}) {
+  return {
+    tags,
+    title
+  };
+}
+export default TagsDataModel;

package/src/cc/tags/model/index.ts

@@ -0,0 +1,7 @@
+import TagsDataModel from "./TagsDataModel";
+import TagModel from "./TagModel";
+
+export default class TagsModel {
+  static TagsDataModel = TagsDataModel;
+  static TagModel = TagModel;
+}

package/src/cc/text/ActionHandlers.ts

@@ -0,0 +1 @@
+export default {}

package/src/cc/text/Actions.ts

@@ -0,0 +1,7 @@
+import Constants from "./Constants";
+
+export default [
+  {
+    type: Constants.TEXT_CLICKED
+  }
+];

package/src/cc/text/Constants.ts

@@ -0,0 +1,5 @@
+class Constants {
+  static TEXT_CLICKED = "TEXT#CLICKED";
+}
+
+export default Constants;

package/src/cc/text/Data.ts

@@ -0,0 +1,14 @@
+enum Weight {
+  Light = "light",
+  Regular = "regular",
+  Semibold = "semibold",
+  Bold = "bold"
+}
+
+type TextDataType = {
+  text: string,
+  weight?: Weight,
+  tooltip?: string
+}
+
+export default TextDataType;

package/src/cc/text/Model.ts

@@ -0,0 +1,8 @@
+function Model({ text, weight, tooltip }) {
+  return {
+    text,
+    weight,
+    tooltip
+  };
+}
+export default Model;

package/src/cc/text/Properties.ts

@@ -0,0 +1,32 @@
+export default {
+  text: {
+    required: true,
+    typeMetadata: {
+      schema: {
+        type: "string"
+      }
+    }
+  },
+  weight: {
+    required: false,
+    typeMetadata: {
+      schema: {
+        type: "string",
+        enum: [
+          "light",
+          "regular",
+          "semibold",
+          "bold"
+        ]
+      }
+    }
+  },
+  tooltip: {
+    required: false,
+    typeMetadata: {
+      schema: {
+        type: "string"
+      }
+    }
+  }
+};

package/src/cc/text/index.ts

@@ -0,0 +1,5 @@
+export { default as TextProperties } from "./Properties";
+export { default as TextModel } from "./Model";
+export { default as TextActions } from "./Actions";
+export { default as TextActionHandlers } from "./ActionHandlers";
+export { default as TextConstants } from "./Constants";

package/src/desk-frameworks/index.ts

@@ -0,0 +1 @@
+export { default as TableConnectedFactory } from './table-connected/frameworks/TableConnectedFactory';

package/src/desk-frameworks/table-connected/frameworks/EventHandlersFactory.ts

@@ -0,0 +1,30 @@
+import ListSdkFactory from './ListSdkFactory';
+
+function createHandlerWithSdk(handler) {
+  return input => {
+    const { state, dispatch } = input;
+
+    handler(input, ListSdkFactory.create({ state, dispatch }));
+  };
+}
+
+export default class EventHandlersFactory {
+  static create(eventHandlers) {
+    const wrapped = Object.fromEntries(
+      Object.keys(eventHandlers).map(eventName => {
+        const handler = createHandlerWithSdk(eventHandlers[eventName]);
+        return [eventName, handler];
+      })
+    );
+
+    return {
+      ...wrapped,
+      NAVIGATION: NavigationHandler
+    };
+  }
+}
+
+function NavigationHandler(event) {
+  const { url } = event.action.payload;
+  location.href = url;
+}

package/src/desk-frameworks/table-connected/frameworks/ListSdkFactory.ts

@@ -0,0 +1,32 @@
+import { ZLIST_DELETE_RECORDS, ZLIST_RECORD_UPDATE } from '@bc/zlist/Constants';
+
+/* eslint-disable max-lines-per-function */
+export default class ListSdkFactory {
+  static create({ state, dispatch }) {
+    return {
+      zlist: {
+        getRecords() {
+          return state.behaviours?.zrecord.records;
+        },
+        deleteRecords(recordIds) {
+          dispatch({
+            type: ZLIST_DELETE_RECORDS,
+            payload: {
+              recordIds
+            }
+          });
+        },
+        updateRecord(recordId, record) {
+          dispatch({
+            type: ZLIST_RECORD_UPDATE,
+            payload: {
+              recordId,
+              record
+            }
+          });
+        }
+      },
+      zrecord: {}
+    };
+  }
+}

package/src/desk-frameworks/table-connected/frameworks/TableConnected.ts

@@ -0,0 +1,5 @@
+import TableConnectedFactory from './TableConnectedFactory';
+
+const TableConnected = TableConnectedFactory.create({ name: 'TableConnected' });
+
+export default TableConnected;

package/src/desk-frameworks/table-connected/frameworks/TableConnectedFactory.ts

@@ -0,0 +1,31 @@
+import Properties from '@cc/table-connected/Properties';
+import { createCustomComponent } from '@library/custom-component';
+import ZFieldBehaviourFactory from '@platform/zfield/frameworks/ZFieldBehaviourFactory';
+import ZHttpBehaviourFactory from '@platform/zhttp/frameworks/ZHttpBehaviourFactory';
+import TableTranslator from '@platform/zlist/adapters/presenters/TableTranslator';
+import ZListBehaviourFactory from '@platform/zlist/frameworks/ZListBehaviourFactory';
+import RecordBehaviourFactory from '@platform/zrecord/frameworks/RecordBehaviourFactory';
+import EventHandlersFactory from './EventHandlersFactory';
+import TableConnectedView from './TableConnectedView';
+import defaultDataBroker from '@platform/data-broker';
+
+export default class TableConnectedFactory {
+  static create({ name, dataBroker = defaultDataBroker, eventHandlers = {}, View = TableConnectedView }) {
+    return createCustomComponent({
+      name: name,
+      View: View,
+      properties: Properties,
+      eventHandlers: EventHandlersFactory.create(eventHandlers),
+      transformState: TableTranslator.transformState,
+      behaviours: [
+        ZHttpBehaviourFactory.create(),
+        RecordBehaviourFactory.create(dataBroker.httpTemplates),
+        ZFieldBehaviourFactory.create({
+          availableFields: dataBroker.httpTemplates.getAvailableFields,
+          selectedFields: dataBroker.httpTemplates.getSelectedFields
+        }),
+        ZListBehaviourFactory.create()
+      ]
+    });
+  }
+}

package/src/desk-frameworks/table-connected/frameworks/TableConnectedView.tsx

@@ -0,0 +1,23 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import TableList from '@library/dot/components/table-list/frameworks/ui/TableList';
+
+export default function View({ state, helpers }, ref) {
+  const { isLoading, data = [], hasRowActions, properties, emptyStateUiType } = state;
+
+  return (
+    <div style={{ height: '100%', width: '100%' }} ref={ref}>
+      <TableList
+        data={data}
+        hasRowActions={hasRowActions}
+        isLoading={isLoading}
+        emptyStateUiType={emptyStateUiType}
+        selectionConfig={properties.selectionConfig}
+      />
+    </div>
+  );
+}
+
+View.propTypes = {
+  state: PropTypes.string
+};

package/src/library/behaviours/list-selection/adapters/controllers/AbstractController.ts

@@ -0,0 +1,11 @@
+import IService from "../../usecases/interfaces/gateways/IService";
+
+abstract class AbstractController {
+  constructor(protected service: IService) {
+    this.handle = this.handle.bind(this);
+  }
+
+  abstract handle(event): void;
+}
+
+export default AbstractController;

package/src/library/behaviours/list-selection/adapters/controllers/AllSelectionController.ts

@@ -0,0 +1,13 @@
+import AbstractController from './AbstractController';
+
+class AllSelectionController extends AbstractController {
+  handle(event): void {
+    const { state, updateState } = event;
+    const { allSelectionUseCase } = this.service;
+
+    allSelectionUseCase.updateDependencies(state, updateState);
+    allSelectionUseCase.execute(null);
+  }
+}
+
+export default AllSelectionController;

package/src/library/behaviours/list-selection/adapters/controllers/DestructController.ts

@@ -0,0 +1,14 @@
+import AbstractController from './AbstractController';
+
+class DestructController extends AbstractController {
+  handle(event): void {
+    const { destructUseCase } = this.service;
+    const { state, updateState } = event;
+    const { selected } = state.behaviours.selection;
+
+    destructUseCase.updateDependencies(state, updateState);
+    destructUseCase.execute({ selected });
+  }
+}
+
+export default DestructController;

package/src/library/behaviours/list-selection/adapters/controllers/InitializeController.ts

@@ -0,0 +1,14 @@
+import AbstractController from './AbstractController';
+
+class InitializeController extends AbstractController {
+  handle(event): void {
+    const { initializeUseCase } = this.service;
+    const { state, updateState, dispatch } = event;
+    const { selected } = state.behaviours.selection;
+
+    initializeUseCase.updateDependencies(state, updateState);
+    initializeUseCase.execute({ selected });
+  }
+}
+
+export default InitializeController;

package/src/library/behaviours/list-selection/adapters/controllers/RangeSelectionController.ts

@@ -0,0 +1,14 @@
+import AbstractController from './AbstractController';
+
+class RangeSelectionController extends AbstractController {
+  handle(event): void {
+    const { state, action, updateState } = event;
+    const { id } = action.payload;
+    const { rangeSelectionUseCase } = this.service;
+
+    rangeSelectionUseCase.updateDependencies(state, updateState);
+    rangeSelectionUseCase.execute({ id });
+  }
+}
+
+export default RangeSelectionController;

package/src/library/behaviours/list-selection/adapters/controllers/SelectionController.ts

@@ -0,0 +1,14 @@
+import AbstractController from './AbstractController';
+
+class SelectionController extends AbstractController {
+  handle(event): void {
+    const { state, action, updateState } = event;
+    const { selected } = action.payload;
+    const { selectionUseCase } = this.service;
+
+    selectionUseCase.updateDependencies(state, updateState);
+    selectionUseCase.execute({ selected });
+  }
+}
+
+export default SelectionController;

package/src/library/behaviours/list-selection/adapters/controllers/UpdateController.ts

@@ -0,0 +1,14 @@
+import AbstractController from './AbstractController';
+
+class UpdateController extends AbstractController {
+  handle(event): void {
+    const { initializeUseCase } = this.service;
+    const { state, updateState } = event;
+    const { selected } = state.behaviours.selection;
+
+    initializeUseCase.updateDependencies(state, updateState);
+    initializeUseCase.execute({ selected });
+  }
+}
+
+export default UpdateController;

package/src/library/behaviours/list-selection/adapters/gateways/Repository.ts

@@ -0,0 +1,23 @@
+import IListItemSelection from '../../entities/interfaces/IListItemSelection';
+import ListItemSelection from '../../entities/ListItemSelection';
+import IRepository from '../../usecases/interfaces/gateways/IRepository';
+
+class Repository implements IRepository {
+  private state;
+
+  init(state): void {
+    this.state = state;
+  }
+
+  getListItemSelection(): IListItemSelection {
+    const { selected } = this.state?.behaviours?.selection || {};
+    const { selectionConfig, data } = this.state?.properties || {};
+
+    const itemIds: string[] = data?.rows.map(item => item.id);
+    const maxSelectionCount: number = selectionConfig?.maxSelectionCount;
+
+    return new ListItemSelection(selected, itemIds, maxSelectionCount);
+  }
+}
+
+export default Repository;

package/src/library/behaviours/list-selection/adapters/gateways/Service.ts

@@ -0,0 +1,25 @@
+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 IService from '../../usecases/interfaces/gateways/IService';
+import UseCaseDependencies from '../../usecases/interfaces/UseCaseDependencies';
+import Destruct from '../../usecases/interactors/Destruct';
+
+class Service implements IService {
+  initializeUseCase: Initialize;
+  destructUseCase: Destruct;
+  selectionUseCase: ItemsSelection;
+  allSelectionUseCase: AllItemsSelection;
+  rangeSelectionUseCase: ItemRangeSelection;
+
+  constructor(dependencies: UseCaseDependencies) {
+    this.initializeUseCase = new Initialize(dependencies);
+    this.destructUseCase = new Destruct(dependencies);
+    this.selectionUseCase = new ItemsSelection(dependencies);
+    this.allSelectionUseCase = new AllItemsSelection(dependencies);
+    this.rangeSelectionUseCase = new ItemRangeSelection(dependencies);
+  }
+}
+
+export default Service;