@zohodesk/library-platform 1.2.0 → 1.2.2

package/es/index.js

@@ -5,7 +5,9 @@ import ExternalConstants from "./cc/table-connected/constants/ExternalConstants"
 import ActionEventMediator from "./platform/client-actions/components/action-event-mediator/frameworks/ui/ActionEventMediator";
 import RowActionsRenderer from "./platform/client-actions/components/row-actions-renderer/frameworks/ui/RowActions/RowActionsRenderer";
 import AdaptiveRowActionsRenderer from "./platform/client-actions/components/row-actions-renderer/frameworks/ui/AdaptiveRowActions/AdaptiveRowActionsRenderer";
-import ClientActionReordererRegistry from "./platform/client-actions/components/action-event-mediator/frameworks/ui/ClientActionReordererRegistry"; // Rebuild SmartTableConstants without Events
+import ClientActionReordererRegistry from "./platform/client-actions/components/action-event-mediator/frameworks/ui/ClientActionReordererRegistry";
+import ClientActionsFetchSDK from "./platform/client-actions/behaviour/zclient-actions/adapters/resources/ClientActionsFetchSDK";
+import ClientScriptsFetchSDK from "./platform/client-scripts/behaviour/zclient-scripts-fetch/adapters/resources/ClientScriptsFetchSDK"; // Rebuild SmartTableConstants without Events
 
 const SmartTableConstants = {
   ExternalConstants
@@ -40,4 +42,6 @@ export const Behaviours = {
   FieldSectionEventMappingBehaviourFactory
 };
 export * from "./library/analytics";
-export { ClientActionReordererRegistry };
+export { ClientActionReordererRegistry };
+export { ClientActionsFetchSDK };
+export { ClientScriptsFetchSDK };

package/es/platform/client-actions/behaviour/zclient-actions/adapters/presenters/FilterUtils.js

@@ -0,0 +1,11 @@
+function validateClientActionLocation(actualLocation, expectedLocation) {
+  return actualLocation === expectedLocation || actualLocation.endsWith(`.${expectedLocation}`);
+}
+
+function validateClientAction(clientAction, location) {
+  return clientAction.location && validateClientActionLocation(clientAction.location, location);
+}
+
+export function filterClientActionsByLocation(clientActions, location) {
+  return clientActions.filter(clientAction => clientAction && validateClientAction(clientAction, location));
+}

package/es/platform/client-actions/behaviour/zclient-actions/adapters/resources/ClientActionsFetchSDK.js

@@ -0,0 +1,76 @@
+import FetchGateWay from "../../../../../zhttp/adapters/gateway/FetchGateWay";
+import APITemplate from "../../../../../zdata-source/domain/entities/APITemplate";
+import getClientActions from "../../../../../data-source/http-template/getPageClientActions";
+import TemplateHelpers from "../../../../../zdata-source/adapters/gateways/TemplateHelpers";
+
+//TODO: Remove this SDK when smart page is ready for production
+// Use this SDK only for fetching client actions at page level in desk_client_app until smart page is ready
+class ClientActionsFetchSDK {
+  getClientActionsAPIDetails(args) {
+    const apiTemplate = new APITemplate(getClientActions, new TemplateHelpers());
+    const apiArgs = { ...args,
+      servicePrefix: 'supportapi/zd',
+      // @ts-ignore - custom property
+      orgName: window.currentOrg.portalName
+    };
+    const apiDetailsModel = apiTemplate.getApiDetails(apiArgs);
+    return { ...apiDetailsModel,
+      options: {
+        headers: {
+          // @ts-ignore - custom property
+          orgId: window.currentOrg.id
+        },
+        method: apiDetailsModel.method
+      }
+    };
+  }
+
+  mapClientActionsByInstanceLocation(clientActions) {
+    const filteredClientActionsMap = new Map();
+
+    for (const clientAction of clientActions) {
+      const {
+        location,
+        component
+      } = clientAction;
+      const locationPathArr = location.split('.');
+      const instanceName = locationPathArr[1] || component;
+      const locationName = locationPathArr[2] || location;
+
+      if (!instanceName || !locationName) {
+        continue;
+      }
+
+      if (!filteredClientActionsMap.has(instanceName)) {
+        filteredClientActionsMap.set(instanceName, {});
+      }
+
+      const instanceActions = filteredClientActionsMap.get(instanceName);
+
+      if (!instanceActions[locationName]) {
+        instanceActions[locationName] = [];
+      }
+
+      instanceActions[locationName].push(clientAction);
+    }
+
+    return filteredClientActionsMap;
+  }
+
+  async fetchClientActions(params) {
+    const apiDetails = this.getClientActionsAPIDetails(params);
+    const fetchGateway = new FetchGateWay(window.fetch.bind(window));
+    return new Promise((resolve, reject) => {
+      fetchGateway.fetch(apiDetails.url, apiDetails.options).then(response => response.json()).then(clientActions => {
+        this.clientActions = clientActions;
+        const filteredClientActionsMap = this.mapClientActionsByInstanceLocation(this.clientActions);
+        return resolve(filteredClientActionsMap);
+      }).catch(err => {
+        reject(err);
+      });
+    });
+  }
+
+}
+
+export default ClientActionsFetchSDK;

package/es/platform/client-actions/behaviour/zclient-actions/adapters/resources/__test__/ClientActionsFetchSDK.test.js

@@ -0,0 +1,183 @@
+import ClientActionsFetchSDK from "../ClientActionsFetchSDK";
+const getApiDetailsMock = jest.fn();
+jest.mock("../../../../../../zdata-source/domain/entities/APITemplate", () => ({
+  __esModule: true,
+  default: jest.fn().mockImplementation(() => ({
+    getApiDetails: getApiDetailsMock
+  }))
+}));
+
+const createAction = function () {
+  let overrides = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  return {
+    id: 'action-1',
+    name: 'test-action',
+    location: 'module.instance.header_actions',
+    component: 'smartTable',
+    ...overrides
+  };
+};
+
+describe('ClientActionsFetchSDK', () => {
+  let sdk;
+  const originalWindow = global.window;
+  beforeEach(() => {
+    getApiDetailsMock.mockReturnValue({
+      url: '/supportapi/zd/acme/api/v1/clientActions?from=0&limit=50',
+      method: 'GET',
+      options: {
+        method: 'GET'
+      }
+    });
+    global.window = {
+      currentOrg: {
+        portalName: 'acme',
+        id: '1001'
+      },
+      fetch: jest.fn()
+    };
+    sdk = new ClientActionsFetchSDK();
+  });
+  afterEach(() => {
+    jest.clearAllMocks();
+    global.window = originalWindow;
+  });
+  describe('getClientActionsAPIDetails', () => {
+    test('builds API details with org context and headers', () => {
+      const details = sdk.getClientActionsAPIDetails({
+        from: 0,
+        limit: 50
+      });
+      expect(getApiDetailsMock).toHaveBeenCalledWith(expect.objectContaining({
+        from: 0,
+        limit: 50,
+        servicePrefix: 'supportapi/zd',
+        orgName: 'acme'
+      }));
+      expect(details.url).toContain('/supportapi/zd/acme/api/v1/clientActions');
+      expect(details.method).toBe('GET');
+      expect(details.options.method).toBe('GET');
+      expect(details.options.headers.orgId).toBe('1001');
+    });
+    test('handles boundary pagination values without failing', () => {
+      const details = sdk.getClientActionsAPIDetails({
+        from: 0,
+        limit: 0
+      });
+      expect(details.url).toContain('/supportapi/zd/acme/api/v1/clientActions');
+      expect(details.options.method).toBe(details.method);
+    });
+    test('throws when currentOrg is missing', () => {
+      delete global.window.currentOrg;
+      expect(() => sdk.getClientActionsAPIDetails({
+        from: 0,
+        limit: 50
+      })).toThrow();
+    });
+  });
+  describe('mapClientActionsByInstanceLocation', () => {
+    test('returns empty map for empty list', () => {
+      const result = sdk.mapClientActionsByInstanceLocation([]);
+      expect(result.size).toBe(0);
+    });
+    test('groups actions by instance and location for dotted location path', () => {
+      const action = createAction({
+        location: 'module.table.header_actions',
+        component: 'smartTable'
+      });
+      const result = sdk.mapClientActionsByInstanceLocation([action]);
+      expect(result.has('table')).toBe(true);
+      expect(result.get('table')?.header_actions).toEqual([action]);
+    });
+    test('falls back to component and full location when location has no dot path', () => {
+      const action = createAction({
+        location: 'row_actions',
+        component: 'smartTable'
+      });
+      const result = sdk.mapClientActionsByInstanceLocation([action]);
+      expect(result.has('smartTable')).toBe(true);
+      expect(result.get('smartTable')?.row_actions).toEqual([action]);
+    });
+    test('keeps duplicates under same instance/location', () => {
+      const first = createAction({
+        id: '1',
+        location: 'module.table.row_actions'
+      });
+      const second = createAction({
+        id: '2',
+        location: 'module.table.row_actions'
+      });
+      const result = sdk.mapClientActionsByInstanceLocation([first, second]);
+      expect(result.get('table')?.row_actions).toHaveLength(2);
+      expect(result.get('table')?.row_actions).toEqual([first, second]);
+    });
+    test('uses second and third segments for multi-segment location', () => {
+      const action = createAction({
+        location: 'a.b.c.d',
+        component: 'fallbackComponent'
+      });
+      const result = sdk.mapClientActionsByInstanceLocation([action]);
+      expect(result.has('b')).toBe(true);
+      expect(result.get('b')?.c).toEqual([action]);
+    });
+    test('throws for malformed action location', () => {
+      const malformed = createAction({
+        location: undefined
+      });
+      expect(() => sdk.mapClientActionsByInstanceLocation([malformed])).toThrow();
+    });
+  });
+  describe('fetchClientActions', () => {
+    const validParams = {
+      from: 0,
+      limit: 50,
+      components: 'smartTable',
+      modules: 'tickets',
+      page: 'list'
+    };
+    test('resolves grouped map on successful fetch', async () => {
+      const payload = [createAction({
+        location: 'module.table.header_actions',
+        component: 'smartTable'
+      }), createAction({
+        id: '2',
+        location: 'row_actions',
+        component: 'smartTable'
+      })];
+      global.window.fetch.mockResolvedValue({
+        json: jest.fn().mockResolvedValue(payload)
+      });
+      const result = await sdk.fetchClientActions(validParams);
+      expect(global.window.fetch).toHaveBeenCalledTimes(1);
+      const [url, options] = global.window.fetch.mock.calls[0];
+      expect(url).toContain('/supportapi/zd/acme/api/v1/clientActions');
+      expect(options.headers.orgId).toBe('1001');
+      expect(result.get('table')?.header_actions).toHaveLength(1);
+      expect(result.get('smartTable')?.row_actions).toHaveLength(1);
+    });
+    test('resolves empty map when response payload is empty list', async () => {
+      global.window.fetch.mockResolvedValue({
+        json: jest.fn().mockResolvedValue([])
+      });
+      const result = await sdk.fetchClientActions(validParams);
+      expect(result.size).toBe(0);
+    });
+    test('rejects when fetch fails', async () => {
+      const networkError = new Error('Network down');
+      global.window.fetch.mockRejectedValue(networkError);
+      await expect(sdk.fetchClientActions(validParams)).rejects.toThrow('Network down');
+    });
+    test('rejects when response json parsing fails', async () => {
+      global.window.fetch.mockResolvedValue({
+        json: jest.fn().mockRejectedValue(new Error('Invalid JSON'))
+      });
+      await expect(sdk.fetchClientActions(validParams)).rejects.toThrow('Invalid JSON');
+    });
+    test('rejects when json payload is non-iterable', async () => {
+      global.window.fetch.mockResolvedValue({
+        json: jest.fn().mockResolvedValue(null)
+      });
+      await expect(sdk.fetchClientActions(validParams)).rejects.toThrow();
+    });
+  });
+});

package/es/platform/client-actions/behaviour/zclient-actions/applications/interfaces/ClientActionsAPIGatewayParams.js

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

package/es/platform/client-actions/behaviour/zclient-actions/applications/interfaces/ClientActionsFetchSDKParams.js

@@ -0,0 +1,10 @@
+var ClientActionPage = /*#__PURE__*/function (ClientActionPage) {
+  ClientActionPage["LIST"] = "list";
+  ClientActionPage["DETAILS"] = "details";
+  ClientActionPage["CREATE_PAGE"] = "createPage";
+  ClientActionPage["EDIT_PAGE"] = "editPage";
+  ClientActionPage["ALL_PAGES"] = "allPages";
+  return ClientActionPage;
+}(ClientActionPage || {});
+
+export {};

package/es/platform/client-actions/cc/client-actions-renderer/Properties.js

@@ -0,0 +1,58 @@
+import { clientScriptsSchema } from "../../../client-scripts/cc/zclient-scripts-execution/clientScriptsSchema";
+import { actionsSchema } from "../action-event-mediator/Properties";
+import viewMetaSchema from "./ViewMetaSchema";
+export default {
+  location: {
+    required: false,
+    typeMetadata: {
+      schema: {
+        type: 'string'
+      }
+    },
+    defaultValue: ''
+  },
+  instanceName: {
+    required: false,
+    typeMetadata: {
+      schema: {
+        type: 'string'
+      }
+    },
+    defaultValue: ''
+  },
+  testId: {
+    required: false,
+    typeMetadata: {
+      schema: {
+        type: 'string'
+      }
+    },
+    defaultValue: ''
+  },
+  actions: {
+    required: true,
+    typeMetadata: {
+      schema: actionsSchema
+    }
+  },
+  clientScripts: {
+    required: false,
+    typeMetadata: {
+      schema: clientScriptsSchema
+    }
+  },
+  context: {
+    required: false,
+    typeMetadata: {
+      schema: {
+        type: 'object'
+      }
+    }
+  },
+  viewMeta: {
+    required: false,
+    typeMetadata: {
+      schema: viewMetaSchema
+    }
+  }
+};

package/es/platform/client-actions/cc/client-actions-renderer/ViewMetaSchema.js

@@ -0,0 +1,17 @@
+import { Layout } from "../../components/client-actions-renderer/domain/entities/State";
+import { ActionViewGap } from "../../components/interfaces/ActionViewModel";
+export default {
+  type: 'object',
+  properties: {
+    layout: {
+      type: 'string',
+      enum: [Layout.HORIZONTAL, Layout.VERTICAL, Layout.HORIZONTAL_WITH_MORE_ACTIONS, Layout.VERTICAL_WITH_MORE_ACTIONS],
+      default: Layout.HORIZONTAL
+    },
+    gap: {
+      type: 'string',
+      enum: [ActionViewGap.NONE, ActionViewGap.SMALL, ActionViewGap.MEDIUM, ActionViewGap.LARGE, ActionViewGap.XLARGE, ActionViewGap.XMEDIUM],
+      default: ActionViewGap.NONE
+    }
+  }
+};

package/es/platform/client-actions/components/client-actions-renderer/adapters/presenters/ClientActionsRendererTranslator.js

@@ -0,0 +1,24 @@
+import ClientActionsTranslator from "../../../../translators/client-actions-translator";
+export default class ClientActionsRendererTranslator {
+  // eslint-disable-next-line complexity -- Need this complexity to transform client actions to action view model which is used for rendering client actions in UI
+  static transformState(state) {
+    let actions = state.properties.actions;
+    const {
+      context,
+      location,
+      instanceName
+    } = state.properties;
+
+    if ((!actions || actions.length === 0) && location && instanceName) {
+      actions = []; //TODO: Need to update this logic to use platformBridge SDK to use fetched client actions at page level
+    }
+
+    const resolvedActions = ClientActionsTranslator.transform(actions, context.instanceName, context.moduleName, context);
+    return { ...state,
+      properties: { ...state.properties,
+        actions: resolvedActions
+      }
+    };
+  }
+
+}

package/es/platform/client-actions/components/client-actions-renderer/domain/entities/ClientActionsRendererDatatype.js

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

package/es/platform/client-actions/components/client-actions-renderer/domain/entities/ClientActionsRendererViewProps.js

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

package/es/platform/client-actions/components/client-actions-renderer/domain/entities/Context.js

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

package/es/platform/client-actions/components/client-actions-renderer/domain/entities/State.js

@@ -0,0 +1,8 @@
+export let Layout = /*#__PURE__*/function (Layout) {
+  Layout["HORIZONTAL"] = "horizontal";
+  Layout["VERTICAL"] = "vertical";
+  Layout["HORIZONTAL_WITH_MORE_ACTIONS"] = "horizontal-with-more-actions";
+  Layout["VERTICAL_WITH_MORE_ACTIONS"] = "vertical-with-more-actions";
+  return Layout;
+}({});
+;

package/es/platform/client-actions/components/client-actions-renderer/frameworks/ui/client-actions-renderer/ClientActionsRenderer.js

@@ -0,0 +1,11 @@
+import { createCustomComponent } from "../../../../../../../library/custom-component";
+import ClientActionsRendererProperties from "../../../../../cc/client-actions-renderer/Properties";
+import ClientActionsRendererTranslator from "../../../adapters/presenters/ClientActionsRendererTranslator";
+import ClientActionsRendererView from "./ClientActionsRendererView";
+export default createCustomComponent({
+  name: 'ClientActionsRenderer',
+  properties: ClientActionsRendererProperties,
+  transformState: ClientActionsRendererTranslator.transformState,
+  eventHandlers: {},
+  View: ClientActionsRendererView
+});

package/es/platform/client-actions/components/client-actions-renderer/frameworks/ui/client-actions-renderer/ClientActionsRenderer.module.css

@@ -0,0 +1,23 @@
+.wrapper {
+    max-width: 100% 
+}
+
+.gap_small {
+    gap: var(--zd_size4) 
+}
+
+.gap_xmedium {
+    gap: var(--zd_size6) 
+}
+
+.gap_medium {
+    gap: var(--zd_size8) 
+}
+
+.gap_large {
+    gap: var(--zd_size10) 
+}
+
+.gap_xlarge {
+    gap: var(--zd_size12) 
+}

package/es/platform/client-actions/components/client-actions-renderer/frameworks/ui/client-actions-renderer/ClientActionsRendererView.js

@@ -0,0 +1,25 @@
+import React from 'react';
+import DefaultActionsRendererView from "./views/DefaultActionsRendererView";
+import ComponentRegistry from "../../../../../../../library/custom-component/frameworks/ui/ComponentRegistry";
+export default function ClientActionsRendererView(_ref, ref) {
+  let {
+    state
+  } = _ref;
+  const {
+    actions,
+    clientScripts,
+    viewMeta,
+    testId,
+    slotName,
+    instanceName
+  } = state.properties;
+  const customView = slotName !== '' && instanceName !== '' ? ComponentRegistry.get(`${instanceName}_${slotName}_renderer`) : null;
+  const View = customView ? customView : DefaultActionsRendererView;
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(View, {
+    clientActions: actions,
+    clientScripts: clientScripts,
+    viewMeta: viewMeta,
+    getRef: ref,
+    testId: testId
+  }));
+}

