@zohodesk/library-platform 1.1.10 → 1.1.12-exp.1

package/es/platform/zhttp/adapters/controllers/FetchController.js

@@ -16,13 +16,17 @@ class FetchController {
       metaData
     } = action;
     const {
-      headers
+      headers: headersFromProps
     } = state.properties;
+    const {
+      headers: headersFromContext
+    } = state.behaviours.appContext;
     const {
       url,
       method,
       getResponse
     } = payload;
+    const headers = headersFromProps ? headersFromProps : headersFromContext;
     this.fetchUseCase.execute({
       url,
       method,

package/es/platform/zlist/adapters/controllers/ResolutionBasedLimitController.js

@@ -0,0 +1,26 @@
+import AbstractController from "./AbstractController";
+
+class ResolutionBasedLimitController extends AbstractController {
+  handle(event) {
+    const {
+      state,
+      updateState,
+      dispatch,
+      action
+    } = event;
+    const {
+      resolutionBasedLimit
+    } = action.payload;
+    const {
+      resolutionBasedLimitUseCase
+    } = this.service;
+    resolutionBasedLimitUseCase.updateDependency(state, updateState);
+    resolutionBasedLimitUseCase.execute({
+      dispatch,
+      resolutionBasedLimit
+    });
+  }
+
+}
+
+export default ResolutionBasedLimitController;

package/es/platform/zlist/adapters/gateways/Repository.js

@@ -12,13 +12,16 @@ class Repository {
       departmentId,
       viewId,
       moduleName,
-      query,
-      context
+      query
     } = this.state.properties;
+    const {
+      context
+    } = this.state.behaviours.appContext;
     const {
       sortBy,
       errorState,
-      isReOrderLoading
+      isReOrderLoading,
+      limit
     } = this.getZListState();
     const list = ListFactory.createList({
       context,
@@ -29,7 +32,7 @@ class Repository {
         ...query
       },
       sortBy: new SortBy(sortBy.id, sortBy.name, sortBy.order),
-      limit: 50,
+      limit: limit,
       isReOrderLoading,
       errorState: new ListErrorState(errorState)
     });

package/es/platform/zlist/adapters/gateways/Service.js

@@ -13,11 +13,13 @@ import DeleteSuccessUseCase from "../../applications/usecases/DeleteSuccessUseCa
 import RecordSuccessCallbackUsecase from "../../applications/usecases/RecordSuccessCallbackUsecase";
 import ReOrderUseCase from "../../applications/usecases/ReOrderUseCase";
 import ReOrderFailedUseCase from "../../applications/usecases/ReOrderFailedUseCase";
+import ResolutionBasedLimitUseCase from "../../applications/usecases/ResolutionBasedLimitUseCase";
 
 class Service {
   constructor(dependencies) {
     this.dependencies = dependencies;
     this.initializeUseCase = new InitializeUseCase(this.dependencies);
+    this.resolutionBasedLimitUseCase = new ResolutionBasedLimitUseCase(this.dependencies);
     this.propertiesChangeUseCase = new PropertiesChangeUseCase(this.dependencies);
     this.fetchMoreUseCase = new FetchMoreUseCase(this.dependencies);
     this.fieldChangeUseCase = new FieldChangeUseCase(this.dependencies);

package/es/platform/zlist/adapters/presenters/SelectionTranslator.js

@@ -12,22 +12,30 @@ export default function SelectionTranslator(state) {
   const {
     columnChooserConfig,
     selectionConfig,
-    context,
-    moduleName
+    moduleName,
+    instanceName,
+    textOverflowConfig
   } = properties;
+  const {
+    context
+  } = state.behaviours.appContext;
   const {
     zfield,
     selection,
-    columnChooser
+    columnChooser,
+    textOverflow
   } = behaviours;
   const {
     selected,
     hasAllSelected
   } = selection;
   const availableFields = zfield.fields;
-  const columnChooserProps = getColumnChooserProps(columnChooser, availableFields, context, moduleName);
-  const clientActions = generateClientActions(selectionConfig, columnChooserConfig, hasAllSelected, columnChooserProps);
-  const contextAppliedActions = ClientActionsTranslator.transform(clientActions, context);
+  const columnChooserProps = getColumnChooserProps(columnChooser, availableFields, context, moduleName, columnChooserConfig);
+  const clientActions = generateClientActions(selectionConfig, columnChooserConfig, hasAllSelected, columnChooserProps, {
+    isEnabled: textOverflowConfig.isEnabled,
+    mode: textOverflow.mode
+  });
+  const contextAppliedActions = ClientActionsTranslator.transform(clientActions, instanceName, moduleName, context);
   return {
     selected,
     hasAllSelected,
@@ -35,12 +43,14 @@ export default function SelectionTranslator(state) {
   };
 }
 
-function generateClientActions(selectionConfig, columnChooserConfig, hasAllSelected, columnChooserProps) {
+function generateClientActions(selectionConfig, columnChooserConfig, hasAllSelected, columnChooserProps, textOverflowConfig) {
   const clientActions = [];
 
   if (selectionConfig.isEnabled) {
     if (columnChooserConfig.isEnabled) {
-      const columnChooserAction = DefaultClientActions.createColumnChooserAction(columnChooserProps);
+      const columnChooserAction = DefaultClientActions.createColumnChooserAction({ ...columnChooserProps,
+        textOverflowConfig
+      });
       clientActions.push(columnChooserAction);
     } else if (selectionConfig.isSelectAllEnabled) {
       const selectAllColumnsAction = DefaultClientActions.createSelectAllAction(hasAllSelected);
@@ -55,6 +65,7 @@ function getColumnChooserProps(columnChooser) {
   let availableFields = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
   let context = arguments.length > 2 ? arguments[2] : undefined;
   let moduleName = arguments.length > 3 ? arguments[3] : undefined;
+  let columnChooserConfig = arguments.length > 4 ? arguments[4] : undefined;
   const {
     searchText: searchString,
     fieldsOrder,
@@ -62,8 +73,11 @@ function getColumnChooserProps(columnChooser) {
     isMaxSelectionReached
   } = columnChooser;
   const fieldMap = mapFieldsToObject(availableFields);
-  const disabledFieldName = context.modules?.find(module => module.apiKey === moduleName)?.nameField;
-  const columnChooserOptions = fieldsOrder.map(fieldName => getOption(fieldMap[fieldName], !!selected[fieldName], disabledFieldName === fieldName));
+  const moduleConfig = context.modules?.find(module => module.apiKey === moduleName);
+  const disabledFieldName = moduleConfig?.nameField;
+  const restrictedFields = columnChooserConfig?.fieldRestrictionConfig || [];
+  const hasRestrictions = Array.isArray(restrictedFields) && restrictedFields.length > 0;
+  const columnChooserOptions = fieldsOrder.map(fieldName => getOption(fieldMap[fieldName], restrictedFields.includes(fieldName) || !!selected[fieldName], restrictedFields.includes(fieldName) || !hasRestrictions && disabledFieldName === fieldName));
   return {
     options: columnChooserOptions,
     searchString,

package/es/platform/zlist/adapters/presenters/TableTranslator.js

@@ -24,26 +24,37 @@ export default class TableTranslator {
     } = state;
     const {
       componentMapping,
-      context,
-      reOrderConfig
+      reOrderConfig,
+      instanceName
     } = properties;
+    const {
+      context
+    } = behaviours.appContext;
     const {
       localStorage: localStorageBehaviour,
       columnResizer,
-      keyboardControls
+      keyboardControls,
+      textOverflow
     } = behaviours;
     const {
       resizeConfig,
       preferences,
-      keyboardControlsConfig
+      keyboardControlsConfig,
+      nameFieldsConfig,
+      textOverflowConfig,
+      recordReadStatusConfig
     } = properties;
+    const {
+      modules
+    } = context;
     context['servicePrefix'] = 'supportapi/zd'; // FIX: servicePrefix defaultValue should be available from properties
 
     const {
       zlist,
       zrecord,
       zfield,
-      zclientAction
+      zclientAction,
+      zclientScriptsEventMapping
     } = fallbackToDefault(behaviours, {}); // FIX: behaviours should be available by default
 
     const {
@@ -66,6 +77,10 @@ export default class TableTranslator {
       isFetching: isClientActionsFetching
     } = fallbackToDefault(zclientAction, {}); // FIX: zclientAction should be available by defaultlt
 
+    const {
+      clientScripts,
+      isFetching: isClientScriptsFetching
+    } = fallbackToDefault(zclientScriptsEventMapping, {});
     const fieldComponentMapping = fallbackToDefault(componentMapping.fields, {});
     const rowActionsUiType = componentMapping.rowActionsComponentName;
     const {
@@ -82,12 +97,18 @@ export default class TableTranslator {
     const isLoading = !!(isRecordsFetching || isAvailableFieldsFetching || isSelectedFieldsFetching);
     const fields = selectedFields?.map(selectedField => availableFields?.find(availableField => availableField.name === selectedField)).filter(f => f != undefined);
     const newClientActions = DefaultClientActions.createSortActions(fields, clientActions || EMPTY_ARRAY);
+    const actionsToMap = [...newClientActions];
+
+    if (recordReadStatusConfig?.isEnabled) {
+      actionsToMap.push(DefaultClientActions.createMarkAsReadAction(), DefaultClientActions.createMarkAsUnReadAction());
+    }
+
     const {
       headerActions,
       fieldActions,
       rowActions,
       noLocation
-    } = mapClientActions(newClientActions || EMPTY_ARRAY);
+    } = mapClientActions(actionsToMap);
     const isRowClickable = noLocation.some(action => action.uiComponentMapping.eventMappings.some(mapping => mapping.sourceEvent === TableListConstants.TABLE_LIST_ROW_CLICKED));
     const rowCursor = isRowClickable ? RowCursor.Pointer : RowCursor.Default;
     const rowActionsWidth = preferences?.rowActions?.width;
@@ -99,12 +120,30 @@ export default class TableTranslator {
     const localStorageFieldWidths = fallbackToDefault(localStorageBehaviour?.[moduleName]?.[viewId]?.modifiedWidths, EMPTY_OBJECT);
     const modifiedWidths = calculateFieldWidths(fields, localStorageFieldWidths, preferences);
     const recordsForDisplay = isRecordsShouldBeEmptied ? EMPTY_ARRAY : records;
-    const headersTranslator = new HeadersTranslator(fields, headerActions, context, modifiedWidths, sortBy, records);
-    const rowsTranslator = new RowsTranslator(recordsForDisplay, fields, rowActions, context, preferences, fieldComponentMapping, rowActionsUiType, fieldActions); // const actionTranslator = new ClientActionsTranslator(clientActions, records, fields, pageContext);
+    const textOverflowData = {
+      isEnabled: textOverflowConfig.isEnabled,
+      mode: textOverflow.mode
+    }; // ComponentMapping support
+
+    zfield.componentMapping && zfield.componentMapping.length && zfield.componentMapping.forEach(fieldVariation => {
+      const {
+        fieldName,
+        uiType,
+        translator
+      } = fieldVariation;
+      const field = fields.find(f => f.name === fieldName);
+
+      if (field) {
+        field.uiType = uiType;
+      }
+    });
+    const headersTranslator = new HeadersTranslator(fields, headerActions, context, modifiedWidths, sortBy, records, instanceName, moduleName);
+    const rowsTranslator = new RowsTranslator(recordsForDisplay, fields, rowActions, context, preferences, fieldComponentMapping, rowActionsUiType, fieldActions, instanceName, textOverflowData, moduleName, nameFieldsConfig, recordReadStatusConfig, zfield.componentMapping && [...zfield.componentMapping] || []); // const actionTranslator = new ClientActionsTranslator(clientActions, records, fields, pageContext);
     // const translators = [headersTranslator.getTranslator(), rowsTranslator.getTranslator(), actionTranslator.getTranslator()];
 
     const translators = [headersTranslator.getTranslator(), rowsTranslator.getTranslator()];
-    const data = Pipeline.run(translators, {}); // TODO: Implement ModuleTableModel, and move data and isLoading to tableViewModel Object
+    let data = Pipeline.run(translators, {});
+    data.clientScripts = clientScripts; // TODO: Implement ModuleTableModel, and move data and isLoading to tableViewModel Object
 
     return {
       properties,
@@ -128,6 +167,7 @@ export default class TableTranslator {
           columnWidth: typeof rowActionsWidth === 'number' ? rowActionsWidth : ColumnWidth.XSmall
         },
         keyboardControlsConfig,
+        textOverflowConfig: textOverflowData,
         isLoading,
         isReOrderLoading,
         emptyStateUiType: componentMapping.emptyState || '',
@@ -145,7 +185,7 @@ function mapClientActions(clientActions) {
   const allowedActingLocations = ['header_actions', 'field_actions', 'row_actions', null];
   clientActions.forEach(action => {
     if (!allowedActingLocations.includes(action.location)) {
-      console.warn('Client action without location:', action.location);
+      __DEVELOPMENT__ && console.warn('Client action without location:', action.location);
     }
   });
   return {

package/es/platform/zlist/adapters/presenters/translators/ColumnTranslator.js

@@ -1,38 +1,25 @@
 import EmptyViewModel from "./EmptyViewModel";
 import * as FieldTranslators from "./fields";
 import ClientActionsTranslator from "../../../../client-actions/translators/client-actions-translator";
+import { isValidFieldVariation } from "./FieldVariations";
 
-//hacking temp url construction for lookup
-function getLookupUrlConstructions(_ref) {
-  let {
-    field,
-    value,
-    context
-  } = _ref;
-  let {
-    orgName,
-    departmentName
-  } = context;
-  let lookupModuleName = field?.lookup?.module?.apiName;
-  return `/agent/${orgName}/${departmentName}/${lookupModuleName}/details/${value.id}`;
-}
-
-function ColumnTranslator(field, record, fieldComponentMapping, fieldActions, context, preferences) {
+function ColumnTranslator(field, record, fieldComponentMapping, fieldActions, context, preferences, instanceName, moduleName, textOverflowConfig, nameFieldsConfig, recordReadStatusConfig, componentMapping) {
   const {
     isCustomField,
     name,
     type
   } = field;
-  let fieldToUiValue;
+  const {
+    modules
+  } = context;
   const fieldEntry = fieldComponentMapping[name];
 
   if (typeof fieldEntry == 'string') {
-    console.warn(`The string format for componentMapping will soon be deprecated. Please update to the new JSON format. REF : ${JSON.stringify(fieldEntry)}`);
+    __DEVELOPMENT__ && console.warn(`The string format for componentMapping will soon be deprecated. Please update to the new JSON format. REF : ${JSON.stringify(fieldEntry)}`);
   }
 
-  let tempValue = undefined;
   let value = isCustomField ? record.cf?.[name] : record[name];
-  const actions = ClientActionsTranslator.transform(fieldActions, {
+  const actions = ClientActionsTranslator.transform(fieldActions, instanceName, moduleName, {
     field,
     record
   });
@@ -41,58 +28,95 @@ function ColumnTranslator(field, record, fieldComponentMapping, fieldActions, co
     return EmptyViewModel(name);
   }
 
-  if (fieldComponentMapping[name]) {
-    field.uiType = fieldComponentMapping[name];
+  if (field.uiType && !isValidFieldVariation(type, field.uiType)) {
+    __DEVELOPMENT__ && console.warn(`The uiType ${field.uiType} is not a valid variation for field type ${type}. Ignoring the uiType.`);
   }
 
-  const fieldTranslator = FieldTranslators[type];
+  if (typeof fieldEntry === 'string') {
+    field.uiType = fieldEntry;
+  }
+
+  let nameFieldTypes = ['Text'];
+  let moduleApiKeyCheck = modules && modules.some(m => {
+    return m.apiKey === field.name;
+  });
+  const fieldTranslator = nameFieldsConfig.isEnabled && nameFieldTypes.includes(field.type) && moduleApiKeyCheck ? FieldTranslators['NameField'] : FieldTranslators[type];
 
   if (!fieldTranslator) {
-    console.error(`Field type ${type} not supported`);
+    __DEVELOPMENT__ && console.error(`Field type ${type} not supported`);
     return EmptyViewModel(name);
   }
 
-  if (field.type == "LookUp") {
-    // temp fix for when lookup field don't have value !object
-    tempValue = typeof value !== 'object' ? {
-      name: value,
-      id: value
-    } : value;
-    tempValue.url = getLookupUrlConstructions({
-      field,
-      value,
-      context
-    });
-  }
-
-  let finalValue = value;
-
-  if (fieldToUiValue !== undefined) {
-    finalValue = fieldToUiValue;
-  }
+  const translatorArgs = {
+    field,
+    value,
+    appendToActionPayload: {
+      recordId: record.id
+    },
+    context,
+    preferences,
+    moduleName,
+    constructUrl: nameFieldsConfig.constructUrl,
+    isPreventDefault: nameFieldsConfig.isPreventDefault || false,
+    textOverflowMode: textOverflowConfig.mode || 'clip'
+  };
 
-  if (fieldEntry && typeof fieldEntry === 'object') {
-    let data = {
-      actions,
-      ...fieldTranslator(field, tempValue ? tempValue : finalValue, {
-        recordId: record.id
-      }, context, preferences)
-    };
-    data.value = fieldEntry.fieldToUIComponentTranslator({
-      field,
-      record,
-      context
-    });
-    data.type = fieldEntry.UIComponentName;
-    return data;
+  if (recordReadStatusConfig?.isEnabled) {
+    translatorArgs.isRead = record.isRead;
+  } else {
+    translatorArgs.isRead = true;
   }
 
-  return {
+  const viewModel = {
     actions,
-    ...fieldTranslator(field, finalValue, {
-      recordId: record.id
-    }, context, preferences)
+    ...fieldTranslator(translatorArgs)
   };
+
+  if (componentMapping && componentMapping.translator) {
+    return { ...viewModel,
+      ...componentMapping.translator({
+        viewModel,
+        field,
+        record,
+        context,
+        preferences
+      })
+    };
+  } else {
+    //will be deprecated soon
+    if (fieldEntry && typeof fieldEntry === 'object') {
+      viewModel.type = fieldEntry.UIComponentName;
+
+      if (fieldEntry.fieldToUIComponentTranslator) {
+        viewModel.value = fieldEntry.fieldToUIComponentTranslator({
+          field,
+          record,
+          context
+        });
+      }
+
+      if (fieldEntry.translator) {
+        const newViewModel = fieldEntry.translator({
+          viewModel: viewModel,
+          field,
+          record,
+          context,
+          preferences
+        });
+        return { ...newViewModel,
+          type: fieldEntry.UIComponentName ? fieldEntry.UIComponentName : field.uiType,
+          appendToActionPayload: {
+            recordId: record.id,
+            ...newViewModel.appendToActionPayload
+          }
+        };
+      }
+
+      ;
+    }
+
+    return viewModel;
+  }
 }
 
 export default ColumnTranslator;

package/es/platform/zlist/adapters/presenters/translators/FieldVariations.js

@@ -0,0 +1,25 @@
+import FieldTypes from "../../../../../cc/fields/field/Types";
+const variationsMap = {
+  'Boolean': [FieldTypes.CheckboxField, FieldTypes.SwitchField] // 'Date': ['DatePicker', 'DateTimePicker'],
+  // 'Text': ['SingleLineText', 'MultiLineText', 'RichText'],
+  // Add more field types and their variations as needed
+
+};
+export const isValidFieldVariation = (fieldType, uiType) => {
+  const validVariations = variationsMap[fieldType];
+  return validVariations ? validVariations.includes(uiType) : false;
+};
+/*
+
+Smart Table Field UI Variants:
+• Boolean - CheckBox, Switch, Text
+• Lookup - Link, Tag (Chip), LabeledAvatar
+• SingleLine - Text, Link (Name field)
+• MultiPicklist - TagsList, TagsDropdown
+• ColoredMultiPicklist - TagsList
+• ColoredPicklist - ColoredTag
+• URL - Link, Text
+• Email - Email
+• Date, DateTime, Picklist, Currency, Integer, Decimal, Phone, Percentage - Text
+
+*/

package/es/platform/zlist/adapters/presenters/translators/Header.js

@@ -1,20 +1,19 @@
-import ColumnAlignmentTranslator from "./ColumnAlignmentTranslator";
+import { Alignment } from "../../../../../cc/table-list/data-types/Header";
 import ClientActionsTranslator from "../../../../client-actions/translators/client-actions-translator";
 import { SortOrder } from "../../../../zlist/domain/entities/interfaces/Properties";
 import { i18NProviderUtils } from '@zohodesk/i18n';
 
-function HeaderTranslator(field, actions, context, modifiedWidths, sortBy, records) {
+function HeaderTranslator(field, actions, context, modifiedWidths, sortBy, records, instanceName, moduleName) {
   const {
     id,
     name,
     displayLabel,
-    isSortable,
-    type
+    isSortable
   } = field;
   const newField = { ...field,
     sort: translateSortBy(field.id, sortBy)
   };
-  const transformedActions = ClientActionsTranslator.transform(actions, { ...context,
+  const transformedActions = ClientActionsTranslator.transform(actions, instanceName, moduleName, { ...context,
     field: newField,
     recordsLength: records.length.toString()
   });
@@ -24,7 +23,7 @@ function HeaderTranslator(field, actions, context, modifiedWidths, sortBy, recor
     name: name,
     text: displayLabel,
     sortable: isSortable,
-    alignment: ColumnAlignmentTranslator(type),
+    alignment: Alignment.Left,
     width,
     actions: transformedActions
   };

package/es/platform/zlist/adapters/presenters/translators/HeadersTranslator.js

@@ -1,12 +1,14 @@
 import HeaderTranslator from "./Header";
 export default class HeadersTranslator {
-  constructor(fields, actions, context, modifiedWidths, sortBy, records) {
+  constructor(fields, actions, context, modifiedWidths, sortBy, records, instanceName, moduleName) {
     this.fields = fields;
     this.actions = actions;
     this.context = context;
     this.modifiedWidths = modifiedWidths;
     this.sortBy = sortBy;
     this.records = records;
+    this.instanceName = instanceName;
+    this.moduleName = moduleName;
     this.pipe = this.pipe.bind(this);
   }
 
@@ -15,7 +17,7 @@ export default class HeadersTranslator {
       return [];
     }
 
-    return this.fields.map(field => HeaderTranslator(field, this.actions, this.context, this.modifiedWidths, this.sortBy, this.records));
+    return this.fields.map(field => HeaderTranslator(field, this.actions, this.context, this.modifiedWidths, this.sortBy, this.records, this.instanceName, this.moduleName));
   }
 
   pipe(viewModel) {

package/es/platform/zlist/adapters/presenters/translators/Row.js

@@ -9,14 +9,20 @@ export default function RowTranslator(_ref) {
     rowActions,
     fieldActions,
     context,
-    preferences
+    preferences,
+    instanceName,
+    textOverflowConfig,
+    moduleName,
+    nameFieldsConfig,
+    recordReadStatusConfig,
+    componentMapping
   } = _ref;
-  const actions = ClientActionsTranslator.transform(rowActions, { ...context,
+  const actions = ClientActionsTranslator.transform(rowActions, instanceName, moduleName, { ...context,
     record
   });
   return {
     id: record.id,
-    columns: fields.map(field => ColumnTranslator(field, record, fieldComponentMapping, fieldActions, context, preferences)),
+    columns: fields.map(field => ColumnTranslator(field, record, fieldComponentMapping, fieldActions, context, preferences, instanceName, textOverflowConfig, moduleName, nameFieldsConfig, recordReadStatusConfig, componentMapping.find(item => item.fieldName === field.name))),
     rowActionLocation: {
       type: rowActionsUiType,
       actions

package/es/platform/zlist/adapters/presenters/translators/RowsTranslator.js

@@ -1,6 +1,6 @@
 import RowTranslator from "./Row";
 export default class RowsTranslator {
-  constructor(records, fields, rowActions, context, preferences, fieldComponentMapping, rowActionsUiType, fieldActions) {
+  constructor(records, fields, rowActions, context, preferences, fieldComponentMapping, rowActionsUiType, fieldActions, instanceName, textOverflowConfig, moduleName, nameFieldsConfig, recordReadStatusConfig, componentMapping) {
     this.records = records;
     this.fields = fields;
     this.rowActions = rowActions;
@@ -9,6 +9,12 @@ export default class RowsTranslator {
     this.fieldComponentMapping = fieldComponentMapping;
     this.rowActionsUiType = rowActionsUiType;
     this.fieldActions = fieldActions;
+    this.instanceName = instanceName;
+    this.textOverflowConfig = textOverflowConfig;
+    this.moduleName = moduleName;
+    this.nameFieldsConfig = nameFieldsConfig;
+    this.recordReadStatusConfig = recordReadStatusConfig;
+    this.componentMapping = componentMapping;
     this.pipe = this.pipe.bind(this);
   }
 
@@ -18,6 +24,7 @@ export default class RowsTranslator {
     }
 
     return this.records.map(record => RowTranslator({
+      componentMapping: this.componentMapping,
       record,
       fields: this.fields,
       fieldComponentMapping: this.fieldComponentMapping,
@@ -25,7 +32,12 @@ export default class RowsTranslator {
       rowActions: this.rowActions,
       fieldActions: this.fieldActions,
       context: this.context,
-      preferences: this.preferences
+      preferences: this.preferences,
+      instanceName: this.instanceName,
+      textOverflowConfig: this.textOverflowConfig,
+      moduleName: this.moduleName,
+      nameFieldsConfig: this.nameFieldsConfig,
+      recordReadStatusConfig: this.recordReadStatusConfig
     }));
   }