iFix Filter

Overview

This is a new filter created only for iFix. It includes Date Filter, Department Filter, Hierarchy Filter, and Denomination. Hierarchy filters are linked to the department filter.

This will get enabled when the chart config name includes “DSS_IFIX_DASHBOARD".

Filters

  1. Date filter: Using prebuild DateRange component from DSS module.

  2. Department Filter: This is a Dropdown component from digit-ui-react-components. It includes departments list of values from /adapter-master-data/department/v1/_search API which is deployed in mgramseva. It returns the list of departments based on tenantId. By default, it selects the first department from API response.
    Details of adapter-master-data-service can be found in the following link -

  3. Hierarchy Filters: Hierarchy filters are dependent on the selected department on Department Filter. There are multiple multi-select dropdowns that are based on the number of hierarchy levels and the values of each hierarchy level. This is generated using two API's of ifix-department-entity-service which is deployed in mgramseva.

    • /ifix-department-entity/departmentEntity/hierarchyLevel/v1/_search - This returns hierarchy levels list based on selected department.

    • /ifix-department-entity/departmentEntity/v1/_search - This returns hierarchy lists of all levels based on selected department.

    Details of ifix-department-entity-service can be found in the following link -

  4. Denomination: It displays the formatted numbers in Unit, Lac, Cr. It uses Switch component from DSS module.

Applied filter values are stored in session storage, key is Digit.DSS_FILTERS and values are displayed below

{ ... "filters": { "Zone": [ "Z02" ], "Circle": [ "C05" ], "Sub Division": [ "DIV23SD02" ], "Department": "DWSS" }, "requestDate": { "startDate": 1648751400000, "endDate": 1664735399999, "interval": "month", "title": "Apr 1, 2022 - Oct 2, 2022" } }

 

Dashboard Component -

Path: frontend/micro-ui/web/micro-ui-internals/packages/modules/dss/src/pages/index.js

  • This is the master component that includes hooks, call API’s and loads IfixFilter.

  • IfixFilter displays only if isEnableIFixFilter is true, and it depends on dashboard config, if it is loaded and in Digit.Utils.dss.isIFixDashboard returns true.

     

  • Load department when isEnableIFixFilter will true, and if in filters session Department is already available then it will select same else first department will be selected department.

     

  • After execution of useGetDepartments, it calls useGetHierarchyMetaData for hierarchy levels and useGetHierarchy to get the list of hierarchies based on the selected department.

     

  • These values are passed in the IfixFilters component.

     

  • Only for iFix after loading the department, it starts rendering the layouts because all charts are dependent on the hierarchy filter, which must be selected.

     

  • Applied filter Chips - Displays all selected hierarchies based on levels.

    These chips are linked with IfixFilter's hierarchy dropdowns, when these chips are removed it’s reflects the selected list.

IfixFilter Component -

Path - frontend/micro-ui/web/micro-ui-internals/packages/modules/dss/src/components/IfixFilters.js

This filter is a replica of the existing DSS Filter component with some changes which manage departments and hierarchies, passed from Dashboard component.

  • If there is only one department then the department selector will not display.

  • If there is no department then the hierarchy filter will not display.

  • There are hooks to load the selected hierarchy filter. Either it’s changed from the Dashboard component (remove filter) or user hits reload.

     

  • After changes on any filter, it updates the filter context which is linked to hooks in multiple charts.

URLs -

included API paths in URL's list

dss: { ..... search_ifix_dept_master_data: "/adapter-master-data/department/v1/_search", search_ifix_hierarchy_level: "/ifix-department-entity/departmentEntity/hierarchyLevel/v1/_search", search_ifix_dept_entity: "/ifix-department-entity/departmentEntity/v1/_search", }

Services

Added three services in frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/services/elements/DSS.js

Hooks

Created three hooks to load departments and hierarchies, file paths are

  1. frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/hooks/dss/useGetDepartments.jsto load department.

  2. frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/hooks/dss/useGetHierarchyMetaData.js - loads department-specific hierarchy levels.

  3. frontend/micro-ui/web/micro-ui-internals/packages/libraries/src/hooks/dss/useGetHierarchy.js - loads department-specific hierarchy lists.