package/es/platform/client-actions/components/client-actions-renderer/frameworks/ui/client-actions-renderer/views/DefaultActionsRendererView.js

@@ -0,0 +1,66 @@
+import ActionEventMediator from "../../../../../action-event-mediator/frameworks/ui/ActionEventMediator";
+import { findMappedClientScripts } from "../../../../../../../client-scripts/behaviour/zclient-scripts-execution/frameworks/ClientScriptsUtils";
+import { ActionViewGap } from "../../../../../interfaces/ActionViewModel"; //@ts-ignore
+
+import style from "../ClientActionsRenderer.module.css";
+import MoreActionsRenderer from "../../more-actions-renderer/MoreActionsRenderer";
+import Flex from '@zohodesk/layout/es/Flex/Flex';
+import React from 'react';
+import { Layout } from "../../../../domain/entities/State";
+const HORIZONTAL_LAYOUTS = [Layout.HORIZONTAL, Layout.HORIZONTAL_WITH_MORE_ACTIONS];
+const MORE_ACTIONS_LAYOUTS = [Layout.VERTICAL_WITH_MORE_ACTIONS, Layout.HORIZONTAL_WITH_MORE_ACTIONS];
+
+function renderAction(action, clientScripts) {
+  return /*#__PURE__*/React.createElement(ActionEventMediator, {
+    key: action.id //@ts-ignore - action property defined using ACA pattern
+    ,
+    action: action,
+    clientScripts: findMappedClientScripts(action, clientScripts),
+    instanceName: action.instanceName
+  });
+}
+
+function getFlexDirection(layout) {
+  return HORIZONTAL_LAYOUTS.includes(layout) ? 'row' : 'column';
+}
+
+function getGapClassName(gap) {
+  return gap !== ActionViewGap.NONE ? style[`gap_${gap}`] : '';
+}
+
+function shouldShowMoreActions(actionsCount, layout) {
+  return actionsCount > 3 && MORE_ACTIONS_LAYOUTS.includes(layout);
+}
+
+function getVisibleActions(showMore, firstAction, secondAction, allActions) {
+  return showMore ? [firstAction, secondAction] : allActions;
+}
+
+export default function DefaultActionsRendererView(_ref) {
+  let {
+    clientActions,
+    clientScripts,
+    viewMeta,
+    getRef,
+    testId = ''
+  } = _ref;
+  const [firstAction, secondAction, ...moreActions] = clientActions;
+  const layout = viewMeta?.layout ?? Layout.HORIZONTAL;
+  const gap = viewMeta?.gap ?? ActionViewGap.NONE;
+  const showMore = shouldShowMoreActions(clientActions.length, layout);
+  const actionsList = getVisibleActions(showMore, firstAction, secondAction, clientActions);
+  return /*#__PURE__*/React.createElement(Flex, {
+    ref: getRef,
+    testId: testId,
+    $ui_direction: getFlexDirection(layout),
+    $ui_className: getGapClassName(gap),
+    $ui_displayMode: "inline",
+    $ui_alignItems: "center"
+  }, actionsList.map(action => renderAction(action, clientScripts)), showMore &&
+  /*#__PURE__*/
+  //@ts-ignore - action property defined using ACA pattern
+  React.createElement(MoreActionsRenderer, {
+    actions: moreActions,
+    clientScripts: clientScripts
+  }));
+}

