@zohodesk/library-platform 1.0.0-exp.1

package/src/library/dot/legacy-to-new-arch/highlighted-value/frameworks/ui/HighlightedValueView.tsx

@@ -0,0 +1,24 @@
+import React from "react";
+import StatusBox from "@zohodesk-private/desk-components/es/table/StatusBox/StatusBox";
+import { HighlightedValueConstants } from "../../../../../../cc";
+
+function HighlightedValueView({ state, helpers }, ref) {
+  let { dispatch } = helpers;
+  let { text, color, tooltip } = state.properties;
+  return (
+    <StatusBox
+      $customProps_container={{
+        ref
+      }}
+      $ui_color={color}
+      $i18n_text={text}
+      $i18n_tooltip={tooltip}
+      $event_onClick={() => {
+        dispatch({
+          type: HighlightedValueConstants.HIGHLIGHTED_VALUE_CLICKED
+        });
+      }}
+    />
+  );
+}
+export default HighlightedValueView;

package/src/library/dot/legacy-to-new-arch/index.ts

@@ -0,0 +1,8 @@
+export { default as Avatar } from "./avatar/frameworks/ui/Avatar";
+export { default as Checkbox } from "./checkbox/frameworks/ui/Checkbox";
+export { default as Email } from "./email/frameworks/ui/Email";
+export { default as HighlightedValue } from "./highlighted-value/frameworks/ui/HighlightedValue";
+export { default as Link } from "./link/frameworks/ui/Link";
+export { default as Switch } from "./switch/frameworks/ui/Switch";
+export { default as Tags } from "./tags/frameworks/ui/Tags";
+export { default as Text } from "./text/frameworks/ui/Text";

package/src/library/dot/legacy-to-new-arch/link/frameworks/ui/Link.contract.md

@@ -0,0 +1,13 @@
+# Link Contract
+
+Link - TextLink
+
+| List V2     | External Reference | Available in Component | Description                 |
+| ----------- | ------------------ | ---------------------- | --------------------------- |
+| label       | label              | Yes                    | Text that show              |
+| variant     | variant            | Yes                    | Color & hover               |
+| href        | href               | Yes                    | Link url                    |
+| opensNewTab | opensWindow        | Yes                    | Open url in self or new tab |
+| -           | underlined         | No                     | Underline need              |
+| -           | download           | Partially Supported    | Download & File name        |
+| -           | configAria         | Yes                    | Aria properties             |

package/src/library/dot/legacy-to-new-arch/link/frameworks/ui/Link.tsx

@@ -0,0 +1,12 @@
+import { createCustomComponent } from "../../../../../custom-component";
+import { LinkProperties, LinkActions } from "../../../../../../cc";
+import LinkView from "./LinkView";
+
+let Link = createCustomComponent({
+  name: "Link",
+  View: LinkView,
+  properties: LinkProperties,
+  actions: LinkActions,
+  actionHandlers: {}
+});
+export default Link;

package/src/library/dot/legacy-to-new-arch/link/frameworks/ui/LinkView.tsx

@@ -0,0 +1,27 @@
+import React from "react";
+import TableLink from "@zohodesk-private/desk-components/es/table/TableLink/TableLink";
+import { LinkConstants } from "../../../../../../cc";
+
+function LinkView({ state, helpers }, ref) {
+  let { dispatch } = helpers;
+  let { label, variant, href, opensNewTab } = state.properties;
+  let target = opensNewTab ? '_blank' : '_self'; // Will be adopted with properties
+  
+  return (
+    <TableLink
+      $customProps_link={{
+        ref
+      }}
+      $data_text={label}
+      $data_url={href}
+      $data_target={target}
+      $ui_variant={variant}
+      $event_onClick={() => {
+        dispatch({
+          type: LinkConstants.LINK_CLICKED
+        });
+      }}
+    />
+  );
+}
+export default LinkView;

package/src/library/dot/legacy-to-new-arch/switch/frameworks/ui/Switch.contract.md

