Skip to main content

Version: 22.10

Global Filters

The globalFilters property is used to show, hide and configure global filters on the List Screen. Currently, Workspaces supports three global filters: GroupName, FormName and DateCreated.

note

globalFilters is not mandatory, but if not set, all queries will have a dateCreated range of one year from the current date.

Options​

Date Created​

The DateCreated filter is used to show or hide the Date Created input that allows Workspaces to filter Txns by date created ranges.

Form Name​

The FormName filter is used to show or hide the Form Name select component that allows Workspaces users to filter Txns by formCode.

FormName.options is optional. Without it a full list of forms returned in the API will be displayed as options. In this case, FormName.value can be any formCode that exists in the API, and will be the default selected option.

Group Name​

The GroupName filter is used to show/hide the Group Name select that allows Workspaces users to filter Txns by group names.

GroupName.options is optional. Without it a full list of forms returned in the API will be displayed as options. In this case, GroupName.value can be any groups that exists in the API, and will be the default selected option.

Group Name and Form Name config​

The options can be a group of items added as an array with a label. options.value is always an array.

FormName.value can be the string All, or it can be an array containing values as strings to match that of the option. Take the following example:

 FormName: {
      label: 'Forms',
      options: [
        {
          label: 'Group 1',
          value: ['daofraudreview', 'dao2'],
        },
        {
          label: 'Group 2 ',
          value: ['daofraudreview', 'usdao'],
        },
      ],
      value: ['daofraudreview', 'usdao'],
    },

This will mean the default value of the dropdown select is Group 2.

If FormName.value: 'All', it will show only options listed in all of the FormName.options.value properties combined that are also available in the API.

note

The values will be checked against the API response. Based on the above example, if the formCode: 'dao2' doesn't exist in the API, it will be ignored and stripped out of the option in the code. The Group 1 option in this case will only show daofraudreview results.

note

The config for these options are persisted in the browsers local storage, so you will likely need to clear browser data to see changes in your local environment.

Example​

The following example showcases how to configure a label, options and a value for different global filters.

src/configs/custom/process.ts
import { ConfigCurrentSpace } from '@transact-open-ux/workspaces/dist/types';

export const processConfig = ({ date }: any): ConfigCurrentSpace => ({
    ...
    globalFilters: {
      GroupName: {
        label: 'Queues',
        options: [
          { label: 'Group One', value: ['Error Review', 'Fraud Review'] },
          { label: 'Group Two', value: ['Manual Review'] },
        ],
        value: 'All',
      },
      FormName: {
        label: 'Forms',
        options: [
          {
            label: 'DAO Group 1',
            value: [
              'daofraudreview',
              'daohelpdesk',
              'daoreview',
            ],
          },
          {
            label: 'DAO Group 2 ',
            value: ['daofraudreview', 'usdao', 'daohelpdesk'],
          },
        ],
        value: ['daofraudreview', 'usdao', 'daohelpdesk'], // Shows DAO Group 2 option as default
      },
      DateCreated: {
        label: 'Created Date',
        value: [date('4 weeks ago'), date('now')],
      },
    },
    ...
});

export default processConfig;

Attributes​

To review the list of supported attributes, see API Reference.