package/es/platform/client-actions/components/client-actions-renderer/frameworks/ui/more-actions-renderer/MoreActionsRenderer.js

@@ -0,0 +1,9 @@
+import { createCustomComponent } from "../../../../../../../library/custom-component";
+import RowActionsRendererProperties from "../../../../../cc/client-actions-renderer/Properties";
+import MoreActionsRendererView from "./MoreActionsRendererView";
+export default createCustomComponent({
+  name: "MoreActionsRenderer",
+  eventHandlers: {},
+  properties: RowActionsRendererProperties,
+  View: MoreActionsRendererView
+});

package/es/platform/client-actions/components/client-actions-renderer/frameworks/ui/more-actions-renderer/MoreActionsRendererView.js

@@ -0,0 +1,81 @@
+import React from 'react';
+import ActionEventMediator from "../../../../action-event-mediator/frameworks/ui/ActionEventMediator";
+import CustomDropdown from '@zohodesk-private/desk-components/es/CustomDropdown/CustomDropdown';
+import ListItemConstants from "../../../../../../../cc/list-item/Constants";
+import IconButton from '@zohodesk/dot/es/IconButton/IconButton';
+import { findMappedClientScripts } from "../../../../../../client-scripts/behaviour/zclient-scripts-execution/frameworks/ClientScriptsUtils";
+export function ListItemConvertor(action) {
+  // @ts-ignore - properties from ActionViewModel are being used to convert the action to ListItem compatible action, which is then used for rendering the ListItem in MoreActionsRenderer
+  const {
+    id,
+    properties: {
+      icon
+    },
+    eventMappings,
+    instanceName
+  } = action; // @ts-ignore - properties from ActionViewModel are being used to convert the action to ListItem compatible action, which is then used for rendering the ListItem in MoreActionsRenderer
+
+  const label = action.properties.label ? action.properties.label : action.properties.text;
+  const updatedEventMappings = eventMappings.map(eventMapping => {
+    return { ...eventMapping,
+      sourceEvent: ListItemConstants.LISTITEM_CLICKED
+    };
+  });
+  return {
+    component: 'ListItem',
+    properties: {
+      text: label,
+      tooltip: label,
+      icon,
+      id
+    },
+    eventMappings: updatedEventMappings,
+    id,
+    instanceName
+  };
+}
+
+function renderTargetElement(_ref) {
+  let {
+    handleTogglePopup,
+    isPopupOpen
+  } = _ref;
+  return /*#__PURE__*/React.createElement(IconButton, {
+    iconName: "ZD-GN-more",
+    iconSize: "16",
+    isActive: isPopupOpen,
+    onClick: handleTogglePopup
+  });
+}
+
+function renderAction(action, clientScripts, instanceName) {
+  const mappedClientScripts = findMappedClientScripts(action, clientScripts);
+  return /*#__PURE__*/React.createElement(ActionEventMediator //@ts-ignore - property defined in ACA component
+  , {
+    action: action,
+    clientScripts: mappedClientScripts,
+    instanceName: instanceName
+  });
+}
+
+function MoreActionsRendererView(_ref2, ref) {
+  let {
+    state
+  } = _ref2;
+  const {
+    actions,
+    clientScripts
+  } = state.properties;
+  const listItemActions = actions.map(action => ListItemConvertor(action));
+  return /*#__PURE__*/React.createElement(CustomDropdown, {
+    $ui_boxSize: "medium",
+    $flag_padding: true,
+    $render_targetElement: renderTargetElement,
+    $method_getRef: ref,
+    $customProps_dropbox: {
+      onClick: undefined
+    }
+  }, listItemActions.map(action => renderAction(action, clientScripts, action.instanceName)));
+}
+
+export default MoreActionsRendererView;

