@urbanos/react-discovery-ui 2.1.43

package/lib/store/sagas/visualization-saga.test.js

@@ -0,0 +1,388 @@
+import { visualizationSave, visualizationLoadFailure, visualizationSaveFailure, visualizationLoad, visualizationLoadSuccess, visualizationsLoadAll, visualizationsLoadAllSuccess, visualizationsLoadAllFailure, visualizationSaveSuccess, setQueryText, setChartInformation, executeFreestyleQuery, visualizationDelete, visualizationDeleteFailure, visualizationDeleteSuccess, retrieveDatasetReference } from '../actions'
+import visualizationSaga, { saveVisualization, deleteVisualization, loadDatasetReferences } from './visualization-saga'
+
+import { createStore, applyMiddleware } from 'redux'
+import createSagaMiddleware, { runSaga } from 'redux-saga'
+import { AuthenticatedHTTPClient } from '../../utils/http-clients'
+
+describe('visualization-saga', () => {
+  let store
+  let sagaMiddleware
+  const reducer = (state = [], action) => {
+    return [...state, action]
+  }
+
+  beforeEach(() => {
+    sagaMiddleware = createSagaMiddleware()
+    store = createStore(reducer, applyMiddleware(sagaMiddleware))
+    sagaMiddleware.run(visualizationSaga)
+  })
+
+  afterEach(() => {
+    jest.resetAllMocks()
+  })
+
+  describe('loadVisualization', () => {
+    const id = 'hello'
+    const chart = { data: [], frames: [], layout: {} }
+    const query = 'select * from stuff'
+    const usedDatasets = ['123', '432']
+    const visualization = { id, chart, query, usedDatasets }
+    describe('successfully', () => {
+      beforeEach(() => {
+        AuthenticatedHTTPClient.get = jest.fn(() => ({ status: 200, data: visualization }))
+        store.dispatch(visualizationLoad(id))
+      })
+
+      it('calls the correct API endpoint', () => {
+        expect(AuthenticatedHTTPClient.get).toHaveBeenCalledWith(`/api/v1/visualization/${id}`)
+      })
+
+      it('signals the visualization is available', () => {
+        expect(store.getState()).toContainEqual(visualizationLoadSuccess(visualization))
+      })
+
+      it('sets the global chart data', () => {
+        expect(store.getState()).toContainEqual(setChartInformation(visualization.chart))
+      })
+
+      it('sets the global query text', () => {
+        expect(store.getState()).toContainEqual(setQueryText(visualization.query))
+      })
+
+      it('executes the query', () => {
+        expect(store.getState()).toContainEqual(executeFreestyleQuery(visualization.query))
+      })
+    })
+
+    describe('dispatches side effects', () => {
+      let dispatched
+      beforeEach(async () => {
+        AuthenticatedHTTPClient.get = jest.fn(() => ({ status: 200 }))
+        dispatched = await recordSaga(loadDatasetReferences, visualizationLoadSuccess(visualization), { datasetReferences: {} })
+      })
+
+      it('sends a get reference action per dataset', () => {
+        expect(dispatched).toContainEqual(retrieveDatasetReference(usedDatasets[0]))
+        expect(dispatched).toContainEqual(retrieveDatasetReference(usedDatasets[1]))
+      })
+    })
+
+    describe('with a non-success status code', () => {
+      const nonSuccessStatusCode = 400
+      beforeEach(() => {
+        AuthenticatedHTTPClient.get = jest.fn(() => ({ status: nonSuccessStatusCode }))
+      })
+
+      it('signals the visualization is unavailable', () => {
+        store.dispatch(visualizationLoad(id))
+
+        expect(store.getState()).toContainEqual(visualizationLoadFailure(nonSuccessStatusCode))
+      })
+    })
+
+    describe('with a thrown error', () => {
+      const errorMessage = 'WRONG'
+      beforeEach(() => {
+        AuthenticatedHTTPClient.get = jest.fn(() => { throw new Error(errorMessage) })
+      })
+
+      it('signals the visualization is unavailable', () => {
+        store.dispatch(visualizationLoad(id))
+
+        expect(store.getState()).toContainEqual(visualizationLoadFailure(errorMessage))
+      })
+    })
+  })
+
+  describe('loadUserVisualizations', () => {
+    const visualizations = [{ title: 'title1', id: 'id1' }, { title: 'title2', id: 'id2' }]
+
+    describe('successfully', () => {
+      beforeEach(() => {
+        AuthenticatedHTTPClient.get = jest.fn(() => ({ status: 200, data: visualizations }))
+        store.dispatch(visualizationsLoadAll())
+      })
+
+      it('calls the correct API endpoint', () => {
+        expect(AuthenticatedHTTPClient.get).toHaveBeenCalledWith('/api/v1/visualization')
+      })
+
+      it('signals the visualization is available', () => {
+        expect(store.getState()).toContainEqual(visualizationsLoadAllSuccess(visualizations))
+      })
+    })
+
+    describe('with a non-successful status code', () => {
+      beforeEach(() => {
+        AuthenticatedHTTPClient.get = jest.fn(() => ({ status: 400 }))
+        store.dispatch(visualizationsLoadAll())
+      })
+
+      it('signals the visualizations are unavailable', () => {
+        expect(store.getState()).toContainEqual(visualizationsLoadAllFailure(400))
+      })
+    })
+
+    describe('with a thrown error', () => {
+      const errorMessage = 'WRONG AGAIN'
+      beforeEach(() => {
+        AuthenticatedHTTPClient.get = jest.fn(() => { throw new Error(errorMessage) })
+        store.dispatch(visualizationsLoadAll())
+      })
+
+      it('signals the visualization is unavailable', () => {
+        expect(store.getState()).toContainEqual(visualizationsLoadAllFailure(errorMessage))
+      })
+    })
+  })
+
+  describe('saveVisualization', () => {
+    describe('without an id', () => {
+      const title = 'my first visualization'
+      const query = 'select hello from world'
+      const usedDatasets = ['123', '432']
+      const returnedVisualization = { id: 'generated id from api', title, query, usedDatasets }
+      const initialState = {
+        visualization: { chart: { data: [{ x: [1, 2, 3], xsrc: 'col1' }], layout: {}, frames: [] } },
+        queryReducer: { queryData: [{ col1: 1 }, { col1: 2 }, { col1: 3 }] }
+      }
+
+      describe('successfully', () => {
+        let dispatched = []
+        beforeEach(async () => {
+          AuthenticatedHTTPClient.post = jest.fn(() => ({ status: 200, data: returnedVisualization }))
+          dispatched = await recordSaga(saveVisualization, visualizationSave({ title, query }), initialState)
+        })
+
+        it('calls api with parameters that include a dereferenced chart', () => {
+          expect(AuthenticatedHTTPClient.post).toHaveBeenCalledWith('/api/v1/visualization',
+            {
+              title: title,
+              query: query,
+              chart: { data: [{ x: null, xsrc: 'col1' }], frames: [], layout: {} }
+            }
+          )
+        })
+
+        it('signals the visualization is available', () => {
+          expect(dispatched).toContainEqual(visualizationSaveSuccess(returnedVisualization))
+        })
+
+        it('does not set the global chart data', () => {
+          expect(dispatched).not.toContainEqual(setChartInformation(returnedVisualization.chart))
+        })
+
+        it('does not set the global query text', () => {
+          expect(dispatched).not.toContainEqual(setQueryText(returnedVisualization.query))
+        })
+      })
+
+      describe('dispatches side effects', () => {
+        let dispatched = []
+        beforeEach(async () => {
+          AuthenticatedHTTPClient.get = jest.fn(() => ({ status: 200 }))
+          dispatched = await recordSaga(loadDatasetReferences, visualizationSaveSuccess(returnedVisualization), { datasetReferences: {} })
+        })
+
+        it('sends a get reference action per dataset', () => {
+          expect(dispatched).toContainEqual(retrieveDatasetReference(usedDatasets[0]))
+          expect(dispatched).toContainEqual(retrieveDatasetReference(usedDatasets[1]))
+        })
+      })
+
+      describe('with a non-success status code', () => {
+        const nonSuccessStatusCode = 400
+        let dispatched = []
+        beforeEach(async () => {
+          AuthenticatedHTTPClient.post = jest.fn(() => ({ status: nonSuccessStatusCode }))
+          dispatched = await recordSaga(saveVisualization, visualizationSave({ title, query }), initialState)
+        })
+
+        it('signals the visualization is unavailable', () => {
+          expect(dispatched).toContainEqual(visualizationSaveFailure(nonSuccessStatusCode))
+        })
+      })
+
+      describe('with a thrown error', () => {
+        const errorMessage = 'WRONG'
+        let dispatched = []
+        beforeEach(async () => {
+          AuthenticatedHTTPClient.post = jest.fn(() => { throw new Error(errorMessage) })
+          dispatched = await recordSaga(saveVisualization, visualizationSave({ title, query }), initialState)
+        })
+
+        it('signals the visualization is unavailable', () => {
+          expect(dispatched).toContainEqual(visualizationSaveFailure(errorMessage))
+        })
+      })
+    })
+
+    describe('with an id', () => {
+      const id = 'hello'
+      const title = 'my first visualization'
+      const query = 'select hello from world'
+      const returnedVisualization = { id, title, query }
+      const initialState = {
+        visualization: { chart: { data: [{ x: [1, 2, 3], xsrc: 'col1' }], layout: {}, frames: [] } },
+        queryReducer: { queryData: [{ col1: 1 }, { col1: 2 }, { col1: 3 }] }
+      }
+
+      describe('successfully', () => {
+        let dispatched = []
+        beforeEach(async () => {
+          AuthenticatedHTTPClient.put = jest.fn(() => ({ status: 200, data: returnedVisualization }))
+          dispatched = await recordSaga(saveVisualization, visualizationSave({ id, title, query }), initialState)
+        })
+
+        it('calls api with parameters that include a dereferenced chart', () => {
+          expect(AuthenticatedHTTPClient.put).toHaveBeenCalledWith(`/api/v1/visualization/${id}`,
+            {
+              id: id,
+              title: title,
+              query: query,
+              chart: { data: [{ x: null, xsrc: 'col1' }], frames: [], layout: {} }
+            }
+          )
+        })
+
+        it('signals the visualization is available', () => {
+          expect(dispatched).toContainEqual(visualizationSaveSuccess(returnedVisualization))
+        })
+
+        it('does not set the global chart data', () => {
+          expect(dispatched).not.toContainEqual(setChartInformation(returnedVisualization.chart))
+        })
+
+        it('does not set the global query text', () => {
+          expect(dispatched).not.toContainEqual(setQueryText(returnedVisualization.query))
+        })
+      })
+
+      describe('with a non-success status code', () => {
+        const nonSuccessStatusCode = 400
+        let dispatched = []
+        beforeEach(async () => {
+          AuthenticatedHTTPClient.put = jest.fn(() => ({ status: nonSuccessStatusCode }))
+          dispatched = await recordSaga(saveVisualization, visualizationSave({ id, title, query }), initialState)
+        })
+
+        it('signals the visualization is unavailable', () => {
+          expect(dispatched).toContainEqual(visualizationSaveFailure(nonSuccessStatusCode))
+        })
+      })
+
+      describe('with a thrown error', () => {
+        const errorMessage = 'WRONG'
+        let dispatched = []
+        beforeEach(async () => {
+          AuthenticatedHTTPClient.put = jest.fn(() => { throw new Error(errorMessage) })
+          dispatched = await recordSaga(saveVisualization, visualizationSave({ id, title, query }), initialState)
+        })
+
+        it('signals the visualization is unavailable', () => {
+          expect(dispatched).toContainEqual(visualizationSaveFailure(errorMessage))
+        })
+      })
+
+      describe('creating a copy', () => {
+        let dispatched = []
+        beforeEach(async () => {
+          AuthenticatedHTTPClient.post = jest.fn(() => ({ status: 200, data: returnedVisualization }))
+          dispatched = await recordSaga(saveVisualization, visualizationSave({ id, title, query, shouldCreateCopy: true }), initialState)
+        })
+
+        it('calls api with parameters that include a dereferenced chart', () => {
+          expect(AuthenticatedHTTPClient.post).toHaveBeenCalledWith('/api/v1/visualization',
+            {
+              title: title,
+              query: query,
+              chart: { data: [{ x: null, xsrc: 'col1' }], frames: [], layout: {} }
+            }
+          )
+        })
+
+        it('signals the visualization is available', () => {
+          expect(dispatched).toContainEqual(visualizationSaveSuccess(returnedVisualization))
+        })
+
+        it('does not set the global chart data', () => {
+          expect(dispatched).not.toContainEqual(setChartInformation(returnedVisualization.chart))
+        })
+
+        it('does not set the global query text', () => {
+          expect(dispatched).not.toContainEqual(setQueryText(returnedVisualization.query))
+        })
+      })
+    })
+  })
+
+  describe('deleteVisualization', () => {
+    const initialState = {}
+
+    describe('successfully', () => {
+      let dispatched = []
+      beforeEach(async () => {
+        AuthenticatedHTTPClient.delete = jest.fn(() => ({ status: 204, data: {} }))
+        dispatched = await recordSaga(deleteVisualization, visualizationDelete({ id: '3' }), initialState)
+      })
+
+      it('signals the visualization is deleted', () => {
+        expect(dispatched).toContainEqual(visualizationDeleteSuccess())
+      })
+
+      it('dispatches a load user visualization list action', () => {
+        expect(dispatched).toContainEqual(visualizationsLoadAll())
+      })
+    })
+
+    describe('with a non-success status code', () => {
+      const nonSuccessStatusCode = 400
+      let dispatched = []
+      beforeEach(async () => {
+        AuthenticatedHTTPClient.delete = jest.fn(() => ({ status: nonSuccessStatusCode }))
+        dispatched = await recordSaga(deleteVisualization, visualizationDelete({ id: '2' }), initialState)
+      })
+
+      it('signals the visualization deletion failed', () => {
+        expect(dispatched).toContainEqual(visualizationDeleteFailure(nonSuccessStatusCode))
+      })
+
+      it('dispatches a load user visualization list action', () => {
+        expect(dispatched).toContainEqual(visualizationsLoadAll())
+      })
+    })
+
+    describe('with a thrown error', () => {
+      const errorMessage = 'WRONG'
+      let dispatched = []
+      beforeEach(async () => {
+        AuthenticatedHTTPClient.delete = jest.fn(() => { throw new Error(errorMessage) })
+        dispatched = await recordSaga(deleteVisualization, visualizationDelete({ id: '1' }), initialState)
+      })
+
+      it('signals the visualization deletion failed', () => {
+        expect(dispatched).toContainEqual(visualizationDeleteFailure(errorMessage))
+      })
+
+      it('dispatches a load user visualization list action', () => {
+        expect(dispatched).toContainEqual(visualizationsLoadAll())
+      })
+    })
+  })
+})
+
+async function recordSaga (saga, initialAction, initialState) {
+  const dispatched = []
+
+  await runSaga(
+    {
+      dispatch: (action) => dispatched.push(action),
+      getState: () => (initialState)
+    },
+    saga,
+    initialAction
+  ).done
+
+  return dispatched
+}