@@ -0,0 +1,15 @@
+# Switch Contract
+
+Switch - Toggle
+
+| List V2  | External Reference | Available in Component | Description              |
+| -------- | ------------------ | ---------------------- | ------------------------ |
+| checked  | checked            | Yes                    | Turned on or off         |
+| disabled | disabled           | Yes                    | Disabled state           |
+| size     | size               | Yes                    | Switch size              |
+| tooltip  | -                  | Yes                    | Switch tooltip           |
+| -        | manageChecked      | No                     | Local state need         |
+| -        | label              | Yes                    | Label text               |
+| -        | labelPosition      | No                     | Label position - 4 sides |
+| -        | fullWidth          | No                     | Block the link           |
+| -        | configAria         | Yes                    | Aria properties          |

package/src/library/dot/legacy-to-new-arch/switch/frameworks/ui/Switch.tsx

@@ -0,0 +1,12 @@
+import { createCustomComponent } from "../../../../../custom-component";
+import { SwitchProperties, SwitchActions } from "../../../../../../cc";
+import SwitchView from "./SwitchView";
+
+let Switch = createCustomComponent({
+  name: "Switch",
+  View: SwitchView,
+  properties: SwitchProperties,
+  actions: SwitchActions,
+  actionHandlers: {}
+});
+export default Switch;

package/src/library/dot/legacy-to-new-arch/switch/frameworks/ui/SwitchView.tsx

@@ -0,0 +1,33 @@
+import React from 'react';
+import Switch from '@zohodesk/components/es/Switch/Switch';
+import { useUniqueId } from '@zohodesk/components/es/Provider/IdProvider';
+import { SwitchConstants } from '../../../../../../cc';
+
+function SwitchView({ state, helpers }, ref) {
+  let { dispatch } = helpers;
+  let { checked, disabled, size, tooltip } = state.properties;
+
+  let getId = useUniqueId();
+  let id = getId();
+
+  return (
+    <Switch
+      customProps={{
+        SwitchProps: {
+          eleRef: ref
+        }
+      }}
+      id={id}
+      size={size}
+      checked={checked}
+      disabled={disabled}
+      title={tooltip}
+      onChange={() => {
+        dispatch({
+          type: SwitchConstants.SWITCH_TOGGLED
+        });
+      }}
+    />
+  );
+}
+export default SwitchView;

package/src/library/dot/legacy-to-new-arch/tags/frameworks/ui/TagContractAdapter.ts

@@ -0,0 +1,16 @@
+export default function TagContractAdapter(tag) {
+  const { id, label, color, imageSrc, imageAltText, iconName, disabled, size, tooltip } = tag;
+  return {
+    id,
+    text: label,
+    imageUrl: imageSrc,
+    name: imageAltText,
+    iconName,
+    color,
+    customProps: {
+      disabled,
+      size,
+      tooltip
+    }
+  };
+}

package/src/library/dot/legacy-to-new-arch/tags/frameworks/ui/Tags.contract.md

@@ -0,0 +1,8 @@
+# Tags Contract
+
+Tags - Pill list
+
+| List V2 | External Reference | Available in Component | Description                |
+| ------- | ------------------ | ---------------------- | -------------------------- |
+| title   | title              | Yes                    | Title of the tags list     |
+| tags    | pills              | Yes                    | Array of object - Tag data |

package/src/library/dot/legacy-to-new-arch/tags/frameworks/ui/Tags.tsx

@@ -0,0 +1,12 @@
+import { createCustomComponent } from "@library/custom-component";
+import { TagsProperties, TagsActions } from "@cc/tags";
+import TagsView from "./TagsView";
+
+let Tags = createCustomComponent({
+  name: "Tags",
+  View: TagsView,
+  properties: TagsProperties,
+  actions: TagsActions,
+  actionHandlers: {}
+});
+export default Tags;

package/src/library/dot/legacy-to-new-arch/tags/frameworks/ui/TagsView.tsx

@@ -0,0 +1,29 @@
+import React from 'react';
+import TagList from '@zohodesk-private/desk-components/es/TagsList/TagsList';
+import TagContractAdapter from './TagContractAdapter';
+import { TagsConstants } from '@cc/tags';
+
+function TagView({ state, helpers }, ref) {
+  let { dispatch } = helpers;
+  let { title, tags } = state.properties;
+
+  let tagsList = tags.map(TagContractAdapter);
+
+  return (
+    <TagList
+      $method_getRef={ref}
+      $data_list={tagsList}
+      $i18n_moreheading={title}
+      $flag_showAllTagsInsideMore={false}
+      $event_onTagClick={id => {
+        dispatch({
+          type: TagsConstants.TAG_CLICKED,
+          payload: {
+            id
+          }
+        });
+      }}
+    />
+  );
+}
+export default TagView;

