@instructure/outcomes-ui 2.1.4 → 2.1.5

package/es/translated/ru/hooks/__tests__/useCSVExport.test.js

@@ -0,0 +1,265 @@
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import { expect } from 'chai';
+import { renderHook } from '@testing-library/react-hooks/dom';
+import sinon from 'sinon';
+import useCSVExport, { NOT_EXPORTING, FETCHING_DATA, FORMATTING_CSV, CSV_COMPLETE, alertTypes } from "../useCSVExport.js";
+import { NOT_FETCHING, COMPLETED, IN_PROGRESS, ERROR } from "../../constants.js";
+import * as Alerts from "../../components/FlashAlert/index.js";
+describe('useCSVExport', function () {
+  var clock;
+  var showFlashAlert;
+  beforeEach(function () {
+    clock = sinon.useFakeTimers();
+    showFlashAlert = sinon.spy(Alerts, 'showFlashAlert');
+  });
+  afterEach(function () {
+    clock.restore();
+    showFlashAlert.restore();
+  });
+
+  var makeProps = function makeProps(props) {
+    return _objectSpread({
+      fetchCSVData: sinon.spy(),
+      fetchingStatus: NOT_FETCHING,
+      formatCSVData: sinon.spy(),
+      showProgressBar: sinon.spy(),
+      hideProgressBar: sinon.spy()
+    }, props);
+  };
+
+  describe('initializes', function () {
+    it('as not exporting', function () {
+      var _renderHook = renderHook(function () {
+        return useCSVExport(_objectSpread({}, makeProps({})));
+      }),
+          result = _renderHook.result;
+
+      expect(result.current.exportState).to.equal(NOT_EXPORTING);
+    });
+    it('formattedData as an empty array', function () {
+      var _renderHook2 = renderHook(function () {
+        return useCSVExport(_objectSpread({}, makeProps({})));
+      }),
+          result = _renderHook2.result;
+
+      expect(result.current.formattedData).to.be.empty;
+    });
+  });
+  describe('beginExport', function () {
+    it('when called sets the exportState to fetching_data and calls fetchCSVData if this is the first fetch', function () {
+      var props = makeProps({});
+
+      var _renderHook3 = renderHook(function () {
+        return useCSVExport(_objectSpread({}, props));
+      }),
+          result = _renderHook3.result;
+
+      result.current.beginExport();
+      expect(result.current.exportState).to.equal(FETCHING_DATA);
+      expect(props.fetchCSVData).to.have.been.called;
+      expect(props.formatCSVData).to.not.have.been.called;
+    });
+    it('when called sets the exportState to formatting_csv and calls formatCSVData if we have already completed a fetch', function () {
+      var formattedData = [[{
+        row1: 'row1'
+      }]];
+      var formatCSVDataMock = sinon.stub().returns(formattedData);
+      var props = makeProps({
+        fetchingStatus: COMPLETED,
+        formatCSVData: formatCSVDataMock
+      });
+
+      var _renderHook4 = renderHook(function () {
+        return useCSVExport(_objectSpread({}, props));
+      }),
+          result = _renderHook4.result;
+
+      result.current.beginExport();
+      expect(result.current.exportState).to.equal(FORMATTING_CSV);
+      expect(props.fetchCSVData).to.not.have.been.called;
+      expect(props.formatCSVData).to.have.been.called;
+    });
+    it('calls showFlashAlert with the starting message', function () {
+      var _renderHook5 = renderHook(function () {
+        return useCSVExport(_objectSpread({}, makeProps({})));
+      }),
+          result = _renderHook5.result;
+
+      result.current.beginExport();
+      expect(showFlashAlert).to.have.been.calledWith(alertTypes.starting);
+    });
+    it('calls showProgressBar', function () {
+      var props = makeProps({});
+
+      var _renderHook6 = renderHook(function () {
+        return useCSVExport(_objectSpread({}, props));
+      }),
+          result = _renderHook6.result;
+
+      result.current.beginExport();
+      expect(props.showProgressBar).to.have.been.calledOnce;
+    });
+  });
+  it('cancelExport sets the exportState to not_exporting and calls hideProgressBar and shows the cancelled alert', function () {
+    var props = makeProps({});
+
+    var _renderHook7 = renderHook(function () {
+      return useCSVExport(_objectSpread({}, props));
+    }),
+        result = _renderHook7.result;
+
+    result.current.beginExport();
+    result.current.cancelExport();
+    expect(result.current.exportState).to.equal(NOT_EXPORTING);
+    expect(props.hideProgressBar).to.have.been.calledOnce;
+    expect(showFlashAlert).to.have.been.calledWith(alertTypes.cancelled);
+  });
+  it('sets the exportState to not_fetching if fetchCSVData throws an error', function () {
+    var fetchCSVDataError = sinon.stub().rejects();
+    var props = makeProps({
+      fetchCSVData: fetchCSVDataError
+    });
+    var newProps = makeProps({
+      fetchingStatus: ERROR
+    });
+    var hook = renderHook(function () {
+      return useCSVExport(_objectSpread({}, props));
+    });
+    hook.result.current.beginExport();
+    hook.rerender(newProps);
+    hook.waitForNextUpdate(function () {
+      expect(hook.result.current.exportState).to.equal(NOT_FETCHING);
+    });
+  });
+  it('calls showFlashAlert with the error message', function () {
+    var fetchCSVDataError = sinon.stub().rejects();
+    var props = makeProps({
+      fetchCSVData: fetchCSVDataError
+    });
+    var newProps = makeProps({
+      fetchingStatus: ERROR
+    });
+    var hook = renderHook(function () {
+      return useCSVExport(_objectSpread({}, props));
+    });
+    hook.result.current.beginExport();
+    hook.rerender(newProps);
+    hook.waitForNextUpdate(function () {
+      expect(showFlashAlert).to.have.been.calledWith(alertTypes.error);
+    });
+  });
+  it('does not call formatCSVData if fetchingStatus is still in progress', function () {
+    var newProps = makeProps({
+      fetchingStatus: IN_PROGRESS
+    });
+    var hook = renderHook(function () {
+      return useCSVExport(_objectSpread({}, makeProps({})));
+    });
+    hook.result.current.beginExport();
+    hook.rerender(newProps);
+    hook.waitForNextUpdate(function () {
+      expect(hook.result.current.exportState).to.equal(FETCHING_DATA);
+      expect(newProps.formatCSVData).to.not.have.been.called;
+    });
+  });
+  it('does not call formatCSVData if we are no longer fetching and did not complete', function () {
+    var newProps = makeProps({
+      fetchingStatus: NOT_FETCHING
+    });
+    var hook = renderHook(function () {
+      return useCSVExport(_objectSpread({}, makeProps({})));
+    });
+    hook.result.current.beginExport();
+    hook.rerender(newProps);
+    hook.waitForNextUpdate(function () {
+      expect(newProps.formatCSVData).to.not.have.been.called;
+    });
+  });
+  it('does not call formatCSVData if there is no export happening', function () {
+    var props = makeProps({
+      fetchingStatus: COMPLETED
+    });
+    renderHook(function () {
+      return useCSVExport(_objectSpread({}, props));
+    });
+    expect(props.formatCSVData).to.not.have.been.called;
+  });
+  it('does not call formatCSVData if fetching results in an error', function () {
+    var fetchCSVDataError = sinon.stub().rejects();
+    var props = makeProps({
+      fetchCSVData: fetchCSVDataError
+    });
+    var newProps = makeProps({
+      fetchingStatus: ERROR
+    });
+    var hook = renderHook(function () {
+      return useCSVExport(_objectSpread({}, props));
+    });
+    hook.result.current.beginExport();
+    hook.rerender(newProps);
+    hook.waitForNextUpdate(function () {
+      expect(newProps.formatCSVData).to.not.have.been.called;
+    });
+  });
+  it('sets the exportState to csv_complete when the data is formatted and shows the success alert', function () {
+    var formattedData = [[{
+      row1: 'row1'
+    }]];
+    var formatCSVDataMock = sinon.stub().returns(formattedData);
+    var props = makeProps({
+      formatCSVData: formatCSVDataMock
+    });
+    var newProps = makeProps({
+      fetchingStatus: COMPLETED
+    });
+    var hook = renderHook(function () {
+      return useCSVExport(_objectSpread({}, props));
+    });
+    hook.result.current.beginExport();
+    hook.rerender(newProps);
+    hook.waitForNextUpdate(function () {
+      expect(hook.result.current.formattedData).to.deep.equal(formattedData);
+      expect(hook.result.current.exportState).to.equal(CSV_COMPLETE);
+      expect(showFlashAlert).to.have.been.calledWith(alertTypes.success);
+    });
+  });
+  it('hides the progress bar and sets exportState to not_exporting once we have exported', function () {
+    var formattedData = [[{
+      row1: 'row1'
+    }]];
+    var formatCSVDataMock = sinon.stub().returns(formattedData);
+    var props = makeProps({
+      formatCSVData: formatCSVDataMock
+    });
+    var newProps = makeProps({
+      fetchingStatus: COMPLETED
+    });
+    var hook = renderHook(function () {
+      return useCSVExport(_objectSpread({}, props));
+    });
+    hook.result.current.beginExport();
+    hook.rerender(newProps);
+    hook.waitForNextUpdate(function () {
+      clock.tick(2000);
+      expect(newProps.hideProgressBar).to.have.been.calledOnce;
+      expect(hook.result.exportState).to.equal(NOT_EXPORTING);
+    });
+  });
+  it('does not set the exportState to csv_complete if the formatted data is empty', function () {
+    var formatCSVDataMock = sinon.stub().returns([]);
+    var props = makeProps({
+      formatCSVData: formatCSVDataMock
+    });
+    var newProps = makeProps({
+      fetchingStatus: COMPLETED
+    });
+    var hook = renderHook(function () {
+      return useCSVExport(_objectSpread({}, props));
+    });
+    hook.result.current.beginExport();
+    hook.rerender(newProps);
+    hook.waitForNextUpdate(function () {
+      expect(hook.result.current.exportState).to.not.equal(CSV_COMPLETE);
+    });
+  });
+});