package/lib/store/selectors.js

@@ -0,0 +1,83 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.lastLogoutAttemptFailed = exports.lastLoginAttemptFailed = exports.isSearchLoading = exports.getTotalNumberOfDatasets = exports.getSearchResults = exports.getSearchParams = exports.getSearchMetadata = exports.getPageNumber = exports.getNumberOfPages = exports.getGlobalErrorState = exports.getGlobalErrorMessage = exports.getFacetList = exports.getDownloadedDatasetError = exports.getDownloadedDataset = exports.getDatasetRecommendations = exports.getDatasetQueryCancelToken = exports.getDataSetReferences = exports.getDataSetPreview = exports.getDataSetList = exports.getDataSetError = exports.getDataSet = exports.getApiKeyState = exports.determineIfVisualizationQueryLoading = exports.determineIfLoading = void 0;
+var getDataSetList = exports.getDataSetList = function getDataSetList(state) {
+  return state.datasetReducer.datasets;
+};
+var getDataSetReferences = exports.getDataSetReferences = function getDataSetReferences(state) {
+  return state.presentation.datasetReferences;
+};
+var getFacetList = exports.getFacetList = function getFacetList(state) {
+  return state.datasetReducer.facets;
+};
+var getTotalNumberOfDatasets = exports.getTotalNumberOfDatasets = function getTotalNumberOfDatasets(state) {
+  return state.datasetReducer.total;
+};
+var getApiKeyState = exports.getApiKeyState = function getApiKeyState(state) {
+  return state.presentation.apiKey;
+};
+var getDataSetError = exports.getDataSetError = function getDataSetError(state) {
+  return state.datasetReducer.datasetError;
+};
+var getGlobalErrorState = exports.getGlobalErrorState = function getGlobalErrorState(state) {
+  return state.presentation.isError;
+};
+var getGlobalErrorMessage = exports.getGlobalErrorMessage = function getGlobalErrorMessage(state) {
+  return state.presentation.errorMessage;
+};
+var getDataSet = exports.getDataSet = function getDataSet(state) {
+  return state.datasetReducer.dataset;
+};
+var getDataSetPreview = exports.getDataSetPreview = function getDataSetPreview(state, format) {
+  return state.presentation.dataset_preview[format];
+};
+var getDatasetRecommendations = exports.getDatasetRecommendations = function getDatasetRecommendations(state) {
+  return state.datasetReducer.recommendations;
+};
+var determineIfLoading = exports.determineIfLoading = function determineIfLoading(state) {
+  return state.presentation.isLoading;
+};
+var determineIfVisualizationQueryLoading = exports.determineIfVisualizationQueryLoading = function determineIfVisualizationQueryLoading(state) {
+  return state.queryReducer.isVisualizationQueryLoading;
+};
+var lastLoginAttemptFailed = exports.lastLoginAttemptFailed = function lastLoginAttemptFailed(state) {
+  return state.presentation.lastLoginAttemptFailed;
+};
+var lastLogoutAttemptFailed = exports.lastLogoutAttemptFailed = function lastLogoutAttemptFailed(state) {
+  return state.presentation.lastLogoutAttemptFailed;
+};
+var getDownloadedDataset = exports.getDownloadedDataset = function getDownloadedDataset(state) {
+  return state.datasetReducer.downloadedDataset;
+};
+var getDownloadedDatasetError = exports.getDownloadedDatasetError = function getDownloadedDatasetError(state) {
+  return state.datasetReducer.downloadedDatasetError;
+};
+var getDatasetQueryCancelToken = exports.getDatasetQueryCancelToken = function getDatasetQueryCancelToken(state) {
+  return state.queryReducer.cancelToken;
+};
+var getSearchParams = exports.getSearchParams = function getSearchParams(state) {
+  return state.searchReducer.searchParams;
+};
+var getSearchResults = exports.getSearchResults = function getSearchResults(state) {
+  return state.searchReducer.searchResults;
+};
+var getSearchMetadata = exports.getSearchMetadata = function getSearchMetadata(state) {
+  return state.searchReducer.searchMetadata || [];
+};
+var getPageNumber = exports.getPageNumber = function getPageNumber(state) {
+  return calculatePageNumber(state.searchReducer.searchParams);
+};
+var getNumberOfPages = exports.getNumberOfPages = function getNumberOfPages(state) {
+  return Math.ceil(state.searchReducer.searchMetadata.totalDatasets / state.searchReducer.searchMetadata.limit);
+};
+var isSearchLoading = exports.isSearchLoading = function isSearchLoading(state) {
+  return state.searchReducer.isRunning;
+};
+function calculatePageNumber(_ref) {
+  var offset = _ref.offset,
+    limit = _ref.limit;
+  return Math.ceil(offset / limit) + 1;
+}