package/src/library/dot/legacy-to-new-arch/text/frameworks/ui/Text.contract.md

@@ -0,0 +1,12 @@
+# Text Contract
+
+Text - Stylized text
+
+| List V2 | External Reference | Available in Component | Description          |
+| ------- | ------------------ | ---------------------- | -------------------- |
+| text    | text               | Yes                    | Text that shows      |
+| weight  | -                  | Yes                    | Text font weight     |
+| tooltip | -                  | Yes                    | Tooltip text         |
+| -       | css                | Yes                    | Css inline style     |
+| -       | tag                | Yes                    | html tag => h1, span |
+| -       | configAria         | Yes                    | Aria properties      |

package/src/library/dot/legacy-to-new-arch/text/frameworks/ui/Text.tsx

@@ -0,0 +1,12 @@
+import { createCustomComponent } from "../../../../../custom-component";
+import { TextProperties, TextActions } from "../../../../../../cc";
+import TextView from "./TextView";
+
+let WrapText = createCustomComponent({
+  name: "TableText",
+  View: TextView,
+  properties: TextProperties,
+  actions: TextActions,
+  actionHandlers: {}
+});
+export default WrapText;

package/src/library/dot/legacy-to-new-arch/text/frameworks/ui/TextView.tsx

@@ -0,0 +1,27 @@
+import React from "react";
+import Typography from "@zohodesk/components/es/v1/Typography/Typography";
+import { TextConstants } from "../../../../../../cc";
+
+function TextView({ state, helpers }, ref) {
+  let { dispatch } = helpers;
+  let { text, weight, tooltip } = state.properties;
+  return (
+    <Typography
+      $tagAttributes_text={{
+        ref: (ele) => {
+          ref(ele);
+        },
+        onClick: () => {
+          dispatch({
+            type: TextConstants.TEXT_CLICKED
+          });
+        }
+      }}
+      $ui_size='14'
+      $flag_dotted
+      $ui_weight={weight}
+      $i18n_dataTitle={tooltip || text}
+    >{text}</Typography>
+  );
+}
+export default TextView;

package/src/library/index.ts

@@ -0,0 +1,3 @@
+export { default as ComponentRegistry } from './custom-component/frameworks/ui/ComponentRegistry';
+export { default as createCustomComponent } from './custom-component/frameworks/ui/createCustomComponent';
+export { default as TableList } from './dot/components/table-list/frameworks/ui/TableList';

package/src/platform/data-broker/dbc/index.ts

@@ -0,0 +1,77 @@
+import IField from '@platform/zfield/entities/interfaces/IField';
+import IRecord from '../../zrecord/entities/interfaces/IRecord';
+
+type Property = {
+  required: boolean;
+  defaultValue?: any;
+  label?: string;
+  typeMetadata: {
+    schema: Schema;
+  };
+};
+type Properties = {
+  [propertyKey: string]: Property;
+};
+type Schema = {
+  type: string;
+};
+type PayloadProperties = {
+  name: string;
+  label?: string;
+  typeMetadata: {
+    schema: Schema;
+  };
+};
+type Payload = {
+  [key: string]: PayloadProperties;
+};
+type Event = {
+  type: string;
+  payload: Payload;
+  label?: string;
+};
+interface ActionHandler {}
+type ActionHandlers = {
+  [key: string]: ActionHandler;
+};
+type Params = {
+  [key: string]: any;
+};
+type Body = {
+  [key: string]: any;
+};
+export type GetTemplate = {
+  name: string;
+  properties: Properties;
+  type: 'GET';
+  api: string;
+  requestBody?: null;
+  parameters: string;
+  transformer: (res: any) => IField[];
+};
+export type PostTemplate = {
+  name: string;
+  properties: Properties;
+  type: 'POST';
+  api: string;
+  parameters: string;
+  requestBody: string;
+  transformer: (res: any) => IField[];
+};
+export type PatchTemplate = {
+  name: string;
+  properties: Properties;
+  type: 'PATCH';
+  api: string;
+  parameters: string;
+  requestBody: string;
+  transformer: (res: any) => IField[];
+};
+export type HttpTemplates = {
+  [name: string]: GetTemplate | PostTemplate | PatchTemplate;
+};
+type DataBroker = {
+  httpTemplates: HttpTemplates;
+};
+
+export default DataBroker;