package/es/translated/ru/hooks/useCSVExport.js

@@ -0,0 +1,129 @@
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import { useEffect, useState } from 'react';
+import PropTypes from 'prop-types';
+import { COMPLETED, ERROR } from "../constants.js";
+import { showFlashAlert } from "../components/FlashAlert/index.js";
+export var NOT_EXPORTING = 'not_exporting';
+export var FETCHING_DATA = 'fetching_data';
+export var FORMATTING_CSV = 'formatting_csv';
+export var CSV_COMPLETE = 'csv_complete';
+export var alertTypes = {
+  starting: {
+    message: "CSV export has started. This may take a few minutes.",
+    type: 'success',
+    timeout: 5000
+  },
+  cancelled: {
+    message: "Your CSV export has been cancelled",
+    type: 'info',
+    timeout: 5000
+  },
+  success: {
+    message: "CSV export has completed",
+    type: 'success',
+    timeout: 5000
+  },
+  error: {
+    message: "There was an error in fetching the data. Please try again.",
+    type: 'error',
+    timeout: 5000
+  }
+};
+
+var useCSVExport = function useCSVExport(_ref) {
+  var fetchCSVData = _ref.fetchCSVData,
+      fetchingStatus = _ref.fetchingStatus,
+      formatCSVData = _ref.formatCSVData,
+      showProgressBar = _ref.showProgressBar,
+      hideProgressBar = _ref.hideProgressBar;
+
+  var _useState = useState(NOT_EXPORTING),
+      _useState2 = _slicedToArray(_useState, 2),
+      exportState = _useState2[0],
+      setExportState = _useState2[1];
+
+  var _useState3 = useState([]),
+      _useState4 = _slicedToArray(_useState3, 2),
+      formattedData = _useState4[0],
+      setFormattedData = _useState4[1];
+
+  var _useState5 = useState(0),
+      _useState6 = _slicedToArray(_useState5, 2),
+      progressValue = _useState6[0],
+      setProgressValue = _useState6[1];
+
+  var incrementProgressValue = function incrementProgressValue() {
+    return setProgressValue(function (prevValue) {
+      return prevValue + 1;
+    });
+  };
+
+  useEffect(function () {
+    if (exportState === FETCHING_DATA && fetchingStatus === COMPLETED) {
+      formatData();
+    } else if (exportState === FETCHING_DATA && fetchingStatus === ERROR) {
+      hideProgressBar();
+      showFlashAlert(alertTypes.error);
+      setExportState(NOT_EXPORTING);
+    }
+  }, [fetchingStatus]);
+  useEffect(function () {
+    if ((exportState === FETCHING_DATA || exportState === FORMATTING_CSV) && progressValue < 90) {
+      setTimeout(function () {
+        incrementProgressValue();
+      }, 1);
+    } else if (exportState === FORMATTING_CSV && formattedData.length > 0) {
+      setProgressValue(100);
+      showFlashAlert(alertTypes.success);
+      setExportState(CSV_COMPLETE);
+      setTimeout(function () {
+        hideProgressBar();
+        setExportState(NOT_EXPORTING);
+      }, 2000);
+    }
+  }, [exportState, formattedData, progressValue]);
+
+  var beginExport = function beginExport() {
+    showProgressBar();
+    showFlashAlert(alertTypes.starting);
+
+    if (fetchingStatus === COMPLETED) {
+      formatData();
+    } else {
+      fetchData();
+    }
+  };
+
+  var cancelExport = function cancelExport() {
+    showFlashAlert(alertTypes.cancelled);
+    setExportState(NOT_EXPORTING);
+    hideProgressBar();
+  };
+
+  var fetchData = function fetchData() {
+    setExportState(FETCHING_DATA);
+    fetchCSVData();
+  };
+
+  var formatData = function formatData() {
+    setExportState(FORMATTING_CSV);
+    setFormattedData(formatCSVData());
+  };
+
+  return {
+    beginExport: beginExport,
+    cancelExport: cancelExport,
+    exportState: exportState,
+    progressValue: progressValue,
+    formattedData: formattedData
+  };
+};
+
+useCSVExport.PropTypes = {
+  fetchCSVData: PropTypes.func.isRequired,
+  fetchingStatus: PropTypes.string.isRequired,
+  formatCSVData: PropTypes.func.isRequired,
+  showProgressBar: PropTypes.func.isRequired,
+  hideProgressBar: PropTypes.func.isRequired
+};
+export default useCSVExport;