package/es/platform/client-scripts/behaviour/zclient-scripts-fetch/adapters/resources/ClientScriptsFetchSDK.js

@@ -0,0 +1,43 @@
+import APITemplate from "../../../../../zdata-source/domain/entities/APITemplate";
+import TemplateHelpers from "../../../../../zdata-source/adapters/gateways/TemplateHelpers";
+import FetchGateWay from "../../../../../zhttp/adapters/gateway/FetchGateWay";
+import getClientScripts from "../../../../../data-source/http-template/getClientScripts";
+
+//TODO: Remove this SDK when smart page is ready for production
+// Use this SDK only for fetching client actions at page level in desk_client_app until smart page is ready
+class ClientScriptsFetchSDK {
+  getClientScriptsAPIDetails(args) {
+    const apiTemplate = new APITemplate(getClientScripts, new TemplateHelpers());
+    const apiArgs = { ...args,
+      servicePrefix: 'supportapi/zd',
+      // @ts-ignore - custom property
+      orgName: window.currentOrg.portalName
+    };
+    const apiDetailsModel = apiTemplate.getApiDetails(apiArgs);
+    return { ...apiDetailsModel,
+      options: {
+        headers: {
+          // @ts-ignore - custom property
+          orgId: window.currentOrg.id
+        },
+        method: apiDetailsModel.method
+      }
+    };
+  }
+
+  async fetchClientScripts(params) {
+    const apiDetails = this.getClientScriptsAPIDetails(params);
+    const fetchGateway = new FetchGateWay(window.fetch.bind(window));
+    return new Promise((resolve, reject) => {
+      fetchGateway.fetch(apiDetails.url, apiDetails.options).then(response => response.json()).then(clientScripts => {
+        this.clientScripts = clientScripts;
+        return resolve(clientScripts);
+      }).catch(err => {
+        reject(err);
+      });
+    });
+  }
+
+}
+
+export default ClientScriptsFetchSDK;