package/src/platform/data-broker/http-template/deleteRecords.ts

@@ -0,0 +1,31 @@
+import { PostTemplate } from '../dbc';
+
+const deleteRecords: PostTemplate = {
+  name: 'records',
+  api: '/api/v1/{{moduleName}}/moveToTrash',
+  parameters: `{}`,
+  type: 'POST',
+  transformer: data => data,
+  requestBody: '{ "entityIds": {{recordIds}} }',
+  // TODO: need to discuss with Records team about delete
+  // requestBody: '{ "recordIds": {{recordIds}} }',
+  properties: {
+    moduleName: {
+      required: true,
+      typeMetadata: {
+        schema: {
+          type: 'string'
+        }
+      }
+    },
+    recordIds: {
+      required: true,
+      typeMetadata: {
+        schema: {
+          type: 'array'
+        }
+      }
+    }
+  }
+};
+export default deleteRecords;

package/src/platform/data-broker/http-template/getAvailableFields.ts

@@ -0,0 +1,34 @@
+import { GetTemplate } from "../dbc";
+import transformer from "../utils/transformer/transformer";
+
+let getAvailableFields: GetTemplate = {
+  name: "availableFields",
+  // api: "/api/v1/organizationFields",
+  api: "/api/v1/views/availableFields",
+  parameters: `{
+        "departmentId":"{{departmentId}}",
+        "module":"{{moduleName}}"
+    }`,
+  type: "GET",
+  // transformer: (res) => transformer(res, "name"),
+  transformer: (res) => res.fields,
+  properties: {
+    moduleName: {
+      required: true,
+      typeMetadata: {
+        schema: {
+          type: "string"
+        }
+      }
+    },
+    departmentId: {
+      required: true,
+      typeMetadata: {
+        schema: {
+          type: "string"
+        }
+      }
+    }
+  }
+};
+export default getAvailableFields;

package/src/platform/data-broker/http-template/getRecords.ts