package/es/translated/ru/services/OutcomesService.js

@@ -118,7 +118,8 @@ var OutcomesService = /*#__PURE__*/function () {
     value: function getArtifact(host, jwt, artifactType, artifactId) {
       var params = {
         artifact_type: artifactType,
-        artifact_id: artifactId
+        artifact_id: artifactId,
+        includes: 'friendly_description'
       };
       return this.get(host, jwt, "/api/artifact?".concat(queryString.stringify(params))).then(checkResponse).then(toJson).then(function (json) {
         return json.alignment_set || json;
@@ -235,7 +236,7 @@ var OutcomesService = /*#__PURE__*/function () {
       var params = {
         per_page: 10,
         page: page,
-        includes: 'scoring_method'
+        includes: ['scoring_method', 'friendly_description']
       };
 
       if (contextUuid) {
@@ -251,7 +252,9 @@ var OutcomesService = /*#__PURE__*/function () {
       }
 
       var total = 0;
-      return this.get(host, jwt, "/api/outcomes/list?".concat(queryString.stringify(params))).then(checkResponse).then(function (response) {
+      return this.get(host, jwt, "/api/outcomes/list?".concat(queryString.stringify(params, {
+        arrayFormat: 'bracket'
+      }))).then(checkResponse).then(function (response) {
         total = getTotal(response);
         return response;
       }).then(toJson).then(function (json) {
@@ -267,7 +270,8 @@ var OutcomesService = /*#__PURE__*/function () {
       var contextUuid = arguments.length > 4 && arguments[4] !== void 0 ? arguments[4] : '';
       var params = {
         text: text,
-        page: page
+        page: page,
+        includes: ['scoring_method', 'friendly_description']
       };
 
       if (contextUuid) {
@@ -275,7 +279,9 @@ var OutcomesService = /*#__PURE__*/function () {
       }
 
       var total = 0;
-      return this.get(host, jwt, "/api/outcomes/search?".concat(queryString.stringify(params))).then(checkResponse).then(function (response) {
+      return this.get(host, jwt, "/api/outcomes/search?".concat(queryString.stringify(params, {
+        arrayFormat: 'bracket'
+      }))).then(checkResponse).then(function (response) {
         total = getTotal(response);
         return response;
       }).then(toJson).then(function (json) {

package/es/translated/ru/services/__tests__/OutcomesService.test.js

@@ -151,19 +151,19 @@ describe('OutcomesService', function () {
     };
     it('uses correct query', function () {
       fetchMock.getOnce(function (url, opts) {
-        expect(url).to.match(/\/artifact\?artifact_id=1&artifact_type=quizzes.quiz$/);
+        expect(url).to.match(/\/artifact\?artifact_id=1&artifact_type=quizzes.quiz&includes=friendly_description$/);
         return true;
       }, []);
       return subject.getArtifact(host, jwt, artifact.artifact_type, artifact.artifact_id);
     });
     it('resolves with json on success', function () {
-      mockGet('/api/artifact?artifact_id=1&artifact_type=quizzes.quiz', artifact);
+      mockGet('/api/artifact?artifact_id=1&artifact_type=quizzes.quiz&includes=friendly_description', artifact);
       return subject.getArtifact(host, jwt, artifact.artifact_type, artifact.artifact_id).then(function (result) {
         expect(result).to.deep.equal(artifact.alignment_set);
       });
     });
     it('rejects on error', function () {
-      mockGet('/api/artifact?artifact_id=1&artifact_type=quizzes.quiz', 500);
+      mockGet('/api/artifact?artifact_id=1&artifact_type=quizzes.quiz&includes=friendly_description', 500);
       return subject.getArtifact(host, jwt, artifact.artifact_type, artifact.artifact_id).catch(function (err) {
         expect(err).to.have.property('status', 500);
       });
@@ -415,7 +415,7 @@ describe('OutcomesService', function () {
   describe('getSearchResults', function () {
     it('uses correct query', function () {
       fetchMock.getOnce(function (url, opts) {
-        expect(url).to.match(/\/outcomes\/search\?context_uuid=def&page=999&text=abc$/);
+        expect(url).to.match(/\/outcomes\/search\?context_uuid=def&includes\[\]=scoring_method&includes\[\]=friendly_description&page=999&text=abc$/);
         return true;
       }, []);
       return subject.getSearchResults(host, jwt, 'abc', 999, 'def');
@@ -438,7 +438,7 @@ describe('OutcomesService', function () {
       var headers = {
         total: 101
       };
-      mockGet('/api/outcomes/search?context_uuid=def&page=999&text=abc', {
+      mockGet('/api/outcomes/search?context_uuid=def&includes[]=scoring_method&includes[]=friendly_description&page=999&text=abc', {
         body: body,
         headers: headers
       });
@@ -449,7 +449,7 @@ describe('OutcomesService', function () {
       });
     });
     it('rejects on error', function () {
-      mockGet('/api/outcomes/search?context_uuid=def&page=999&text=abc', 500);
+      mockGet('/api/outcomes/search?context_uuid=def&includes[]=scoring_method&includes[]=friendly_description&page=999&text=abc', 500);
       return subject.getSearchResults(host, jwt, 'abc', 999, 'def').catch(function (err) {
         expect(err).to.have.property('status', 500);
       });
@@ -458,7 +458,7 @@ describe('OutcomesService', function () {
   describe('listOutcomes', function () {
     it('uses correct query', function () {
       fetchMock.getOnce(function (url, opts) {
-        var exp_url = /\/outcomes\/list\?artifact_id=103&artifact_type=quizzes\.quiz&context_uuid=def&includes=scoring_method&page=999&per_page=10$/;
+        var exp_url = /\/outcomes\/list\?artifact_id=103&artifact_type=quizzes\.quiz&context_uuid=def&includes\[\]=scoring_method&includes\[\]=friendly_description&page=999&per_page=10$/;
         expect(url).to.match(exp_url);
         return true;
       }, []);
@@ -477,7 +477,7 @@ describe('OutcomesService', function () {
       var headers = {
         total: 101
       };
-      var url = '/api/outcomes/list?context_uuid=def&includes=scoring_method&page=999&per_page=10';
+      var url = '/api/outcomes/list?context_uuid=def&includes[]=scoring_method&includes[]=friendly_description&page=999&per_page=10';
       mockGet(url, {
         body: body,
         headers: headers
@@ -490,7 +490,7 @@ describe('OutcomesService', function () {
       });
     });
     it('rejects on error', function () {
-      var url = '/api/outcomes/list?artifact_id=103&artifact_type=quizzes.quiz&context_uuid=def&includes=scoring_method&page=999&per_page=10';
+      var url = '/api/outcomes/list?artifact_id=103&artifact_type=quizzes.quiz&context_uuid=def&includes[]=scoring_method&includes[]=friendly_description&page=999&per_page=10';
       mockGet(url, 500);
       return subject.listOutcomes(host, jwt, 999, 'def', '103', 'quizzes.quiz').catch(function (err) {
         expect(err).to.have.property('status', 500);
@@ -509,7 +509,7 @@ describe('OutcomesService', function () {
       var headers = {
         total: 101
       };
-      var url = '/api/outcomes/list?artifact_id=103&artifact_type=quizzes.quiz&context_uuid=def&includes=scoring_method&page=999&per_page=10';
+      var url = '/api/outcomes/list?artifact_id=103&artifact_type=quizzes.quiz&context_uuid=def&includes[]=scoring_method&includes[]=friendly_description&page=999&per_page=10';
       mockGet(url, {
         body: body,
         headers: headers