package/es/platform/client-scripts/behaviour/zclient-scripts-fetch/adapters/resources/__test__/ClientScriptsFetchSDK.test.js

@@ -0,0 +1,163 @@
+import ClientScriptsFetchSDK from "../ClientScriptsFetchSDK";
+const getApiDetailsMock = jest.fn();
+jest.mock("../../../../../../zdata-source/domain/entities/APITemplate", () => ({
+  __esModule: true,
+  default: jest.fn().mockImplementation(() => ({
+    getApiDetails: getApiDetailsMock
+  }))
+}));
+
+const createScript = function () {
+  let overrides = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  return {
+    id: 'script-1',
+    name: 'sample-script',
+    ...overrides
+  };
+};
+
+describe('ClientScriptsFetchSDK', () => {
+  let sdk;
+  const originalWindow = global.window;
+  beforeEach(() => {
+    getApiDetailsMock.mockReturnValue({
+      url: '/supportapi/zd/acme/api/v1/clientScripts?from=0&limit=50',
+      method: 'GET',
+      options: {
+        method: 'GET'
+      }
+    });
+    global.window = {
+      currentOrg: {
+        portalName: 'acme',
+        id: '1001'
+      },
+      fetch: jest.fn()
+    };
+    sdk = new ClientScriptsFetchSDK();
+  });
+  afterEach(() => {
+    jest.clearAllMocks();
+    global.window = originalWindow;
+  });
+  describe('getClientScriptsAPIDetails', () => {
+    test('builds API details with org context and headers', () => {
+      const details = sdk.getClientScriptsAPIDetails({
+        from: 0,
+        limit: 50
+      });
+      expect(getApiDetailsMock).toHaveBeenCalledWith(expect.objectContaining({
+        from: 0,
+        limit: 50,
+        servicePrefix: 'supportapi/zd',
+        orgName: 'acme'
+      }));
+      expect(details.url).toContain('/supportapi/zd/acme/api/v1/clientScripts');
+      expect(details.method).toBe('GET');
+      expect(details.options.method).toBe('GET');
+      expect(details.options.headers.orgId).toBe('1001');
+    });
+    test('handles boundary pagination values without failing', () => {
+      const details = sdk.getClientScriptsAPIDetails({
+        from: 0,
+        limit: 0
+      });
+      expect(details.url).toContain('/supportapi/zd/acme/api/v1/clientScripts');
+      expect(details.options.method).toBe(details.method);
+    });
+    test('handles large pagination values without failing', () => {
+      const details = sdk.getClientScriptsAPIDetails({
+        from: 999999,
+        limit: 100000
+      });
+      expect(details.method).toBe('GET');
+      expect(details.options.headers.orgId).toBe('1001');
+    });
+    test('throws when currentOrg is missing', () => {
+      delete global.window.currentOrg;
+      expect(() => sdk.getClientScriptsAPIDetails({
+        from: 0,
+        limit: 50
+      })).toThrow();
+    });
+  });
+  describe('fetchClientScripts', () => {
+    const validParams = {
+      from: 0,
+      limit: 50,
+      components: 'smartTable',
+      modules: 'tickets'
+    };
+    test('resolves scripts array on successful fetch/json', async () => {
+      const payload = [createScript(), createScript({
+        id: 'script-2'
+      })];
+      global.window.fetch.mockResolvedValue({
+        json: jest.fn().mockResolvedValue(payload)
+      });
+      const result = await sdk.fetchClientScripts(validParams);
+      expect(global.window.fetch).toHaveBeenCalledTimes(1);
+      const [url, options] = global.window.fetch.mock.calls[0];
+      expect(url).toContain('/supportapi/zd/acme/api/v1/clientScripts');
+      expect(options.headers.orgId).toBe('1001');
+      expect(result).toEqual(payload);
+    });
+    test('passes through API details returned by getClientScriptsAPIDetails', async () => {
+      const detailsSpy = jest.spyOn(sdk, 'getClientScriptsAPIDetails').mockReturnValue({
+        url: '/custom-client-scripts-url',
+        method: 'POST',
+        options: {
+          method: 'POST',
+          headers: {
+            orgId: 'custom-org'
+          }
+        }
+      });
+      global.window.fetch.mockResolvedValue({
+        json: jest.fn().mockResolvedValue([])
+      });
+      await sdk.fetchClientScripts(validParams);
+      expect(detailsSpy).toHaveBeenCalledWith(validParams);
+      expect(global.window.fetch).toHaveBeenCalledWith('/custom-client-scripts-url', expect.objectContaining({
+        method: 'POST'
+      }));
+    });
+    test('resolves empty array for empty payload', async () => {
+      global.window.fetch.mockResolvedValue({
+        json: jest.fn().mockResolvedValue([])
+      });
+      const result = await sdk.fetchClientScripts(validParams);
+      expect(result).toEqual([]);
+    });
+    test('rejects when fetch fails', async () => {
+      const error = new Error('Network down');
+      global.window.fetch.mockRejectedValue(error);
+      await expect(sdk.fetchClientScripts(validParams)).rejects.toThrow('Network down');
+    });
+    test('rejects when response json parsing fails', async () => {
+      global.window.fetch.mockResolvedValue({
+        json: jest.fn().mockRejectedValue(new Error('Invalid JSON'))
+      });
+      await expect(sdk.fetchClientScripts(validParams)).rejects.toThrow('Invalid JSON');
+    });
+    test('resolves non-array payload as-is (current behavior)', async () => {
+      const payload = {
+        unsupported: true
+      };
+      global.window.fetch.mockResolvedValue({
+        json: jest.fn().mockResolvedValue(payload)
+      });
+      const result = await sdk.fetchClientScripts(validParams);
+      expect(result).toEqual(payload);
+    });
+    test('throws when window.fetch is missing', async () => {
+      delete global.window.fetch;
+      await expect(sdk.fetchClientScripts(validParams)).rejects.toThrow();
+    });
+    test('rejects when getClientScriptsAPIDetails throws', async () => {
+      delete global.window.currentOrg;
+      await expect(sdk.fetchClientScripts(validParams)).rejects.toThrow();
+      expect(global.window.fetch).not.toHaveBeenCalled();
+    });
+  });
+});