package/lib/store/visualization-selectors.js

@@ -0,0 +1,85 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.visualizationUsedDatasets = exports.visualizationTitle = exports.visualizationSaving = exports.visualizationSaveSuccess = exports.visualizationSaveFailure = exports.visualizationLoading = exports.visualizationLoadSuccess = exports.visualizationLoadFailure = exports.visualizationID = exports.visualizationDeleting = exports.visualizationDeleteSuccess = exports.visualizationDeleteFailure = exports.visualizationChart = exports.visualizationAllowedActions = exports.userVisualizations = exports.isVisualizationSaveable = exports.dereferencedChart = void 0;
+var _reselect = require("reselect");
+var _querySelectors = require("./query-selectors");
+var _lodash = require("lodash");
+var _lib = require("react-chart-editor/lib");
+var visualizationID = exports.visualizationID = function visualizationID(state) {
+  return state.visualization.visualization.id;
+};
+var visualizationTitle = exports.visualizationTitle = function visualizationTitle(state) {
+  return state.visualization.visualization.title;
+};
+var visualizationUsedDatasets = exports.visualizationUsedDatasets = function visualizationUsedDatasets(state) {
+  return state.visualization.visualization.usedDatasets;
+};
+var visualizationLoading = exports.visualizationLoading = function visualizationLoading(state) {
+  return state.visualization.loading;
+};
+var visualizationLoadSuccess = exports.visualizationLoadSuccess = function visualizationLoadSuccess(state) {
+  return state.visualization.loadSuccess;
+};
+var visualizationLoadFailure = exports.visualizationLoadFailure = function visualizationLoadFailure(state) {
+  return state.visualization.loadFailure;
+};
+var visualizationSaving = exports.visualizationSaving = function visualizationSaving(state) {
+  return state.visualization.saving;
+};
+var visualizationSaveSuccess = exports.visualizationSaveSuccess = function visualizationSaveSuccess(state) {
+  return state.visualization.saveSuccess;
+};
+var visualizationSaveFailure = exports.visualizationSaveFailure = function visualizationSaveFailure(state) {
+  return state.visualization.saveFailure;
+};
+var visualizationDeleteFailure = exports.visualizationDeleteFailure = function visualizationDeleteFailure(state) {
+  return state.visualization.deleteFailure;
+};
+var visualizationDeleteSuccess = exports.visualizationDeleteSuccess = function visualizationDeleteSuccess(state) {
+  return state.visualization.deleteSuccess;
+};
+var visualizationDeleting = exports.visualizationDeleting = function visualizationDeleting(state) {
+  return state.visualization.deleting;
+};
+var visualizationChart = exports.visualizationChart = function visualizationChart(state) {
+  return state.visualization.chart;
+};
+var userVisualizations = exports.userVisualizations = function userVisualizations(state) {
+  return state.visualization.userVisualizations;
+};
+var visualizationAllowedActions = exports.visualizationAllowedActions = function visualizationAllowedActions(state) {
+  if (!state.visualization.visualization.allowedActions) {
+    return ['create'];
+  }
+  return state.visualization.visualization.allowedActions.map(function (action) {
+    return action.name;
+  });
+};
+var isVisualizationSaveable = exports.isVisualizationSaveable = (0, _reselect.createSelector)(_querySelectors.isQueryTextAvailable, visualizationLoading, visualizationSaving, function (queryTextAvailable, visualizationLoading, visualizationSaving) {
+  return queryTextAvailable && !(visualizationLoading || visualizationSaving);
+});
+var clearValues = function clearValues(dataSources) {
+  return (0, _lodash.mapValues)(dataSources, function () {
+    return [];
+  });
+};
+var dereferenceAndClone = function dereferenceAndClone(data, dataSources) {
+  var clonedData = (0, _lodash.cloneDeep)(data);
+  (0, _lib.dereference)(clonedData, dataSources);
+  return clonedData;
+};
+var dereferencedChart = exports.dereferencedChart = (0, _reselect.createSelector)(visualizationChart, _querySelectors.getVisualizationDataSources, function (visualizationChart, visualizationDataSources) {
+  var data = visualizationChart.data,
+    layout = visualizationChart.layout,
+    frames = visualizationChart.frames;
+  var clearedDataSources = clearValues(visualizationDataSources);
+  var dereferencedData = dereferenceAndClone(data, clearedDataSources);
+  return {
+    data: dereferencedData,
+    layout: layout,
+    frames: frames
+  };
+});