From cb9a57e2509e3e8ea7f6930ad638a8e50b383f75 Mon Sep 17 00:00:00 2001 From: Martin Ledvinka Date: Mon, 15 Jan 2024 17:24:13 +0100 Subject: [PATCH] [kbss-cvut/record-manager-ui#66] Refactor records to use the new messaging component. --- js/actions/RecordActions.js | 15 +++++++++------ js/components/record/Records.js | 11 ++--------- js/components/record/RecordsController.js | 12 ++++-------- tests/__tests__/actions/RecordActions.spec.js | 9 ++++----- 4 files changed, 19 insertions(+), 28 deletions(-) diff --git a/js/actions/RecordActions.js b/js/actions/RecordActions.js index 49ae228f..fc7b5f35 100644 --- a/js/actions/RecordActions.js +++ b/js/actions/RecordActions.js @@ -4,18 +4,21 @@ import {axiosBackend} from "./index"; import * as Utils from "../utils/Utils"; import {loadRecords} from "./RecordsActions"; import {API_URL} from '../../config'; +import {publishMessage} from "./MessageActions"; +import {errorMessage, successMessage} from "../model/Message"; export function deleteRecord(record, currentUser) { - //console.log("Deleting record: ", record); return function (dispatch) { dispatch(deleteRecordPending(record.key)); - axiosBackend.delete(`${API_URL}/rest/records/${record.key}`, { + return axiosBackend.delete(`${API_URL}/rest/records/${record.key}`, { ...record }).then(() => { dispatch(loadRecords(currentUser)); dispatch(deleteRecordSuccess(record, record.key)); + dispatch(publishMessage(successMessage("record.delete-success"))); }).catch((error) => { dispatch(deleteRecordError(error.response.data, record, record.key)); + dispatch(publishMessage(errorMessage('record.delete-error', {error: error.response.data.message}))); }); } } @@ -48,7 +51,7 @@ export function loadRecord(key) { //console.log("Loading record with key: ", key); return function (dispatch) { dispatch(loadRecordPending()); - axiosBackend.get(`${API_URL}/rest/records/${key}`).then((response) => { + return axiosBackend.get(`${API_URL}/rest/records/${key}`).then((response) => { dispatch(loadRecordSuccess(response.data)); }).catch((error) => { dispatch(loadRecordError(error.response.data)); @@ -86,7 +89,7 @@ export function createRecord(record, currentUser) { //console.log("Creating record: ", record); return function (dispatch) { dispatch(saveRecordPending(ACTION_FLAG.CREATE_ENTITY)); - axiosBackend.post(`${API_URL}/rest/records`, { + return axiosBackend.post(`${API_URL}/rest/records`, { ...record }).then((response) => { const key = Utils.extractKeyFromLocationHeader(response); @@ -102,9 +105,9 @@ export function updateRecord(record, currentUser) { //console.log("Updating record: ", record); return function (dispatch) { dispatch(saveRecordPending(ACTION_FLAG.UPDATE_ENTITY)); - axiosBackend.put(`${API_URL}/rest/records/${record.key}`, { + return axiosBackend.put(`${API_URL}/rest/records/${record.key}`, { ...record - }).then((response) => { + }).then(() => { dispatch(saveRecordSuccess(record, null, ACTION_FLAG.UPDATE_ENTITY)); dispatch(loadRecords(currentUser)); }).catch((error) => { diff --git a/js/components/record/Records.js b/js/components/record/Records.js index 8ad3f245..0c1a2edb 100644 --- a/js/components/record/Records.js +++ b/js/components/record/Records.js @@ -3,8 +3,7 @@ import {Button, Card} from "react-bootstrap"; import {injectIntl} from "react-intl"; import withI18n from "../../i18n/withI18n"; import RecordTable from "./RecordTable"; -import {ACTION_STATUS, ALERT_TYPES, EXTENSION_CONSTANTS} from "../../constants/DefaultConstants"; -import AlertMessage from "../AlertMessage"; +import {EXTENSION_CONSTANTS} from "../../constants/DefaultConstants"; import PropTypes from "prop-types"; import {processTypeaheadOptions} from "./TypeaheadAnswer"; import {EXTENSIONS} from "../../../config"; @@ -22,7 +21,6 @@ class Records extends React.Component { recordsLoaded: PropTypes.object, recordDeleted: PropTypes.object, recordsDeleting: PropTypes.array, - showAlert: PropTypes.bool.isRequired, handlers: PropTypes.object.isRequired, currentUser: PropTypes.object.isRequired, formTemplatesLoaded: PropTypes.object.isRequired, @@ -51,7 +49,7 @@ class Records extends React.Component { } render() { - const {showAlert, recordDeleted, formTemplate, recordsLoaded} = this.props; + const {formTemplate, recordsLoaded} = this.props; const showCreateButton = STUDY_CREATE_AT_MOST_ONE_RECORD ? (!recordsLoaded.records || (recordsLoaded.records.length < 1)) : true; @@ -95,11 +93,6 @@ class Records extends React.Component { - {showAlert && recordDeleted.status === ACTION_STATUS.ERROR && - } - {showAlert && recordDeleted.status === ACTION_STATUS.SUCCESS && - } ; } diff --git a/js/components/record/RecordsController.js b/js/components/record/RecordsController.js index 170c07c3..937db1fc 100644 --- a/js/components/record/RecordsController.js +++ b/js/components/record/RecordsController.js @@ -19,9 +19,6 @@ import {trackPromise} from "react-promise-tracker"; class RecordsController extends React.Component { constructor(props) { super(props); - this.state = { - showAlert: false - }; } componentDidMount() { @@ -51,8 +48,7 @@ class RecordsController extends React.Component { }; _onDeleteRecord = (record) => { - this.props.deleteRecord(record, this.props.currentUser); - this.setState({showAlert: true}); + trackPromise(this.props.deleteRecord(record, this.props.currentUser), "records"); }; _onPublishRecords = async () => { @@ -75,11 +71,11 @@ class RecordsController extends React.Component { }; _onExportRecords = (exportType) => { - this.props.exportRecords(exportType); + trackPromise(this.props.exportRecords(exportType), "records"); }; _onImportRecords = (file) => { - return this.props.importRecords(file); + trackPromise(this.props.importRecords(file), "records"); }; render() { @@ -96,7 +92,7 @@ class RecordsController extends React.Component { onExport: this._onExportRecords, onImport: this._onImportRecords }; - return ; diff --git a/tests/__tests__/actions/RecordActions.spec.js b/tests/__tests__/actions/RecordActions.spec.js index 37fc8d95..71e82ec2 100644 --- a/tests/__tests__/actions/RecordActions.spec.js +++ b/tests/__tests__/actions/RecordActions.spec.js @@ -24,7 +24,7 @@ import { } from "../../../js/actions/RecordActions"; import {API_URL} from '../../../config'; -describe('Record synchronize actions', function () { +describe('Record synchronous actions', function () { const record = {key: 7979868757}, key = 7979868757, error = {message: 'error'}; @@ -128,7 +128,7 @@ describe('Record synchronize actions', function () { const middlewares = [thunk.withExtraArgument(axiosBackend)]; const mockStore = configureMockStore(middlewares); -describe('Record asynchronize actions', function () { +describe('Record asynchronous actions', function () { let store, mockApi; const error = { @@ -210,7 +210,6 @@ describe('Record asynchronize actions', function () { { type: ActionConstants.DELETE_RECORD_PENDING, key: record.key}, { type: ActionConstants.LOAD_RECORDS_PENDING}, { type: ActionConstants.DELETE_RECORD_SUCCESS, record, key: record.key}, - { type: ActionConstants.LOAD_RECORDS_SUCCESS, records}, ]; mockApi.onDelete(`${API_URL}/rest/records/${record.key}`).reply(200); @@ -219,7 +218,7 @@ describe('Record asynchronize actions', function () { store.dispatch(deleteRecord(record, currentUser)); setTimeout(() => { - expect(store.getActions()).toEqual(expectedActions); + expect(store.getActions().slice(0, 3)).toEqual(expectedActions); done(); }, TEST_TIMEOUT); }); @@ -235,7 +234,7 @@ describe('Record asynchronize actions', function () { store.dispatch(deleteRecord(record, currentUser)); setTimeout(() => { - expect(store.getActions()).toEqual(expectedActions); + expect(store.getActions().slice(0, 2)).toEqual(expectedActions); done(); }, TEST_TIMEOUT); });