package/es/platform/client-scripts/behaviour/zclient-scripts-fetch/applications/interfaces/ClientScriptsAPIGatewayParams.js

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

package/es/platform/client-scripts/behaviour/zclient-scripts-fetch/applications/interfaces/ClientScriptsSDKFetchParams.js

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

package/es/platform/components/smart-action-band/adapters/presenters/ActionBandTranslator.js

@@ -2,6 +2,7 @@ import ClientActionsTranslator from "../../../../client-actions/translators/clie
 import DefaultClientActions from "./utils/DefaultClientActions";
 import { ActionBandLocations } from "../../../../../bc/action-band/Constants";
 import { i18NProviderUtils } from '@zohodesk/i18n';
+import { filterClientActionsByLocation } from "../../../../client-actions/behaviour/zclient-actions/adapters/presenters/FilterUtils";
 export default class ActionBandTranslator {
   static transformState(state) {
     const {
@@ -83,10 +84,12 @@ export default class ActionBandTranslator {
 
 }
 
-const mapper = clientAction => ({
-  actionBandLeftActions: clientAction.filter(action => action.location === ActionBandLocations.LEFT_ACTIONS),
-  actionBandRightActions: clientAction.filter(action => action.location === ActionBandLocations.RIGHT_ACTIONS)
-});
+function mapper(clientActions) {
+  return {
+    actionBandLeftActions: filterClientActionsByLocation(clientActions, ActionBandLocations.LEFT_ACTIONS),
+    actionBandRightActions: filterClientActionsByLocation(clientActions, ActionBandLocations.RIGHT_ACTIONS)
+  };
+}
 
 function getColumnChooserProps(columnChooser) {
   let availableFields = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];

package/es/platform/data-source/http-template/getPageClientActions.js

@@ -0,0 +1,23 @@
+let getClientActions = {
+  name: 'uiActions',
+  api: '/{{servicePrefix}}/{{orgName}}/api/v1/clientActions',
+  parameters: `{
+        "from":{{from}},
+        "limit":{{limit}},
+        "modules": "{{modules}}",
+        "page": "{{page}}"
+    }`,
+  type: 'GET',
+  transformer: data => data,
+  properties: {
+    modelName: {
+      required: true,
+      typeMetadata: {
+        schema: {
+          type: 'string'
+        }
+      }
+    }
+  }
+};
+export default getClientActions;

package/es/platform/zform/adapters/presenter/FormTranslator.js

@@ -1,6 +1,7 @@
 import ClientActionsTranslator from "../../../client-actions/translators/client-actions-translator";
 import SectionTranslator from "./translators/SectionTranslator";
 import DefaultFormClientActions from "./utils/DefaultClientActions";
+import { filterClientActionsByLocation } from "../../../client-actions/behaviour/zclient-actions/adapters/presenters/FilterUtils";
 export default class FormTranslator {
   static transformState(state) {
     const {
@@ -56,7 +57,7 @@ export default class FormTranslator {
     Object.entries(mappedClientActions).forEach(_ref => {
       let [key, value] = _ref;
 
-      if (isFooterEnabled && (key === 'footerRightActions' || key === 'footerLeftActions')) {
+      if (isFooterEnabled && (key === 'footerLeftActions' || key === 'footerRightActions')) {
         let footerActions = ClientActionsTranslator.transform(value, instanceName, moduleName, actionContext);
         transformedClientActions[key] = footerActions;
       }
@@ -152,17 +153,19 @@ export default class FormTranslator {
 
 }
 
-const mapper = clientAction => ({
-  headerLeftActions: clientAction.filter(action => action.location === 'header_left_actions'),
-  headerRightActions: clientAction.filter(action => action.location === 'header_right_actions'),
-  footerLeftActions: clientAction.filter(action => action.location === 'footer_left_actions'),
-  footerRightActions: clientAction.filter(action => action.location === 'footer_right_actions'),
-  fieldLabelActions: clientAction.filter(action => action.location === 'field_label_actions'),
-  fieldActions: clientAction.filter(action => action.location === 'field_actions'),
-  sectionHeaderLeftActions: clientAction.filter(action => action.location === 'section_header_left_actions'),
-  sectionHeaderRightActions: clientAction.filter(action => action.location === 'section_header_right_actions'),
-  sectionTitleLeftActions: clientAction.filter(action => action.location === 'section_title_left_actions'),
-  sectionTitleRightActions: clientAction.filter(action => action.location === 'section_title_right_actions'),
-  fieldOptionLeftActions: clientAction.filter(action => action.location === 'field_options_left_actions'),
-  fieldOptionRightActions: clientAction.filter(action => action.location === 'field_options_right_actions')
-});
+const mapper = clientActions => {
+  return {
+    headerLeftActions: filterClientActionsByLocation(clientActions, 'header_left_actions'),
+    headerRightActions: filterClientActionsByLocation(clientActions, 'header_right_actions'),
+    footerLeftActions: filterClientActionsByLocation(clientActions, 'footer_left_actions'),
+    footerRightActions: filterClientActionsByLocation(clientActions, 'footer_right_actions'),
+    fieldLabelActions: filterClientActionsByLocation(clientActions, 'field_label_actions'),
+    fieldActions: filterClientActionsByLocation(clientActions, 'field_actions'),
+    sectionHeaderLeftActions: filterClientActionsByLocation(clientActions, 'section_header_left_actions'),
+    sectionHeaderRightActions: filterClientActionsByLocation(clientActions, 'section_header_right_actions'),
+    sectionTitleLeftActions: filterClientActionsByLocation(clientActions, 'section_title_left_actions'),
+    sectionTitleRightActions: filterClientActionsByLocation(clientActions, 'section_title_right_actions'),
+    fieldOptionLeftActions: filterClientActionsByLocation(clientActions, 'field_options_left_actions'),
+    fieldOptionRightActions: filterClientActionsByLocation(clientActions, 'field_options_right_actions')
+  };
+};

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

@@ -109,7 +109,7 @@ function SectionTranslator(_ref) {
       fieldPreModified['actions'] = transformedDefaultActions.fieldActions.concat(transformedActions.fieldActions);
       const noPlaceHolderSupport = ['Boolean', 'Date', 'DateTime']; // Placeholder check
 
-      if (field.toolTip && field.toolTipType === "placeholder" && !noPlaceHolderSupport.includes(field.type)) {
+      if (field.toolTip && field.toolTipType === "placeHolder" && !noPlaceHolderSupport.includes(field.type)) {
         fieldPreModified["placeholder"] = field.toolTip;
       } // const optionActionAvailArray = ['Picklist', 'Multiselect'];
       // // Option Actions check

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

@@ -13,6 +13,7 @@ import DefaultClientActions from "./utils/DefaultClientActions";
 import SelectionTranslator from "./SelectionTranslator";
 import { SortModelOrder } from "../../domain/entities/interfaces/Properties";
 import { SortOrder } from "../../../../bc/zlist/Types";
+import { filterClientActionsByLocation } from "../../../client-actions/behaviour/zclient-actions/adapters/presenters/FilterUtils";
 const EMPTY_OBJECT = {};
 const EMPTY_ARRAY = [];
 
@@ -220,9 +221,9 @@ function mapClientActions(clientActions) {
     }
   });
   return {
-    headerActions: clientActions.filter(action => action.location && action.location === 'header_actions'),
-    fieldActions: clientActions.filter(action => action.location && action.location === 'field_actions'),
-    rowActions: clientActions.filter(action => action.location && action.location === 'row_actions'),
-    noLocation: clientActions.filter(action => !action.location)
+    headerActions: filterClientActionsByLocation(clientActions, 'header_actions'),
+    fieldActions: filterClientActionsByLocation(clientActions, 'field_actions'),
+    rowActions: filterClientActionsByLocation(clientActions, 'row_actions'),
+    noLocation: filterClientActionsByLocation(clientActions, null)
   };
 }

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

@@ -15,14 +15,18 @@ const DateFieldTranslator = _ref => {
     uiType,
     name
   } = field;
+  const defaultDateTimeFormat = {
+    dateFormat: 'dd MM yyyy',
+    timeFormat: '12-hour',
+    delimiter: 'space',
+    isShortenDateTimeInfo: false
+  };
   const {
     dateFormat,
     timeFormat,
     delimiter,
     isShortenDateTimeInfo
-  } = context.dateTimeFormat; // const appContext = platformSDK.app.getContext();
-  // const { dateFormat, timeFormat, delimiter } = appContext.dateTimeFormat;
-
+  } = context?.dateTimeFormat || defaultDateTimeFormat;
   const newDateValue = DateAndTimeFormat({
     dateFormatType: dateFormat,
     timeFormatType: timeFormat,

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

@@ -15,14 +15,18 @@ const DateTimeFieldTranslator = _ref => {
     uiType,
     name
   } = field;
+  const defaultDateTimeFormat = {
+    dateFormat: 'dd MM yyyy',
+    timeFormat: '12-hour',
+    delimiter: 'space',
+    isShortenDateTimeInfo: false
+  };
   const {
     dateFormat,
     timeFormat,
     delimiter,
     isShortenDateTimeInfo
-  } = context.dateTimeFormat; // const appContext = platformSDK.app.getContext();
-  // const { dateFormat, timeFormat, delimiter } = appContext.dateTimeFormat;
-
+  } = context?.dateTimeFormat || defaultDateTimeFormat;
   const newDateValue = DateAndTimeFormat({
     dateFormatType: dateFormat,
     timeFormatType: timeFormat,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zohodesk/library-platform",
-  "version": "1.2.0",
+  "version": "1.2.2",
   "description": "",
   "main": "es/index.js",
   "files": [
@@ -46,7 +46,7 @@
     "@zohodesk-private/dot-registry": "0.0.2",
     "@zohodesk-private/node-plugins": "1.1.9",
     "@zohodesk/a11y": "2.3.8",
-    "@zohodesk/codestandard-validator": "1.1.4",
+    "@zohodesk/codestandard-validator": "1.3.1",
     "@zohodesk/components": "1.5.8",
     "@zohodesk/dot": "1.8.6",
     "@zohodesk/dotkit": "1.0.7",
@@ -82,7 +82,7 @@
     "@zohodesk/dot": "1.8.6",
     "@zohodesk/dotkit": "1.0.7",
     "@zohodesk/hooks": "2.0.6",
-    "@zohodesk/i18n": "1.0.0-beta.31",
+    "@zohodesk/i18n": "1.0.0-beta.35",
     "@zohodesk/icons": "1.1.5",
     "@zohodesk/layout": "3.1.0",
     "@zohodesk/svg": "1.2.6",
@@ -95,4 +95,4 @@
     "jsep": "0.3.5",
     "object-path-immutable": "4.1.2"
   }
-}
+}