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

package/es/platform/zform/adapters/presenter/translators/SectionTranslator.js

@@ -11,7 +11,9 @@ function SectionTranslator(_ref) {
     fieldLevelActions,
     context,
     focusedFieldName,
-    preferences
+    preferences,
+    instanceName,
+    moduleName
   } = _ref;
   const mapping = componentMapping?.sections?.[section.name];
 
@@ -69,7 +71,7 @@ function SectionTranslator(_ref) {
       const transformedDefaultActions = createEmptyActions();
       Object.entries(defaultActions).forEach(_ref2 => {
         let [key, value] = _ref2;
-        let transformedDefaultAction = ClientActionsTranslator.transform(value, { ...context,
+        let transformedDefaultAction = ClientActionsTranslator.transform(value, instanceName, moduleName, { ...context,
           ...field
         });
         transformedDefaultActions[key] = transformedDefaultAction;
@@ -78,7 +80,7 @@ function SectionTranslator(_ref) {
       const transformedActions = createEmptyActions();
       Object.entries(fieldLevelActions).forEach(_ref3 => {
         let [key, value] = _ref3;
-        let transformedAction = ClientActionsTranslator.transform(value, { ...context,
+        let transformedAction = ClientActionsTranslator.transform(value, instanceName, moduleName, { ...context,
           ...field
         });
         transformedActions[key] = transformedAction;

package/es/platform/zform/applications/usecases/InitializeUseCase.js

@@ -1,53 +1,81 @@
 import AbstractUseCase from "./AbstractUseCase";
-import { ZFORM_MY_LAYOUTS_SUCCESS } from "../../../../bc/zform/Symbol";
-import { DATA_SOURCE_EXECUTE as DATA_BROKER_EXECUTE } from "../../../../bc/zdata-source/Constants";
-import { DATA_SOURCE_SUCCESS as DATA_BROKER_SUCCESS, DATA_SOURCE_NO_CONTENT as DATA_BROKER_NO_CONTENT } from "../../../../bc/zdata-source/Symbols";
+import { ZFORM_API_FAILURE, ZFORM_MY_LAYOUTS_SUCCESS } from "../../../../bc/zform/Symbol";
+import { DATA_SOURCE_EXECUTE } from "../../../../bc/zdata-source/Constants";
+import { DATA_SOURCE_SUCCESS, DATA_SOURCE_NO_CONTENT, DATA_SOURCE_FAILURE } from "../../../../bc/zdata-source/Symbols";
 import { CLIENTACTION_BEHAVIOUR_EXECUTE } from "../../../client-actions/bc/zclient-actions/Constants";
+import { ZFormApiActionName } from "../../../../bc/zform/Constants";
+import { CLIENTSCRIPT_FETCH } from "../../../client-scripts/bc/zclient-scripts-fetch/Constants";
 
 class InitializeUseCase extends AbstractUseCase {
   execute(input) {
     let {
-      dispatch
+      dispatch,
+      disableGetClientActions
     } = input;
     const zformEntity = this.dependencies.repository.getFormEntity();
     const context = zformEntity.getContext();
+
+    if (!disableGetClientActions) {
+      dispatch({
+        type: CLIENTACTION_BEHAVIOUR_EXECUTE,
+        payload: {
+          actionName: 'getClientActions',
+          props: {
+            modules: 'static_module',
+            components: 'smart_form',
+            limit: '1',
+            from: '12',
+            servicePrefix: 'supportapi/zd',
+            orgName: 'my_org'
+          },
+          apiName: 'clientActions'
+        }
+      });
+      dispatch({
+        type: CLIENTSCRIPT_FETCH,
+        payload: {
+          actionName: 'getClientScripts',
+          props: {
+            modules: 'static_module',
+            components: 'smart_form',
+            limit: '1',
+            from: '12',
+            servicePrefix: 'supportapi/zd',
+            orgName: 'my_org'
+          },
+          apiName: 'clientScripts'
+        }
+      });
+    }
+
     dispatch({
-      type: CLIENTACTION_BEHAVIOUR_EXECUTE,
-      payload: {
-        actionName: 'getClientActions',
-        props: {
-          moduleName: 'static_module',
-          component: 'smart_form',
-          limit: '1',
-          from: '12',
-          servicePrefix: 'zform',
-          orgName: 'orgName'
-        },
-        apiName: 'clientActions'
-      }
-    });
-    dispatch({
-      type: DATA_BROKER_EXECUTE,
+      type: DATA_SOURCE_EXECUTE,
       payload: {
-        actionName: "fetchMyLayouts",
+        actionName: ZFormApiActionName.getMyLayouts,
         props: { ...context,
           from: 1,
           limit: 50
         }
       },
       metaData: {
-        actionName: "fetchMyLayouts",
+        actionName: ZFormApiActionName.getMyLayouts,
         //hack
-        [DATA_BROKER_NO_CONTENT]: {
+        [DATA_SOURCE_NO_CONTENT]: {
           type: ZFORM_MY_LAYOUTS_SUCCESS,
           metaData: {
-            actionName: "fetchMyLayouts"
+            actionName: ZFormApiActionName.getMyLayouts
+          }
+        },
+        [DATA_SOURCE_FAILURE]: {
+          type: ZFORM_API_FAILURE,
+          metaData: {
+            actionName: ZFormApiActionName.getMyLayouts
           }
         },
-        [DATA_BROKER_SUCCESS]: {
+        [DATA_SOURCE_SUCCESS]: {
           type: ZFORM_MY_LAYOUTS_SUCCESS,
           metaData: {
-            actionName: "fetchMyLayouts"
+            actionName: ZFormApiActionName.getMyLayouts
           }
         }
       }

package/es/platform/zform/applications/usecases/MyFormSuccessUseCase.js

@@ -3,7 +3,7 @@ import ZSection from "../../domain/ZSection";
 import ZField from "../../domain/ZField";
 import { DATA_SOURCE_EXECUTE } from "../../../../bc/zdata-source/Constants";
 import { DATA_SOURCE_SUCCESS, DATA_SOURCE_NO_CONTENT, DATA_SOURCE_FAILURE } from "../../../../bc/zdata-source/Symbols";
-import { ZFORM_VALIDATION_RULES_FAILURE, ZFORM_VALIDATION_RULES_SUCCESS, ZFORM_LOOKUP_FIELD_SUCCESS } from "../../../../bc/zform/Symbol";
+import { ZFORM_API_FAILURE, ZFORM_VALIDATION_RULES_SUCCESS, ZFORM_LOOKUP_FIELD_SUCCESS } from "../../../../bc/zform/Symbol";
 
 class MyFormSuccessUseCase extends AbstractUseCase {
   execute(input) {
@@ -96,13 +96,13 @@ class MyFormSuccessUseCase extends AbstractUseCase {
       dispatch({
         type: DATA_SOURCE_EXECUTE,
         payload: {
-          actionName: 'fetchValidationRules',
+          actionName: 'getValidationRules',
           props: { ...context,
             activeRulesOnly: true
           }
         },
         metaData: {
-          actionName: 'fetchValidationRules',
+          actionName: 'getValidationRules',
           //hack
           transformerArg: {
             fields: zFormEntity.getAllFields().map(f => f.toObject())
@@ -110,19 +110,19 @@ class MyFormSuccessUseCase extends AbstractUseCase {
           [DATA_SOURCE_NO_CONTENT]: {
             type: ZFORM_VALIDATION_RULES_SUCCESS,
             metaData: {
-              actionName: 'fetchValidationRules'
+              actionName: 'getValidationRules'
             }
           },
           [DATA_SOURCE_FAILURE]: {
-            type: ZFORM_VALIDATION_RULES_FAILURE,
+            type: ZFORM_API_FAILURE,
             metaData: {
-              actionName: 'fetchValidationRules'
+              actionName: 'getValidationRules'
             }
           },
           [DATA_SOURCE_SUCCESS]: {
             type: ZFORM_VALIDATION_RULES_SUCCESS,
             metaData: {
-              actionName: 'fetchValidationRules'
+              actionName: 'getValidationRules'
             }
           }
         }

package/es/platform/zform/applications/usecases/MyLayoutSuccessUseCase.js

@@ -1,20 +1,21 @@
 import AbstractUseCase from "./AbstractUseCase";
-import { ZFORM_DEPENDENCY_MAPPINGS_SUCCESS, ZFORM_LAYOUT_RULES_SUCCESS, ZFORM_MY_FORM_SUCCESS } from "../../../../bc/zform/Symbol";
+import { ZFORM_API_FAILURE, ZFORM_DEPENDENCY_MAPPINGS_SUCCESS, ZFORM_LAYOUT_RULES_SUCCESS, ZFORM_MY_FORM_SUCCESS } from "../../../../bc/zform/Symbol";
 import { DATA_SOURCE_EXECUTE as DATA_BROKER_EXECUTE } from "../../../../bc/zdata-source/Constants";
-import { DATA_SOURCE_SUCCESS as DATA_BROKER_SUCCESS, DATA_SOURCE_NO_CONTENT as DATA_BROKER_NO_CONTENT } from "../../../../bc/zdata-source/Symbols";
+import { DATA_SOURCE_SUCCESS, DATA_SOURCE_NO_CONTENT, DATA_SOURCE_FAILURE } from "../../../../bc/zdata-source/Symbols";
 
 class MyLayoutSuccessUseCase extends AbstractUseCase {
   execute(input) {
     const {
       disableValidationRule,
-      disableLayoutRule
+      disableLayoutRule,
+      disableDependencyMapping
     } = input;
     let {
       dispatch,
       layouts,
       orgName
     } = input;
-    let layoutObject = layouts.length == 1 ? layouts[0] : layouts.find(layout => layout.isDefaultLayout == true); // dispatch({type:ZFORM_MY_FORM_REQUEST,payload:{isFetching:true}}) 
+    let layoutObject = layouts.length == 1 ? layouts[0] : layouts.find(layout => layout.isDefaultLayout == true); // dispatch({type:ZFORM_MY_FORM_REQUEST,payload:{isFetching:true}})
 
     const zformEntity = this.dependencies.repository.getFormEntity();
     zformEntity.setLayoutId(layoutObject?.id);
@@ -24,73 +25,96 @@ class MyLayoutSuccessUseCase extends AbstractUseCase {
     dispatch({
       type: DATA_BROKER_EXECUTE,
       payload: {
-        actionName: "fetchMyForm",
+        actionName: "getMyForm",
         props: context
       },
       metaData: {
-        actionName: "fetchMyForm",
+        actionName: "getMyForm",
         //hack
-        [DATA_BROKER_NO_CONTENT]: {
+        [DATA_SOURCE_NO_CONTENT]: {
           type: ZFORM_MY_FORM_SUCCESS,
           metaData: {
-            actionName: "fetchMyForm"
+            actionName: "getMyForm"
           }
         },
         //hack
-        [DATA_BROKER_SUCCESS]: {
+        [DATA_SOURCE_FAILURE]: {
+          type: ZFORM_API_FAILURE,
+          metaData: {
+            actionName: 'getMyForm'
+          }
+        },
+        [DATA_SOURCE_SUCCESS]: {
           type: ZFORM_MY_FORM_SUCCESS,
           metaData: {
-            actionName: "fetchMyForm"
+            actionName: "getMyForm"
           }
         }
       }
     });
-    dispatch({
-      type: DATA_BROKER_EXECUTE,
-      payload: {
-        actionName: "fetchDependencyMappings",
-        props: context
-      },
-      metaData: {
-        actionName: "fetchDependencyMappings",
-        //hack
-        [DATA_BROKER_SUCCESS]: {
-          type: ZFORM_DEPENDENCY_MAPPINGS_SUCCESS,
-          metaData: {
-            actionName: "fetchDependencyMappings"
-          }
+
+    if (!disableDependencyMapping) {
+      dispatch({
+        type: DATA_BROKER_EXECUTE,
+        payload: {
+          actionName: "getDependencyMappings",
+          props: context
         },
-        [DATA_BROKER_NO_CONTENT]: {
-          type: ZFORM_DEPENDENCY_MAPPINGS_SUCCESS,
-          metaData: {
-            actionName: "fetchDependencyMappings"
+        metaData: {
+          actionName: "getDependencyMappings",
+          //hack
+          [DATA_SOURCE_SUCCESS]: {
+            type: ZFORM_DEPENDENCY_MAPPINGS_SUCCESS,
+            metaData: {
+              actionName: "getDependencyMappings"
+            }
+          },
+          [DATA_SOURCE_FAILURE]: {
+            type: ZFORM_API_FAILURE,
+            metaData: {
+              actionName: 'getDependencyMappings'
+            }
+          },
+          [DATA_SOURCE_NO_CONTENT]: {
+            type: ZFORM_DEPENDENCY_MAPPINGS_SUCCESS,
+            metaData: {
+              actionName: "getDependencyMappings"
+            }
           }
         }
-      }
-    });
+      });
+    } else {
+      zformEntity.setDependencyFetching(false);
+    }
 
     if (!disableLayoutRule) {
       dispatch({
         type: DATA_BROKER_EXECUTE,
         payload: {
-          actionName: "fetchLayoutRules",
+          actionName: "getLayoutRules",
           props: { ...context,
             activeRulesOnly: true
           }
         },
         metaData: {
-          actionName: "fetchLayoutRules",
+          actionName: "getLayoutRules",
           //hack
-          [DATA_BROKER_NO_CONTENT]: {
+          [DATA_SOURCE_NO_CONTENT]: {
             type: ZFORM_LAYOUT_RULES_SUCCESS,
             metaData: {
-              actionName: "fetchLayoutRules"
+              actionName: "getLayoutRules"
+            }
+          },
+          [DATA_SOURCE_FAILURE]: {
+            type: ZFORM_API_FAILURE,
+            metaData: {
+              actionName: 'getLayoutRules'
             }
           },
-          [DATA_BROKER_SUCCESS]: {
+          [DATA_SOURCE_SUCCESS]: {
             type: ZFORM_LAYOUT_RULES_SUCCESS,
             metaData: {
-              actionName: "fetchLayoutRules"
+              actionName: "getLayoutRules"
             }
           }
         }

package/es/platform/zform/applications/usecases/SubmitValidationCompletedUseCase.js

@@ -5,7 +5,8 @@ import { ZFORM_ERROR, ZFORM_VALIDATION_SUCCESS, ZFORM_SUBMIT_VALIDATION_FAILURE
 class SubmitValidationCompletedUseCase extends AbstractUseCase {
   execute(params) {
     const {
-      dispatch
+      dispatch,
+      disableCreateRecord
     } = params;
     const {
       repository,
@@ -49,13 +50,16 @@ class SubmitValidationCompletedUseCase extends AbstractUseCase {
           record
         }
       });
-      dispatch({
-        type: CREATE_RECORD,
-        payload: {
-          record,
-          moduleName
-        }
-      });
+
+      if (!disableCreateRecord) {
+        dispatch({
+          type: CREATE_RECORD,
+          payload: {
+            record,
+            moduleName
+          }
+        });
+      }
     }
   }
 

package/es/platform/zform/domain/ZForm.js

@@ -1,3 +1,6 @@
+import { ErrorCodes } from "../../../cc/component/ErrorStructure";
+import { ZFormApiActionName } from "../../../bc/zform/Constants";
+import { ZHttpErrorCode } from "../../../bc/zhttp/Errors";
 export default class ZForm {
   /*hack*/
 
@@ -130,6 +133,68 @@ export default class ZForm {
     this.isSubmitFetching = isSubmitFetching;
   }
 
+  stopLoadingAndDecideIsBreaking(actionName) {
+    let isBreaking = false; // Set error state based on the failed action
+
+    switch (actionName) {
+      case ZFormApiActionName.getMyForm:
+        this.setMyFormFetching(false);
+        isBreaking = true;
+        break;
+
+      case ZFormApiActionName.getMyLayouts:
+        // this.setMyLayoutsFetching(false);
+        // isBreaking = true;
+        break;
+
+      case ZFormApiActionName.getValidationRules:
+        // isBreaking = true;
+        this.setValidationRulesFetching(false);
+        break;
+
+      case ZFormApiActionName.getLayoutRules:
+        // isBreaking = true;
+        this.setLayoutRulesFetching(false);
+        break;
+
+      case ZFormApiActionName.getDependencyMappings:
+        // isBreaking = true;
+        this.setDependencyFetching(false);
+        break;
+
+      default:
+        break;
+    }
+
+    return isBreaking;
+  }
+
+  constructApiErrorEvent(error, actionName, isBreaking) {
+    console.log('Error in action: ', actionName, error);
+
+    if (error.code === ZHttpErrorCode.ApiError) {
+      return {
+        code: ErrorCodes.API_FAILED,
+        message: 'Api call failed for action: ' + actionName,
+        errorDetails: {
+          isBreaking,
+          originalError: error,
+          actionName
+        }
+      };
+    }
+
+    return {
+      code: ErrorCodes.UNKNOWN_ERROR,
+      message: 'Api call failed for action: ' + actionName,
+      errorDetails: {
+        isBreaking,
+        originalError: error,
+        actionName
+      }
+    };
+  }
+
   getSectionId(_ref2) {
     let {
       fieldName,

package/es/platform/zform/frameworks/ui/EventHandlerFactory.js

@@ -7,7 +7,7 @@ import FormPresenter from "../../adapters/presenter/FormPresenter";
 import Service from "../../adapters/gateway/Service";
 import LifeCycleEvents from "../../../../cc/component/LifeCycleEventsEnum";
 import InitializeController from "../../adapters/controllers/IntializeController";
-import { ZFORM_DEPENDENCY_MAPPINGS_REQUEST, ZFORM_DEPENDENCY_MAPPINGS_SUCCESS, ZFORM_FIELD_VALUE_CHANGE_REQUEST, ZFORM_MY_FORM_REQUEST, ZFORM_MY_FORM_SUCCESS, ZFORM_MY_LAYOUTS_SUCCESS, ZFORM_SET_FIELD_ERROR_MESSAGE, ZFORM_SUBMIT_VALIDATION_COMPLETED, ZFORM_VALIDATE_FIELD_REQUEST, ZFORM_VALIDATION_RULES_REQUEST, ZFORM_VALIDATION_RULES_SUCCESS, ZFORM_VALIDATION_RULES_EXECUTION_RESULT, ZFORM_LOOKUP_FIELD_SUCCESS } from "../../../../bc/zform/Symbol";
+import { ZFORM_DEPENDENCY_MAPPINGS_REQUEST, ZFORM_DEPENDENCY_MAPPINGS_SUCCESS, ZFORM_FIELD_VALUE_CHANGE_REQUEST, ZFORM_MY_FORM_REQUEST, ZFORM_MY_FORM_SUCCESS, ZFORM_MY_LAYOUTS_SUCCESS, ZFORM_SET_FIELD_ERROR_MESSAGE, ZFORM_SUBMIT_VALIDATION_COMPLETED, ZFORM_API_FAILURE, ZFORM_VALIDATE_FIELD_REQUEST, ZFORM_VALIDATION_RULES_REQUEST, ZFORM_VALIDATION_RULES_SUCCESS, ZFORM_VALIDATION_RULES_EXECUTION_RESULT, ZFORM_LOOKUP_FIELD_SUCCESS } from "../../../../bc/zform/Symbol";
 import LookupFieldController from "../../adapters/controllers/LookupFieldController";
 import MyLayoutSuccessController from "../../adapters/controllers/MyLayoutSuccessController";
 import MyFormSuccessController from "../../adapters/controllers/MyFromSuccessController";
@@ -30,6 +30,7 @@ import SmartFormConstants from "../../../../cc/form-connected/ExternalConstants"
 import FieldBlurController from "../../adapters/controllers/FieldBlurController";
 import SubmitValidationCompletedController from "../../adapters/controllers/SubmitValidationCompletedController";
 import ValidationRulesExecutionResultController from "../../adapters/controllers/ValidationRulesExecutionResultController";
+import ApiFailureController from "../../adapters/controllers/ApiFailureController";
 
 class EventHandlersFactory {
   static create() {
@@ -63,6 +64,7 @@ class EventHandlersFactory {
     const fieldBlurController = new FieldBlurController(service);
     const submitValidationCompletedController = new SubmitValidationCompletedController(service);
     const validationRulesExecutionResultController = new ValidationRulesExecutionResultController(service);
+    const apiFailureController = new ApiFailureController(service);
     return {
       [LifeCycleEvents.MOUNT]: initializeController.handle,
       [ZFORM_MY_LAYOUTS_SUCCESS]: myLayoutSuccessController.handle,
@@ -76,6 +78,7 @@ class EventHandlersFactory {
       [ZFORM_LAYOUT_RULES_SUCCESS]: layoutRulesSuccessController.handle,
       [ZFORM_VALIDATION_RULES_REQUEST]: validationRulesRequestController.handle,
       [ZFORM_VALIDATION_RULES_SUCCESS]: validationRulesSuccessController.handle,
+      [ZFORM_API_FAILURE]: apiFailureController.handle,
       [ZFORM_FIELD_VALUE_CHANGE_REQUEST]: fieldValueChangeController.handle,
       [ZFORM_SET_FIELD_ERROR_MESSAGE]: setFieldErrorMessageController.handle,
       [ZFORM_VALIDATE_FIELD_REQUEST]: validateFieldRequestController.handle,
@@ -86,8 +89,14 @@ class EventHandlersFactory {
           action,
           dispatch
         } = _ref;
+        const {
+          metaData,
+          payload
+        } = action;
         dispatch({
-          type: ZFORM_SUBMIT
+          type: ZFORM_SUBMIT,
+          metaData,
+          payload
         });
       },
       [FormConstants.FORM_FIELD_BLURRED]: fieldBlurController.handle,

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/gateways/Repository.js

@@ -12,9 +12,11 @@ class Repository {
       departmentId,
       viewId,
       moduleName,
-      query,
-      context
+      query
     } = this.state.properties;
+    const {
+      context
+    } = this.state.behaviours.appContext;
     const {
       sortBy,
       errorState,

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

@@ -12,9 +12,12 @@ export default function SelectionTranslator(state) {
   const {
     columnChooserConfig,
     selectionConfig,
-    context,
-    moduleName
+    moduleName,
+    instanceName
   } = properties;
+  const {
+    context
+  } = state.behaviours.appContext;
   const {
     zfield,
     selection,
@@ -27,7 +30,7 @@ export default function SelectionTranslator(state) {
   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 contextAppliedActions = ClientActionsTranslator.transform(clientActions, instanceName, moduleName, context);
   return {
     selected,
     hasAllSelected,

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

@@ -24,9 +24,12 @@ export default class TableTranslator {
     } = state;
     const {
       componentMapping,
-      context,
-      reOrderConfig
+      reOrderConfig,
+      instanceName
     } = properties;
+    const {
+      context
+    } = behaviours.appContext;
     const {
       localStorage: localStorageBehaviour,
       columnResizer,
@@ -43,7 +46,8 @@ export default class TableTranslator {
       zlist,
       zrecord,
       zfield,
-      zclientAction
+      zclientAction,
+      zclientScriptsEventMapping
     } = fallbackToDefault(behaviours, {}); // FIX: behaviours should be available by default
 
     const {
@@ -66,6 +70,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 {
@@ -99,12 +107,13 @@ 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 headersTranslator = new HeadersTranslator(fields, headerActions, context, modifiedWidths, sortBy, records, instanceName, moduleName);
+    const rowsTranslator = new RowsTranslator(recordsForDisplay, fields, rowActions, context, preferences, fieldComponentMapping, rowActionsUiType, fieldActions, instanceName, moduleName); // 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,