@zohodesk/library-platform 1.1.12 → 1.2.0

package/es/platform/zlist/adapters/presenters/translators/fields/PickListFieldTranslator.js

@@ -1,7 +1,6 @@
 // import FieldModel from '@platform/zfield/entities/interfaces/FieldModel';
 import FieldTypes from "../../../../../../cc/fields/field/Types";
-import PickListFieldModel from "../../../../../../cc/fields/pick-list/Model";
-import ColouredPickListFieldModel from "../../../../../../cc/fields/coloured-pick-list/Model";
+const EMPTY_ARRAY = [];
 
 const PickListFieldTranslator = _ref => {
   let {
@@ -12,9 +11,6 @@ const PickListFieldTranslator = _ref => {
     isRead
   } = _ref;
   const {
-    uiType,
-    name,
-    pickListValues,
     subType
   } = field;
 
@@ -22,34 +18,179 @@ const PickListFieldTranslator = _ref => {
     return ColouredPickListFieldTranslator(field, value, appendToActionPayload, textOverflowMode, isRead);
   }
 
-  return PickListFieldModel({
-    uiType: uiType || FieldTypes.PickListField,
-    appendToActionPayload,
-    options: pickListValues,
-    name,
-    isRead,
-    value,
-    textOverflowMode
-  });
+  return StandardPickListFieldTranslator(field, value, appendToActionPayload, textOverflowMode, isRead);
 };
 
 export default PickListFieldTranslator;
 
-const ColouredPickListFieldTranslator = (field, value, appendToActionPayload, textOverflowMode, isRead) => {
+const StandardPickListFieldTranslator = (field, value, appendToActionPayload, textOverflowMode, isRead) => {
   const {
     uiType,
     name,
-    pickListValues
+    pickListValues = EMPTY_ARRAY,
+    displayLabel
   } = field;
-  return ColouredPickListFieldModel({
-    uiType: uiType || FieldTypes.ColouredPickListField,
-    appendToActionPayload,
-    options: pickListValues.map(option => ({ ...option,
-      colorCode: option.colorCode || ''
-    })),
+
+  switch (uiType) {
+    case FieldTypes.HighlightedValueField:
+      return {
+        type: FieldTypes.HighlightedValueField,
+        fieldName: name,
+        text: value,
+        color: 'grey',
+        tooltip: value,
+        cursor: 'default',
+        appendToActionPayload,
+        isRead,
+        textOverflowMode
+      };
+
+    case FieldTypes.TagField:
+      return {
+        type: FieldTypes.TagField,
+        fieldName: name,
+        label: value,
+        tooltip: value,
+        cursor: 'default',
+        appendToActionPayload,
+        isRead,
+        textOverflowMode
+      };
+
+    case FieldTypes.RadioDropdownField:
+      {
+        const options = pickListValues.map(option => ({
+          id: option.value,
+          value: option.value,
+          secondaryValue: ''
+        }));
+        return {
+          type: FieldTypes.RadioDropdownField,
+          fieldName: name,
+          options,
+          selectedId: value,
+          selectedValue: value,
+          dropdownHeading: displayLabel,
+          hasSearch: pickListValues.length > 4,
+          isDotted: textOverflowMode === 'clip',
+          weight: isRead ? undefined : 'bold',
+          searchPlaceholder: 'Search',
+          emptyStateTitle: 'No results found',
+          isDisabled: false,
+          isReadOnly: false,
+          appendToActionPayload,
+          isRead,
+          textOverflowMode
+        };
+      }
+
+    case FieldTypes.TextField:
+    default:
+      return {
+        type: FieldTypes.TextField,
+        fieldName: name,
+        text: value,
+        isDotted: textOverflowMode === 'clip',
+        weight: isRead ? undefined : 'bold',
+        tooltip: value,
+        appendToActionPayload,
+        isRead,
+        textOverflowMode
+      };
+  }
+};
+
+const colorMapper = {
+  "#1e1e1e": "grey",
+  "#fd1d1d": "red",
+  "#fd5901": "orange",
+  "#71c02b": "green",
+  "#405de6": "blue"
+};
+
+const ColouredPickListFieldTranslator = (field, value, appendToActionPayload, textOverflowMode, isRead) => {
+  const {
+    uiType,
     name,
-    isRead,
-    value,
-    textOverflowMode
-  });
+    displayLabel,
+    pickListValues = EMPTY_ARRAY
+  } = field;
+  const selectedOption = pickListValues.find(option => option.value === value);
+
+  switch (uiType) {
+    case FieldTypes.TextField:
+      return {
+        type: FieldTypes.TextField,
+        fieldName: name,
+        text: value,
+        isDotted: textOverflowMode === 'clip',
+        weight: isRead ? undefined : 'bold',
+        tooltip: value,
+        appendToActionPayload,
+        isRead,
+        textOverflowMode
+      };
+
+    case FieldTypes.HighlightedValueField:
+      {
+        const highlightedValueColor = colorMapper[selectedOption?.colorCode?.toLowerCase()] || 'grey';
+        return {
+          type: FieldTypes.HighlightedValueField,
+          fieldName: name,
+          text: value,
+          color: highlightedValueColor,
+          isDotted: textOverflowMode === 'clip',
+          weight: isRead ? undefined : 'bold',
+          tooltip: value,
+          cursor: 'default',
+          appendToActionPayload,
+          isRead,
+          textOverflowMode
+        };
+      }
+
+    case FieldTypes.RadioDropdownField:
+      {
+        const options = pickListValues.map(option => ({
+          id: option.value,
+          value: option.value,
+          secondaryValue: ''
+        }));
+        const highlightedValueColor = colorMapper[selectedOption?.colorCode?.toLowerCase()] || 'grey';
+        return {
+          type: FieldTypes.RadioDropdownField,
+          fieldName: name,
+          options,
+          color: highlightedValueColor,
+          selectedId: value,
+          selectedValue: value,
+          dropdownHeading: displayLabel,
+          isDotted: textOverflowMode === 'clip',
+          weight: isRead ? undefined : 'bold',
+          hasSearch: pickListValues.length > 4,
+          searchPlaceholder: 'Search',
+          emptyStateTitle: 'No results found',
+          isDisabled: false,
+          isReadOnly: false,
+          appendToActionPayload,
+          isRead,
+          textOverflowMode
+        };
+      }
+
+    case FieldTypes.TagField:
+    default:
+      {
+        return {
+          type: FieldTypes.TagField,
+          fieldName: name,
+          label: value,
+          color: selectedOption.colorCode || '',
+          tooltip: value,
+          cursor: 'default',
+          appendToActionPayload,
+          isRead
+        };
+      }
+  }
 };

package/es/platform/zlist/adapters/presenters/translators/fields/SingleLineFieldTranslator.js

@@ -1,6 +1,5 @@
 // import FieldModel from '@platform/zfield/entities/interfaces/FieldModel';
 import FieldTypes from "../../../../../../cc/fields/field/Types";
-import TextFieldModel from "../../../../../../cc/fields/text/Model";
 
 const SingleLineFieldTranslator = _ref => {
   let {
@@ -14,14 +13,22 @@ const SingleLineFieldTranslator = _ref => {
     uiType,
     name
   } = field;
-  return TextFieldModel({
-    uiType: uiType || FieldTypes.SingleLineField,
-    appendToActionPayload,
-    name,
-    isRead,
-    value,
-    textOverflowMode
-  });
+
+  switch (uiType) {
+    case FieldTypes.TextField:
+    default:
+      return {
+        type: FieldTypes.TextField,
+        fieldName: name,
+        text: value,
+        isDotted: textOverflowMode === 'clip',
+        weight: isRead ? undefined : 'bold',
+        tooltip: value,
+        appendToActionPayload,
+        isRead,
+        textOverflowMode
+      };
+  }
 };
 
 export default SingleLineFieldTranslator;

package/es/platform/zlist/adapters/presenters/translators/fields/URLFieldTranslator.js

@@ -1,6 +1,5 @@
 // import FieldModel from '@platform/zfield/entities/interfaces/FieldModel';
 import FieldTypes from "../../../../../../cc/fields/field/Types";
-import UrlFieldModel from "../../../../../../cc/fields/url/Model";
 
 const URLFieldTranslator = _ref => {
   let {
@@ -14,14 +13,38 @@ const URLFieldTranslator = _ref => {
     uiType,
     name
   } = field;
-  return UrlFieldModel({
-    uiType: uiType || FieldTypes.URLField,
-    appendToActionPayload,
-    name,
-    isRead,
-    value,
-    textOverflowMode
-  });
+
+  switch (uiType) {
+    case FieldTypes.TextField:
+      return {
+        type: FieldTypes.TextField,
+        fieldName: name,
+        text: value,
+        isDotted: textOverflowMode === 'clip',
+        weight: isRead ? undefined : 'bold',
+        tooltip: value,
+        appendToActionPayload,
+        isRead,
+        textOverflowMode
+      };
+
+    case FieldTypes.LinkField:
+    default:
+      return {
+        type: FieldTypes.LinkField,
+        fieldName: name,
+        text: value,
+        variant: 'secondary',
+        href: value,
+        opensNewTab: true,
+        isDotted: textOverflowMode === 'clip',
+        weight: isRead ? undefined : 'bold',
+        tooltip: value,
+        appendToActionPayload,
+        isRead,
+        textOverflowMode
+      };
+  }
 };
 
 export default URLFieldTranslator;

package/es/platform/zlist/adapters/presenters/utils/DateAndTimeFormat.js

@@ -0,0 +1,25 @@
+import { i18NProviderUtils } from '@zohodesk/i18n';
+export function DateAndTimeFormat(_ref) {
+  let {
+    value,
+    isDateTimeField,
+    isShortenDateTimeInfo
+  } = _ref;
+  const date = value instanceof Date ? value : new Date(value);
+  if (isNaN(date.getTime())) return '';
+  const formattedDate = i18NProviderUtils.userDateFormat(date, {}, '', '', false, _ref2 => {
+    let {
+      dateFormat,
+      dateTimeFormat,
+      timeFormat
+    } = _ref2;
+    const isCurrentDate = date.toDateString() === new Date().toDateString();
+
+    if (isDateTimeField && isShortenDateTimeInfo && isCurrentDate) {
+      return timeFormat;
+    }
+
+    return isDateTimeField ? dateTimeFormat : dateFormat;
+  });
+  return formattedDate;
+}

package/es/platform/zlist/adapters/presenters/utils/DefaultClientActions.js

@@ -1,7 +1,10 @@
 /* eslint-disable max-lines-per-function */
+import { i18NProviderUtils } from '@zohodesk/i18n';
 import { TableListConstants } from "../../../../../cc/table-list";
 import { CheckboxConstants } from "../../../../../cc/checkbox";
 import ClientAction from "../../../../client-actions/behaviour/zclient-actions/domain/entities/ClientAction";
+import { SORT_CLICKED } from "../../../../../cc/table-column-sort/Constants";
+import { SMART_TABLE_SORT_BY_REQUESTED } from "../../../../../cc/table-connected/constants/Events";
 const CHECKBOX_TOGGLED = CheckboxConstants.CHECKBOX_TOGGLED;
 const TABLE_LIST_TOGGLE_ALL_SELECTION = TableListConstants.TABLE_LIST_TOGGLE_ALL_SELECTION;
 
@@ -22,8 +25,8 @@ class DefaultClientActions {
         name: 'SortBy',
         propertiesValueMapping: {
           value: '{{@context.field.sort.order}}',
-          ascendingLabel: 'Ascending',
-          descendingLabel: 'Descending'
+          ascendingLabel: i18NProviderUtils.getI18NValue('crm.report.wizard.groupings.asc'),
+          descendingLabel: i18NProviderUtils.getI18NValue('crm.report.wizard.groupings.desc')
         },
         eventMappings: [{
           payloadValueMapping: {
@@ -31,8 +34,8 @@ class DefaultClientActions {
             name: '{{@context.field.name}}',
             order: `{{@payload.value}}`
           },
-          sourceEvent: 'SORT#CLICKED',
-          targetEvent: 'SMART_TABLE#SORT',
+          sourceEvent: SORT_CLICKED,
+          targetEvent: SMART_TABLE_SORT_BY_REQUESTED,
           id: '4000000080005'
         }],
         id: '4000000080003'

package/es/platform/zlist/adapters/presenters/utils/fieldSortLabels.js

@@ -0,0 +1,38 @@
+import { i18NProviderUtils } from '@zohodesk/i18n';
+export function getFieldTypeSortLabels(fieldType) {
+  let ascendLabel = 'Ascending';
+  let descendLabel = 'Descending';
+
+  switch (fieldType) {
+    case 'Number':
+    case 'Decimal':
+    case 'Percent':
+    case 'Currency':
+      ascendLabel = i18NProviderUtils.getI18NValue('support.platform.smart.libraries.sort.tooltip', i18NProviderUtils.getI18NValue('support.platform.smart.libraries.sort.order.number.ascending'));
+      descendLabel = i18NProviderUtils.getI18NValue('support.platform.smart.libraries.sort.tooltip', i18NProviderUtils.getI18NValue('support.platform.smart.libraries.sort.order.number.descending'));
+      break;
+
+    case 'Date':
+    case 'DateTime':
+      ascendLabel = i18NProviderUtils.getI18NValue('support.platform.smart.libraries.sort.tooltip', i18NProviderUtils.getI18NValue('support.platform.smart.libraries.sort.order.date.ascending'));
+      descendLabel = i18NProviderUtils.getI18NValue('support.platform.smart.libraries.sort.tooltip', i18NProviderUtils.getI18NValue('support.platform.smart.libraries.sort.order.date.descending'));
+      break;
+
+    case 'Text':
+    case 'MultiLine':
+    case 'Email':
+    case 'Phone':
+    case 'Picklist':
+    case 'Multiselect':
+    case 'LookUp':
+    default:
+      ascendLabel = i18NProviderUtils.getI18NValue('support.platform.smart.libraries.sort.tooltip', i18NProviderUtils.getI18NValue('support.platform.smart.libraries.sort.order.text.ascending'));
+      descendLabel = i18NProviderUtils.getI18NValue('support.platform.smart.libraries.sort.tooltip', i18NProviderUtils.getI18NValue('support.platform.smart.libraries.sort.order.text.descending'));
+      break;
+  }
+
+  return {
+    ascendLabel,
+    descendLabel
+  };
+}

package/es/platform/zlist/applications/entities-factory/ListFactory.js

@@ -4,13 +4,13 @@ class ListFactory {
   static createList(input) {
     const {
       limit,
-      sortBy,
+      sortConfig,
       query,
       context,
       errorState,
       isReOrderLoading
     } = input;
-    return new List(limit, sortBy, query, context, isReOrderLoading, errorState);
+    return new List(limit, sortConfig, query, context, isReOrderLoading, errorState);
   }
 
 }

package/es/platform/zlist/applications/interfaces/input/GetSortConfigUseCaseInputModel.js

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

package/es/platform/zlist/applications/interfaces/input/RefreshRecordsRequestedUseCaseInputModel.js

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

package/es/platform/zlist/applications/interfaces/input/SetSortConfigUseCaseInputModel.js

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

package/es/platform/zlist/applications/usecases/GetSortConfigUseCase.js

@@ -0,0 +1,17 @@
+import AbstractUseCase from "./AbstractUseCase";
+
+class GetSortConfigUseCase extends AbstractUseCase {
+  execute(input) {
+    const {
+      callback
+    } = input;
+    const {
+      repository
+    } = this.dependencies;
+    const list = repository.getList();
+    callback?.(list.getSortConfig());
+  }
+
+}
+
+export default GetSortConfigUseCase;

package/es/platform/zlist/applications/usecases/RecordSuccessCallbackUsecase.js

@@ -36,7 +36,7 @@ class RecordSuccessCallbackUsecase extends AbstractUseCase {
     }
 
     if (list.isAcknowledgeBySortBy(metaData)) {
-      list.setSortBy(metaData);
+      list.setSortConfig(metaData);
       presenter.updateView(list.toObject());
     }
   }

package/es/platform/zlist/applications/usecases/RefreshRecordsRequestedUseCase.js

@@ -0,0 +1,17 @@
+import AbstractUseCase from "./AbstractUseCase";
+
+class RefreshRecordsRequestedUseCase extends AbstractUseCase {
+  execute(input) {
+    const {
+      dispatch
+    } = input;
+    const {
+      repository
+    } = this.dependencies;
+    const list = repository.getList();
+    dispatch(list.createRecordsRefetchAction());
+  }
+
+}
+
+export default RefreshRecordsRequestedUseCase;

package/es/platform/zlist/applications/usecases/SetSortConfigUseCase.js

@@ -0,0 +1,26 @@
+import AbstractUseCase from "./AbstractUseCase";
+import { SMART_TABLE_SORTED } from "../../../../cc/table-connected/constants/Events";
+
+class SetSortConfigUseCase extends AbstractUseCase {
+  execute(input) {
+    const {
+      sortConfig,
+      dispatch
+    } = input;
+    const {
+      repository,
+      presenter
+    } = this.dependencies;
+    const list = repository.getList();
+    list.setSortConfig(sortConfig);
+    presenter.updateView(list.toObject());
+    dispatch(list.createRecordsRefetchAction());
+    dispatch({
+      type: SMART_TABLE_SORTED,
+      payload: sortConfig
+    });
+  }
+
+}
+
+export default SetSortConfigUseCase;

package/es/platform/zlist/applications/usecases/SortUseCase.js

@@ -1,10 +1,10 @@
-import { SmartTableConstants } from "../../../../cc/table-connected";
 import AbstractUseCase from "./AbstractUseCase";
+import { SMART_TABLE_SORTED } from "../../../../cc/table-connected/constants/Events";
 
 class SortUseCase extends AbstractUseCase {
   execute(input) {
     const {
-      sortBy,
+      sortConfig,
       dispatch
     } = input;
     const {
@@ -12,13 +12,13 @@ class SortUseCase extends AbstractUseCase {
       presenter
     } = this.dependencies;
     const list = repository.getList();
-    list.setSortBy(sortBy);
+    list.setSortConfig(sortConfig);
+    presenter.updateView(list.toObject());
     dispatch(list.createRecordsRefetchAction());
     dispatch({
-      type: SmartTableConstants.Events.SORTED,
-      payload: sortBy
+      type: SMART_TABLE_SORTED,
+      payload: sortConfig
     });
-    presenter.updateView(list.toObject());
   }
 
 }

package/es/platform/zlist/domain/entities/List.js

@@ -3,13 +3,13 @@ import { FIELD_EXECUTE, FIELD_REFETCH } from "../../../../bc/zfield/Constants";
 import { CLIENTACTION_BEHAVIOUR_EXECUTE } from "../../../client-actions/bc/zclient-actions/Constants";
 import { CLIENT_ACTION_TABLE_LIST_COMPONENT_NAME, ZLIST_RECORD_DELETE_SUCCEEDED, ZLIST_RECORD_UPDATE_SUCCEEDED } from "../../../../bc/zlist/Constants";
 import { SmartTableConstants } from "../../../../cc/table-connected";
-import SortBy from "./SortBy";
 import { CLIENTSCRIPT_FETCH } from "../../../client-scripts/bc/zclient-scripts-fetch/Constants";
+import { SortOrder, stringToSortConfig } from "../../../../bc/zlist/Types";
 
 class List {
-  constructor(limit, sortBy, query, context, isReOrderLoading, errorState) {
+  constructor(limit, sortConfig, query, context, isReOrderLoading, errorState) {
     this.limit = limit;
-    this.sortBy = sortBy;
+    this.sortConfig = sortConfig;
     this.query = query;
     this.context = context;
     this.isReOrderLoading = isReOrderLoading;
@@ -19,7 +19,7 @@ class List {
   toObject() {
     return {
       limit: this.limit,
-      sortBy: this.sortBy.toObject(),
+      sortConfig: this.sortConfig,
       isReOrderLoading: this.isReOrderLoading,
       errorState: this.errorState.toObject()
     };
@@ -37,16 +37,12 @@ class List {
     this.isReOrderLoading = false;
   }
 
-  setSortBy(sortBy) {
-    this.sortBy = new SortBy(sortBy.id, sortBy.name, sortBy.order);
+  getSortConfig() {
+    return this.sortConfig;
   }
 
-  toggleSortBy() {
-    const {
-      id,
-      name
-    } = this.sortBy;
-    this.sortBy.doSorting(id, name);
+  setSortConfig(sortConfig) {
+    this.sortConfig = sortConfig;
   }
 
   isAcknowledgeBySortBy(metaData) {
@@ -65,16 +61,32 @@ class List {
     return variableName ? computedContext?.[variableName] : computedContext;
   }
 
+  getSortByQueryString() {
+    const {
+      fieldName,
+      order
+    } = this.sortConfig;
+
+    if (order === SortOrder.DES) {
+      return `-${fieldName}`;
+    }
+
+    if (order === SortOrder.ASC) {
+      return fieldName;
+    }
+
+    return '';
+  }
+
   createApiProps() {
     const {
       query,
       limit,
-      sortBy,
       context
     } = this;
     return {
       limit,
-      sortBy: sortBy.toQueryString(),
+      sortBy: this.getSortByQueryString(),
       ...query,
       ...context
     };
@@ -111,7 +123,7 @@ class List {
     } = currentProperties;
 
     if (prevSortBy !== sortBy) {
-      return [this.createRecordsRefetchAction()];
+      this.setSortConfig(stringToSortConfig(sortBy));
     }
 
     if (preDepartmentId !== currentDepartmentId) {
@@ -127,6 +139,10 @@ class List {
       // TODO: this.createSelectedFieldsRefetchAction()
     }
 
+    if (prevSortBy !== sortBy) {
+      return [this.createRecordsRefetchAction()];
+    }
+
     return [];
   }
 
@@ -357,7 +373,7 @@ class List {
     const props = this.createApiProps();
     const metaData = triggerer === 'sortBy' && {
       ['SMART_TABLE#SORTED']: {
-        sortBy: this.sortBy.toObject()
+        sortBy: this.sortConfig
       }
     };
     return {

package/es/platform/zlist/domain/entities/interfaces/Properties.js

@@ -1,6 +1,6 @@
-export let SortOrder = /*#__PURE__*/function (SortOrder) {
-  SortOrder["NONE"] = "none";
-  SortOrder["ASC"] = "ascending";
-  SortOrder["DES"] = "descending";
-  return SortOrder;
+export let SortModelOrder = /*#__PURE__*/function (SortModelOrder) {
+  SortModelOrder["NONE"] = "none";
+  SortModelOrder["ASC"] = "ascending";
+  SortModelOrder["DES"] = "descending";
+  return SortModelOrder;
 }({});