@@ -0,0 +1,52 @@
+import { GetTemplate } from '../dbc';
+import transformer from '../utils/transformer/transformer';
+
+let getRecords: GetTemplate = {
+  name: 'records',
+  api: '/api/v1/{{moduleName}}',
+  parameters: `{
+        "viewId":"{{viewId}}",
+        "from":{{from}},
+        "limit":{{limit}},
+        "sortBy":"{{sortBy}}"
+    }`,
+  type: 'GET',
+  transformer: data => data.data, //transformer(data, "subject"),
+  properties: {
+    moduleName: {
+      required: true,
+      typeMetadata: {
+        schema: {
+          type: 'string'
+        }
+      }
+    },
+    viewId: {
+      required: true,
+      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/src/platform/data-broker/http-template/getSelectedFields.ts

@@ -0,0 +1,48 @@
+import { GetTemplate } from "../dbc";
+import transformer from "../utils/transformer/transformer";
+
+let getSelectedFields: GetTemplate = {
+  name: "selectedFields",
+  api: "/api/v1/views/{{viewId}}/selectedFields",
+  parameters: `{
+        "departmentId":"{{departmentId}}"
+    }`,
+  type: "GET",
+  transformer: (res) => res.fields,
+  // transformer: (res) => {
+  //   return transformer(
+  //     {
+  //       data: res.fields.map((field) => ({ id: field, name: field }))
+  //     },
+  //     "name"
+  //   );
+  // },
+  properties: {
+    // module: {
+    //   required: true,
+    //   typeMetadata: {
+    //     schema: {
+    //       type: "string"
+    //     }
+    //   }
+    // },
+    viewId: {
+      required: true,
+      typeMetadata: {
+        schema: {
+          type: "string"
+        }
+      }
+    },
+    departmentId: {
+      required: true,
+      defaultValue: 1,
+      typeMetadata: {
+        schema: {
+          type: "number"
+        }
+      }
+    }
+  }
+};
+export default getSelectedFields;

package/src/platform/data-broker/http-template/getUIActions.ts

@@ -0,0 +1,26 @@
+import { GetTemplate } from "../dbc";
+import transformer from "../utils/transformer/transformer";
+
+let getUIActions: GetTemplate = {
+  name: "uiActions",
+  api: "https://vimal-19789.tsi.zohocorpin.com:9090/api/v2/records",
+  parameters: `{
+        "cf_model_name":"{{modelName}}",
+        "module":"{{modelName}}"
+    }`,
+  type: "GET",
+  transformer: (data) => transformer(data, "UIActionName"),
+  properties: {
+    modelName: {
+      required: true,
+      typeMetadata: {
+        schema: {
+          type: "string",
+        },
+      },
+    },
+  },
+};
+export default getUIActions;
+
+// https://vimal-19789.tsi.zohocorpin.com:9090/api/v2/records?cf_model_name=list&module=dcactions

package/src/platform/data-broker/http-template/updateRecord.ts

@@ -0,0 +1,37 @@
+import { PatchTemplate } from '../dbc';
+
+const updateRecord: PatchTemplate = {
+  name: 'records',
+  api: '/api/v1/{{moduleName}}/{{recordId}}',
+  parameters: `{}`,
+  type: 'PATCH',
+  transformer: data => data,
+  requestBody: '{{record}}',
+  properties: {
+    moduleName: {
+      required: true,
+      typeMetadata: {
+        schema: {
+          type: 'string'
+        }
+      }
+    },
+    recordId: {
+      required: true,
+      typeMetadata: {
+        schema: {
+          type: 'string'
+        }
+      }
+    },
+    record: {
+      required: true,
+      typeMetadata: {
+        schema: {
+          type: 'object'
+        }
+      }
+    }
+  }
+};
+export default updateRecord;

package/src/platform/data-broker/index.ts

@@ -0,0 +1,23 @@
+import DataBroker from "./dbc";
+// import createRecord from "../../record/frameworks/createRecord";
+import getRecords from "./http-template/getRecords";
+import updateRecord from "./http-template/updateRecord";
+import deleteRecords from "./http-template/deleteRecords";
+import getAvailableFields from "./http-template/getAvailableFields";
+import getSelectedFields from "./http-template/getSelectedFields";
+import getUIActions from "./http-template/getUIActions";
+import { RecordApiActionName } from "@bc/zrecord/Constants";
+
+let record: DataBroker = {
+  httpTemplates: {
+    [RecordApiActionName.GET_RECORDS]: getRecords,
+    [RecordApiActionName.UPDATE_RECORD]: updateRecord,
+    [RecordApiActionName.DELETE_RECORDS]: deleteRecords,
+    getAvailableFields,
+    getSelectedFields,
+    getUIActions
+  }
+};
+export default record;
+// let ticketsRecordSerice = createRecord(tickets, () => {});
+// export default ticketsRecordSerice;

package/src/platform/data-broker/utils/transformer/createCf.ts

@@ -0,0 +1,11 @@
+function createCf(item, key) {
+  return Object.keys(item).reduce((res, next) => {
+    if ([key, "id", "createdTime"].includes(next)) {
+      return res;
+    } else {
+      res[next] = item[next];
+      return res;
+    }
+  }, {});
+}
+export default createCf;

package/src/platform/data-broker/utils/transformer/transformer.ts

@@ -0,0 +1,19 @@
+import createCf from "./createCf";
+
+function transformer({ data }, key) {
+  let records = data.map((item) => {
+    let { id, createdTime } = item;
+    return {
+      id,
+      recordName: {
+        key: key,
+        value: item[key]
+      },
+      createdTime,
+      cf: item.cf ? item.cf : createCf(item, key)
+    };
+  });
+
+  return records;
+}
+export default transformer;

package/src/platform/index.js

@@ -0,0 +1 @@
+export { createListWidget } from "./widgets/list/frameworks/index";

package/src/platform/zfield/adapters/controllers/AbstractController.ts

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