@dhis2/analytics 22.0.0-alpha.3 → 23.0.0

package/build/es/__demo__/OpenFileDialog.stories.js

@@ -2,6 +2,7 @@ import { Provider } from '@dhis2/app-runtime';
 import { storiesOf } from '@storybook/react';
 import React from 'react';
 import { OpenFileDialog } from '../components/OpenFileDialog/OpenFileDialog.js';
+import { VIS_TYPE_GROUP_ALL, VIS_TYPE_GROUP_CHARTS, VIS_TYPE_PIVOT_TABLE, VIS_TYPE_COLUMN, VIS_TYPE_BAR, VIS_TYPE_LINE_LIST } from '../modules/visTypes.js';
 const configMock = {
   baseUrl: 'https://debug.dhis2.org/dev',
   apiVersion: 37
@@ -14,17 +15,30 @@ const user = {
 
 const onFileSelect = id => alert("Opening ".concat(id));
 
-storiesOf('OpenFileDialog', module).add('List of visualizations', () => /*#__PURE__*/React.createElement(Provider, {
+const filterVisTypesWithGroupsAndDivider = [{
+  type: VIS_TYPE_GROUP_ALL
+}, {
+  type: VIS_TYPE_GROUP_CHARTS,
+  insertDivider: true
+}, {
+  type: VIS_TYPE_PIVOT_TABLE
+}, {
+  type: VIS_TYPE_COLUMN
+}, {
+  type: VIS_TYPE_BAR
+}];
+storiesOf('OpenFileDialog', module).add('List of visualizations with vis type filter and divider (no default vis type)', () => /*#__PURE__*/React.createElement(Provider, {
   config: configMock
 }, /*#__PURE__*/React.createElement(OpenFileDialog, {
   type: "visualization",
+  filterVisTypes: filterVisTypesWithGroupsAndDivider,
   onClose: Function.prototype,
   onFileSelect: onFileSelect,
   onNew: Function.prototype,
   open: true,
   currentUser: user
 })));
-storiesOf('OpenFileDialog', module).add('List of maps', () => /*#__PURE__*/React.createElement(Provider, {
+storiesOf('OpenFileDialog', module).add('List of maps (no vis type filter)', () => /*#__PURE__*/React.createElement(Provider, {
   config: configMock
 }, /*#__PURE__*/React.createElement(OpenFileDialog, {
   type: "map",
@@ -34,20 +48,38 @@ storiesOf('OpenFileDialog', module).add('List of maps', () => /*#__PURE__*/React
   open: true,
   currentUser: user
 })));
-storiesOf('OpenFileDialog', module).add('List of event reports (Line list only)', () => /*#__PURE__*/React.createElement(Provider, {
+const filterVisTypesWithDisabled = [{
+  type: VIS_TYPE_PIVOT_TABLE,
+  disabled: true
+}, {
+  type: VIS_TYPE_LINE_LIST
+}];
+storiesOf('OpenFileDialog', module).add('List of event visualizations with vis type filter, disabled type and default vis type', () => /*#__PURE__*/React.createElement(Provider, {
   config: configMock
 }, /*#__PURE__*/React.createElement(OpenFileDialog, {
-  type: "eventReport",
+  type: "eventVisualization",
+  filterVisTypes: filterVisTypesWithDisabled,
+  defaultFilterVisType: VIS_TYPE_LINE_LIST,
   onClose: Function.prototype,
   onFileSelect: onFileSelect,
   onNew: Function.prototype,
   open: true,
   currentUser: user
 })));
-storiesOf('OpenFileDialog', module).add('List of a supported type without custom titles/texts', () => /*#__PURE__*/React.createElement(Provider, {
+const filterVisTypesWithGroupDividerAndDisabled = [{
+  type: VIS_TYPE_GROUP_ALL
+}, {
+  type: VIS_TYPE_BAR,
+  insertDivider: true
+}, {
+  type: VIS_TYPE_COLUMN,
+  disabled: true
+}];
+storiesOf('OpenFileDialog', module).add('List of visualizations with vis type filter with group type, divider and disabled option (no default vis type)', () => /*#__PURE__*/React.createElement(Provider, {
   config: configMock
 }, /*#__PURE__*/React.createElement(OpenFileDialog, {
-  type: "eventChart",
+  type: "visualization",
+  filterVisTypes: filterVisTypesWithGroupDividerAndDisabled,
   onClose: Function.prototype,
   onFileSelect: onFileSelect,
   onNew: Function.prototype,

package/build/es/__fixtures__/fixtures.js

@@ -91,6 +91,7 @@ export default (function x() {
   addFixture('/api/analytics/query', require('./json/api/analytics/query.json'));
   addFixture('/api/analytics/cluster', require('./json/api/analytics/cluster.json'));
   addFixture('/api/analytics/response', require('./json/api/analytics/response.json'));
+  addFixture('/api/analytics/enrollments', require('./json/api/analytics/enrollments.json'));
   return {
     get: getFixture,
     add: addFixture

package/build/es/__fixtures__/json/api/analytics/enrollments.json

@@ -0,0 +1,206 @@
+{
+  "headers": [
+    {
+      "name": "pi",
+      "column": "Enrollment",
+      "valueType": "TEXT",
+      "type": "java.lang.String",
+      "hidden": false,
+      "meta": true
+    },
+    {
+      "name": "tei",
+      "column": "Tracked entity instance",
+      "valueType": "TEXT",
+      "type": "java.lang.String",
+      "hidden": false,
+      "meta": true
+    },
+    {
+      "name": "enrollmentdate",
+      "column": "Enrollment date",
+      "valueType": "DATE",
+      "type": "java.util.Date",
+      "hidden": false,
+      "meta": true
+    },
+    {
+      "name": "incidentdate",
+      "column": "Incident date",
+      "valueType": "DATE",
+      "type": "java.util.Date",
+      "hidden": false,
+      "meta": true
+    },
+    {
+      "name": "geometry",
+      "column": "Geometry",
+      "valueType": "TEXT",
+      "type": "java.lang.String",
+      "hidden": false,
+      "meta": true
+    },
+    {
+      "name": "longitude",
+      "column": "Longitude",
+      "valueType": "NUMBER",
+      "type": "java.lang.Double",
+      "hidden": false,
+      "meta": true
+    },
+    {
+      "name": "latitude",
+      "column": "Latitude",
+      "valueType": "NUMBER",
+      "type": "java.lang.Double",
+      "hidden": false,
+      "meta": true
+    },
+    {
+      "name": "ouname",
+      "column": "Organisation unit name",
+      "valueType": "TEXT",
+      "type": "java.lang.String",
+      "hidden": false,
+      "meta": true
+    },
+    {
+      "name": "oucode",
+      "column": "Organisation unit code",
+      "valueType": "TEXT",
+      "type": "java.lang.String",
+      "hidden": false,
+      "meta": true
+    },
+    {
+      "name": "ou",
+      "column": "Organisation unit",
+      "valueType": "TEXT",
+      "type": "java.lang.String",
+      "hidden": false,
+      "meta": true
+    },
+    {
+      "name": "de0FEHSIoxh",
+      "column": "WHOMCH Chronic conditions",
+      "valueType": "BOOLEAN",
+      "type": "java.lang.Boolean",
+      "hidden": false,
+      "meta": true
+    },
+    {
+      "name": "sWoqcoByYmD",
+      "column": "WHOMCH Smoking",
+      "valueType": "BOOLEAN",
+      "type": "java.lang.Boolean",
+      "hidden": false,
+      "meta": true
+    }
+  ],
+  "metaData": {
+    "pager": {
+      "page": 2,
+      "total": 163,
+      "pageSize": 4,
+      "pageCount": 41
+    },
+    "items": {
+      "ImspTQPwCqd": {
+        "name": "Sierra Leone"
+      },
+      "PFDfvmGpsR3": {
+        "name": "Care at birth"
+      },
+      "bbKtnxRZKEP": {
+        "name": "Postpartum care visit"
+      },
+      "ou": {
+        "name": "Organisation unit"
+      },
+      "PUZaKR0Jh2k": {
+        "name": "Previous deliveries"
+      },
+      "edqlbukwRfQ": {
+        "name": "Antenatal care visit"
+      },
+      "WZbXY0S00lP": {
+        "name": "First antenatal care visit"
+      },
+      "sWoqcoByYmD": {
+        "name": "WHOMCH Smoking"
+      },
+      "WSGAb5XwJ3Y": {
+        "name": "WHO RMNCH Tracker"
+      },
+      "de0FEHSIoxh": {
+        "name": "WHOMCH Chronic conditions"
+      }
+    },
+    "dimensions": {
+      "pe": [],
+      "ou": ["ImspTQPwCqd"],
+      "sWoqcoByYmD": [],
+      "de0FEHSIoxh": []
+    }
+  },
+  "width": 12,
+  "rows": [
+    [
+      "A0cP533hIQv",
+      "to8G9jAprnx",
+      "2019-02-02 12:05:00.0",
+      "2019-02-02 12:05:00.0",
+      "",
+      "0.0",
+      "0.0",
+      "Tonkomba MCHP",
+      "OU_193264",
+      "xIMxph4NMP1",
+      "0",
+      "1"
+    ],
+    [
+      "ZqiUn2uXmBi",
+      "SJtv0WzoYki",
+      "2019-02-02 12:05:00.0",
+      "2019-02-02 12:05:00.0",
+      "",
+      "0.0",
+      "0.0",
+      "Mawoma MCHP",
+      "OU_254973",
+      "Srnpwq8jKbp",
+      "0",
+      "0"
+    ],
+    [
+      "lE747mUAtbz",
+      "PGzTv2A1xzn",
+      "2019-02-02 12:05:00.0",
+      "2019-02-02 12:05:00.0",
+      "",
+      "0.0",
+      "0.0",
+      "Kunsho CHP",
+      "OU_193254",
+      "tdhB1JXYBx2",
+      "",
+      "0"
+    ],
+    [
+      "nmcqu9QF8ow",
+      "pav3tGLjYuq",
+      "2019-02-03 12:05:00.0",
+      "2019-02-03 12:05:00.0",
+      "",
+      "0.0",
+      "0.0",
+      "Korbu MCHP",
+      "OU_678893",
+      "m73lWmo5BDG",
+      "",
+      "1"
+    ]
+  ],
+  "height": 4
+}

package/build/es/api/analytics/Analytics.js

@@ -2,6 +2,7 @@
  * @module analytics
  */
 import AnalyticsAggregate from './AnalyticsAggregate.js';
+import AnalyticsEnrollments from './AnalyticsEnrollments.js';
 import AnalyticsEvents from './AnalyticsEvents.js';
 import AnalyticsRequest from './AnalyticsRequest.js';
 import AnalyticsResponse from './AnalyticsResponse.js';
@@ -30,17 +31,20 @@ import AnalyticsResponse from './AnalyticsResponse.js';
 class Analytics {
   /**
    * @param {!module:analytics.AnalyticsAggregate} analyticsAggregate The AnalyticsAggregate instance
+   * @param {!module:analytics.AnalyticsEnrollments} analyticsEnrollments The AnalyticsEnrollments instance
    * @param {!module:analytics.AnalyticsEvents} analyticsEvents The AnalyticsEvents instance
    * @param {!module:analytics.AnalyticsRequest} analyticsRequest The AnalyticsRequest class
    * @param {!module:analytics.AnalyticsResponse} analyticsResponse The AnalyticsResponse class
    */
   constructor({
     aggregate,
+    enrollments,
     events,
     request,
     response
   }) {
     this.aggregate = aggregate;
+    this.enrollments = enrollments;
     this.events = events;
     this.request = request;
     this.response = response;
@@ -63,6 +67,7 @@ class Analytics {
     if (!Analytics.getAnalytics.analytics) {
       Analytics.getAnalytics.analytics = new Analytics({
         aggregate: new AnalyticsAggregate(dataEngine),
+        enrollments: new AnalyticsEnrollments(dataEngine),
         events: new AnalyticsEvents(dataEngine),
         request: AnalyticsRequest,
         response: AnalyticsResponse

package/build/es/api/analytics/AnalyticsEnrollments.js

@@ -0,0 +1,38 @@
+import AnalyticsBase from './AnalyticsBase.js';
+/**
+ * @extends module:analytics.AnalyticsBase
+ *
+ * @description
+ * Analytics enrollments class used to request analytics enrollments data from Web API.
+ *
+ * @memberof module:analytics
+ *
+ * @see https://docs.dhis2.org/en/develop/using-the-api/dhis-core-version-236/analytics.html#webapi_enrollment_analytics
+ */
+
+class AnalyticsEnrollments extends AnalyticsBase {
+  /**
+   * @param {!AnalyticsRequest} req Request object
+   *
+   * @returns {Promise} Promise that resolves with the analytics query data from the api.
+   *
+   * @example
+   * const req = new analytics.request()
+   *  .withProgram('eBAyeGv0exc')
+   *  .addDataDimension(['Uvn6LCg7dVU','OdiHJayrsKo'])
+   *  .addPeriodDimension('LAST_4_QUARTERS')
+   *  .addOrgUnitDimension(['lc3eMKXaEfw','PMa2VCrupOd'])
+   *  .addOrgUnitFilter('O6uvpzGd5pu')
+   *  .withStartDate('2017-10-01')
+   *  .withEndDate('2017-10-31');
+   *
+   *  analytics.enrollments.getQuery(req)
+   *  .then(console.log);
+   */
+  getQuery(req) {
+    return this.fetch(req.withPath('enrollments/query'));
+  }
+
+}
+
+export default AnalyticsEnrollments;

package/build/es/api/analytics/__tests__/AnalyticsEnrollments.spec.js

@@ -0,0 +1,40 @@
+import fixtures from '../../../__fixtures__/fixtures.js';
+import DataEngineMock from '../__mocks__/DataEngine.js';
+import AnalyticsEnrollments from '../AnalyticsEnrollments.js';
+import AnalyticsRequest from '../AnalyticsRequest.js';
+describe('analytics.enrollments', () => {
+  let enrollments;
+  let request;
+  let dataEngineMock;
+  let fixture;
+  beforeEach(() => {
+    dataEngineMock = new DataEngineMock();
+    DataEngineMock.mockClear();
+    enrollments = new AnalyticsEnrollments();
+  });
+  it('should not be allowed to be called without new', () => {
+    expect(() => AnalyticsEnrollments()).toThrowErrorMatchingSnapshot();
+  });
+  it('should use the dataEngine object when it is passed', () => {
+    const dataEngineMockObject = {};
+    enrollments = new AnalyticsEnrollments(dataEngineMockObject);
+    expect(enrollments.dataEngine).toBe(dataEngineMockObject);
+  });
+  describe('.getQuery()', () => {
+    beforeEach(() => {
+      enrollments = new AnalyticsEnrollments(new DataEngineMock());
+      request = new AnalyticsRequest().addOrgUnitDimension('ImspTQPwCqd').addDimension('WZbXY0S00lP.de0FEHSIoxh').addDimension('WZbXY0S00lP.sWoqcoByYmD').addPeriodFilter('LAST_MONTH').withProgram('WSGAb5XwJ3Y').withStage('WZbXY0S00lP').withAsc('ENROLLMENTDATE').withOuMode('DESCENDANTS').withColumns('w75KJ2mc4zz').withPage(1).withPageSize(10);
+      fixture = fixtures.get('/api/analytics/enrollments');
+      dataEngineMock.query.mockReturnValue(Promise.resolve({
+        data: fixture
+      }));
+    });
+    it('should be a function', () => {
+      expect(enrollments.getQuery).toBeInstanceOf(Function);
+    });
+    it('should resolve a promise with data', () => enrollments.getQuery(request).then(data => {
+      expect(data.width).toEqual(fixture.width);
+      expect(data.height).toEqual(fixture.height);
+    }));
+  });
+});

package/build/es/api/analytics/__tests__/__snapshots__/AnalyticsEnrollments.spec.js.snap

@@ -0,0 +1,3 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`analytics.enrollments should not be allowed to be called without new 1`] = `"Class constructor AnalyticsEnrollments cannot be invoked without 'new'"`;

package/build/es/components/CachedDataQueryProvider.js

@@ -16,20 +16,14 @@ const CachedDataQueryProvider = ({
   } = useDataQuery(query);
   const {
     error,
-    loading,
-    fetching
+    loading
   } = rest;
   const data = rawData && dataTransformation ? dataTransformation(rawData) : rawData;
-  /*
-   * Render loader only when data is unavailable
-   */
 
-  if (loading || fetching) {
-    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Layer, {
+  if (loading) {
+    return /*#__PURE__*/React.createElement(Layer, {
       translucent: true
-    }, /*#__PURE__*/React.createElement(CenteredContent, null, /*#__PURE__*/React.createElement(CircularLoader, null))), !loading && /*#__PURE__*/React.createElement(CachedDataQueryCtx.Provider, {
-      value: data
-    }, children));
+    }, /*#__PURE__*/React.createElement(CenteredContent, null, /*#__PURE__*/React.createElement(CircularLoader, null)));
   }
 
   if (error) {

package/build/es/components/FileMenu/FileMenu.js

@@ -13,8 +13,10 @@ import { SaveAsDialog } from './SaveAsDialog.js';
 import { supportedFileTypes } from './utils.js';
 export const FileMenu = ({
   currentUser,
+  defaultFilterVisType,
   fileType,
   fileObject,
+  filterVisTypes,
   onNew,
   onOpen,
   onSave,
@@ -129,6 +131,8 @@ export const FileMenu = ({
   }, i18n.t('File'))), /*#__PURE__*/React.createElement(OpenFileDialog, {
     open: currentDialog === 'open',
     type: fileType,
+    filterVisTypes: filterVisTypes,
+    defaultFilterVisType: defaultFilterVisType,
     onClose: onDialogClose,
     onFileSelect: id => {
       onOpen(id);
@@ -237,8 +241,10 @@ FileMenu.defaultProps = {
 };
 FileMenu.propTypes = {
   currentUser: PropTypes.object,
+  defaultFilterVisType: PropTypes.string,
   fileObject: PropTypes.object,
   fileType: PropTypes.oneOf(supportedFileTypes),
+  filterVisTypes: PropTypes.array,
   onDelete: PropTypes.func,
   onError: PropTypes.func,
   onNew: PropTypes.func,

package/build/es/components/OpenFileDialog/CustomSelectOption.js

@@ -1,16 +1,20 @@
 import _JSXStyle from "styled-jsx/style";
+import i18n from '@dhis2/d2-i18n';
+import { MenuDivider, Tooltip } from '@dhis2/ui';
 import cx from 'classnames';
 import PropTypes from 'prop-types';
 import React from 'react';
 import styles from './styles/CustomSelectOption.style.js';
-export const CustomSelectOption = ({
+
+const CustomSelectOptionItem = ({
   value,
   label,
   icon,
+  insertDivider,
   onClick,
   active,
   disabled
-}) => /*#__PURE__*/React.createElement("div", {
+}) => /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
   onClick: e => onClick({}, e),
   "data-value": value,
   "data-label": label,
@@ -19,10 +23,18 @@ export const CustomSelectOption = ({
     disabled
   }) || "")
 }, icon, /*#__PURE__*/React.createElement("span", {
-  className: "jsx-".concat(styles.__hash) + " " + "label"
+  className: "jsx-".concat(styles.__hash) + " " + (cx({
+    label: icon
+  }) || "")
 }, label), /*#__PURE__*/React.createElement(_JSXStyle, {
   id: styles.__hash
-}, styles));
+}, styles)), insertDivider && /*#__PURE__*/React.createElement(MenuDivider, {
+  dense: true
+}));
+
+export const CustomSelectOption = props => props.disabled ? /*#__PURE__*/React.createElement(Tooltip, {
+  content: i18n.t('Not supported by this app yet')
+}, /*#__PURE__*/React.createElement(CustomSelectOptionItem, props)) : /*#__PURE__*/React.createElement(CustomSelectOptionItem, props);
 CustomSelectOption.propTypes = {
   icon: PropTypes.element.isRequired,
   label: PropTypes.string.isRequired,
@@ -31,4 +43,5 @@ CustomSelectOption.propTypes = {
   disabled: PropTypes.bool,
   onClick: PropTypes.func
 };
+CustomSelectOptionItem.propTypes = CustomSelectOption.propTypes;
 export default CustomSelectOption;

package/build/es/components/OpenFileDialog/FileList.js

@@ -4,14 +4,14 @@ import React from 'react';
 import { VisTypeIcon } from '../VisTypeIcon.js';
 import { DateField } from './DateField.js';
 export const FileList = ({
-  type,
   data,
-  onSelect
+  onSelect,
+  showVisTypeColumn
 }) => /*#__PURE__*/React.createElement(React.Fragment, null, data.map(visualization => /*#__PURE__*/React.createElement(DataTableRow, {
   key: visualization.id
 }, /*#__PURE__*/React.createElement(DataTableCell, {
   onClick: () => onSelect(visualization.id)
-}, visualization.displayName), type === 'visualization' && /*#__PURE__*/React.createElement(DataTableCell, {
+}, visualization.displayName), showVisTypeColumn && /*#__PURE__*/React.createElement(DataTableCell, {
   align: "center"
 }, /*#__PURE__*/React.createElement(VisTypeIcon, {
   type: visualization.type,
@@ -30,7 +30,7 @@ FileList.propTypes = {
     lastUpdated: PropTypes.string.isRequired,
     type: PropTypes.string
   })).isRequired,
-  type: PropTypes.string.isRequired,
-  onSelect: PropTypes.func.isRequired
+  onSelect: PropTypes.func.isRequired,
+  showVisTypeColumn: PropTypes.bool
 };
 export default FileList;

package/build/es/components/OpenFileDialog/OpenFileDialog.js

@@ -5,13 +5,14 @@ import { Box, Modal, ModalTitle, ModalContent, DataTable, DataTableHead, DataTab
 import isEqual from 'lodash/isEqual';
 import PropTypes from 'prop-types';
 import React, { useEffect, useMemo, useState } from 'react';
+import { VIS_TYPE_GROUP_ALL, VIS_TYPE_GROUP_CHARTS } from '../../modules/visTypes.js';
 import { CreatedByFilter, CREATED_BY_ALL, CREATED_BY_ALL_BUT_CURRENT_USER, CREATED_BY_CURRENT_USER } from './CreatedByFilter.js';
 import { FileList } from './FileList.js';
 import { NameFilter } from './NameFilter.js';
 import { styles } from './OpenFileDialog.styles.js';
 import { PaginationControls } from './PaginationControls.js';
-import { getTranslatedString, AO_TYPE_VISUALIZATION, AO_TYPE_EVENT_REPORT, AO_TYPE_EVENT_VISUALIZATION, AOTypeMap } from './utils.js';
-import { VisTypeFilter, VIS_TYPE_ALL, VIS_TYPE_CHARTS } from './VisTypeFilter.js';
+import { getTranslatedString, AOTypeMap } from './utils.js';
+import { VisTypeFilter } from './VisTypeFilter.js';
 
 const getQuery = type => ({
   files: {
@@ -42,6 +43,8 @@ const getQuery = type => ({
 export const OpenFileDialog = ({
   type,
   open,
+  filterVisTypes,
+  defaultFilterVisType,
   onClose,
   onFileSelect,
   onNew,
@@ -51,7 +54,7 @@ export const OpenFileDialog = ({
   const defaultFilters = {
     searchTerm: '',
     createdBy: CREATED_BY_ALL,
-    visType: VIS_TYPE_ALL
+    visType: defaultFilterVisType
   };
   const [{
     sortField,
@@ -82,26 +85,23 @@ export const OpenFileDialog = ({
         break;
     }
 
-    switch (filters.visType) {
-      case VIS_TYPE_ALL:
-        break;
+    if (filters.visType) {
+      switch (filters.visType) {
+        case VIS_TYPE_GROUP_ALL:
+          break;
 
-      case VIS_TYPE_CHARTS:
-        queryFilters.push('type:!eq:PIVOT_TABLE');
-        break;
+        case VIS_TYPE_GROUP_CHARTS:
+          queryFilters.push('type:!eq:PIVOT_TABLE');
+          break;
 
-      default:
-        queryFilters.push("type:eq:".concat(filters.visType));
-        break;
+        default:
+          queryFilters.push("type:eq:".concat(filters.visType));
+          break;
+      }
     }
 
     if (filters.searchTerm) {
       queryFilters.push("name:ilike:".concat(filters.searchTerm));
-    } // for ER 2.38 only show line list ER types
-
-
-    if (type === AO_TYPE_EVENT_REPORT || type === AO_TYPE_EVENT_VISUALIZATION) {
-      queryFilters.push('dataType:eq:EVENTS');
     }
 
     return queryFilters;
@@ -127,7 +127,8 @@ export const OpenFileDialog = ({
       refetch({
         page,
         sortField,
-        sortDirection
+        sortDirection,
+        filters: formatFilters()
       });
     }
   }, [open, page, sortField, sortDirection]);
@@ -157,7 +158,7 @@ export const OpenFileDialog = ({
     width: '110px'
   }];
 
-  if (type === AO_TYPE_VISUALIZATION) {
+  if (filterVisTypes !== null && filterVisTypes !== void 0 && filterVisTypes.length) {
     headers.splice(1, 0, {
       field: 'type',
       label: i18n.t('Type'),
@@ -190,9 +191,10 @@ export const OpenFileDialog = ({
         searchTerm: value
       }), 200));
     }
-  })), type === AO_TYPE_VISUALIZATION && /*#__PURE__*/React.createElement("div", {
+  })), (filterVisTypes === null || filterVisTypes === void 0 ? void 0 : filterVisTypes.length) && /*#__PURE__*/React.createElement("div", {
     className: "jsx-".concat(styles.__hash) + " " + "type-field-container"
   }, /*#__PURE__*/React.createElement(VisTypeFilter, {
+    visTypes: filterVisTypes,
     selected: filters.visType,
     onChange: value => setFilters({ ...filters,
       visType: value
@@ -261,9 +263,9 @@ export const OpenFileDialog = ({
       onClose();
     }
   }, getTranslatedString(type, 'newButtonLabel'))))))))), (data === null || data === void 0 ? void 0 : data.files[AOTypeMap[type].apiEndpoint].length) > 0 && /*#__PURE__*/React.createElement(FileList, {
-    type: type,
     data: data.files[AOTypeMap[type].apiEndpoint],
-    onSelect: onFileSelect
+    onSelect: onFileSelect,
+    showVisTypeColumn: Boolean(filterVisTypes === null || filterVisTypes === void 0 ? void 0 : filterVisTypes.length)
   }))), (data === null || data === void 0 ? void 0 : data.files[AOTypeMap[type].apiEndpoint].length) > 0 && /*#__PURE__*/React.createElement(DataTableToolbar, {
     position: "bottom"
   }, /*#__PURE__*/React.createElement("div", {
@@ -282,6 +284,8 @@ OpenFileDialog.propTypes = {
   type: PropTypes.oneOf(Object.keys(AOTypeMap)).isRequired,
   onClose: PropTypes.func.isRequired,
   onFileSelect: PropTypes.func.isRequired,
-  onNew: PropTypes.func.isRequired
+  onNew: PropTypes.func.isRequired,
+  defaultFilterVisType: PropTypes.string,
+  filterVisTypes: PropTypes.array
 };
 export default OpenFileDialog;