Skip to content

Commit

Permalink
Get rid of "Are you sure?" modal
Browse files Browse the repository at this point in the history
  • Loading branch information
@artem-blazhko
artem-blazhko committed Nov 28, 2024
1 parent a756ed2 commit 16b200a
Show file tree
Hide file tree
Showing 4 changed files with 34 additions and 55 deletions.
58 changes: 34 additions & 24 deletions src/components/MediatedRequestsActivities/components/RequestForm/RequestForm.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,10 @@ import React from 'react';
import PropTypes from 'prop-types';
import { Field } from 'react-final-form';
import { FormattedMessage } from 'react-intl';
import { isEmpty } from 'lodash';
import {
isEmpty,
set,
} from 'lodash';

import {
Accordion,
Expand Down Expand Up @@ -45,7 +48,6 @@ import {
handleKeyCommand,
getPatronGroup,
getTlrSettings,
isSubmittingButtonDisabled,
resetFieldState,
getFulfillmentTypeOptions,
getDefaultRequestPreferences,
Expand Down Expand Up @@ -91,7 +93,6 @@ class RequestForm extends React.Component {
}),
}).isRequired,
setRequest: PropTypes.func,
pristine: PropTypes.bool,
submitting: PropTypes.bool,
patronGroups: PropTypes.arrayOf(PropTypes.object),
selectedItem: PropTypes.object,
Expand All @@ -101,7 +102,6 @@ class RequestForm extends React.Component {
};

static defaultProps = {
pristine: true,
submitting: false,
};

Expand Down Expand Up @@ -130,6 +130,7 @@ class RequestForm extends React.Component {
titleLevelRequestsFeatureEnabled,
};
this.accordionStatusRef = React.createRef();
this.editMediatedRequestData = {};
}

componentDidMount() {
Expand Down Expand Up @@ -162,7 +163,6 @@ class RequestForm extends React.Component {

getRequestDataForEditing = (request = this.props.request) => {
const {
form,
onSetSelectedProxy,
onSetSelectedInstance,
onSetSelectedItem,
Expand All @@ -171,13 +171,14 @@ class RequestForm extends React.Component {
const isTlr = request.requestLevel === MEDIATED_REQUEST_LEVEL.TITLE;

if (isTlr && request.instance?.hrid) {
form.change(MEDIATED_REQUEST_FORM_FIELD_NAMES.INSTANCE_HRID, request.instance.hrid);
this.setEditFormValue(MEDIATED_REQUEST_FORM_FIELD_NAMES.INSTANCE_HRID, request.instance.hrid);
this.setEditFormValue(MEDIATED_REQUEST_FORM_FIELD_NAMES.INSTANCE_ID, request.instanceId);
} else if (request.item?.barcode) {
form.change(MEDIATED_REQUEST_FORM_FIELD_NAMES.ITEM_BARCODE, request.item.barcode);
this.setEditFormValue(MEDIATED_REQUEST_FORM_FIELD_NAMES.ITEM_BARCODE, request.item.barcode);
}

form.change(MEDIATED_REQUEST_FORM_FIELD_NAMES.REQUESTER_BARCODE, request.requester?.barcode);
form.change(MEDIATED_REQUEST_FORM_FIELD_NAMES.PATRON_COMMENTS, request.patronComments);
this.setEditFormValue(MEDIATED_REQUEST_FORM_FIELD_NAMES.REQUESTER_BARCODE, request.requester?.barcode);
this.setEditFormValue(MEDIATED_REQUEST_FORM_FIELD_NAMES.PATRON_COMMENTS, request.patronComments);

Promise.allSettled([
isTlr ? this.findInstance(request.instanceId, false) : this.findItem(RESOURCE_KEYS.ID, request.itemId, false, false),
Expand All @@ -200,7 +201,7 @@ class RequestForm extends React.Component {
}

if (isProxyFunctionalityAvailable() && request.proxy) {
form.change(MEDIATED_REQUEST_FORM_FIELD_NAMES.PROXY_USER_ID, request.proxyUserId);
this.setEditFormValue(MEDIATED_REQUEST_FORM_FIELD_NAMES.PROXY_USER_ID, request.proxyUserId);
onSetSelectedProxy(request.proxy);
}

Expand Down Expand Up @@ -696,6 +697,13 @@ class RequestForm extends React.Component {
});
}

setEditFormValue = (fieldName, value) => {
const { form } = this.props;

form.change(fieldName, value);
set(this.editMediatedRequestData, fieldName, value);
};

setRequestPreferencesForEditing = (resourceId, requesterId, isTlr, request) => {
const {
form,
Expand All @@ -714,42 +722,46 @@ class RequestForm extends React.Component {
const requestTypes = response[1]?.value;

if (requestTypes?.[request.requestType]) { // when request type, fulfilment preference, pickup sp/delivery address were saved before
form.change(MEDIATED_REQUEST_FORM_FIELD_NAMES.REQUEST_TYPE, request.requestType);
this.setEditFormValue(MEDIATED_REQUEST_FORM_FIELD_NAMES.REQUEST_TYPE, request.requestType);

if (request.fulfillmentPreference === FULFILMENT_TYPES.HOLD_SHELF) {
form.change(MEDIATED_REQUEST_FORM_FIELD_NAMES.FULFILLMENT_PREFERENCE, request.fulfillmentPreference);
form.change(MEDIATED_REQUEST_FORM_FIELD_NAMES.DELIVERY_ADDRESS_TYPE_ID, requestPreferences.defaultDeliveryAddressTypeId);
this.setEditFormValue(MEDIATED_REQUEST_FORM_FIELD_NAMES.FULFILLMENT_PREFERENCE, request.fulfillmentPreference);
this.setEditFormValue(MEDIATED_REQUEST_FORM_FIELD_NAMES.DELIVERY_ADDRESS_TYPE_ID, requestPreferences.defaultDeliveryAddressTypeId);
this.setState({ hasDelivery: requestPreferences.hasDelivery });

// check if previously saved service point exists in list of available service points
const selectedServicePoint = requestTypes[request.requestType]?.find(servicePoint => servicePoint.id === request.pickupServicePointId);

if (selectedServicePoint) {
form.change(MEDIATED_REQUEST_FORM_FIELD_NAMES.PICKUP_SERVICE_POINT_ID, request.pickupServicePointId);
this.setEditFormValue(MEDIATED_REQUEST_FORM_FIELD_NAMES.PICKUP_SERVICE_POINT_ID, request.pickupServicePointId);
}
} else if (request.fulfillmentPreference === FULFILMENT_TYPES.DELIVERY && requestPreferences.hasDelivery) {
this.setState({
isDeliverySelected: true,
hasDelivery: true,
});

form.change(MEDIATED_REQUEST_FORM_FIELD_NAMES.FULFILLMENT_PREFERENCE, request.fulfillmentPreference);
form.change(MEDIATED_REQUEST_FORM_FIELD_NAMES.PICKUP_SERVICE_POINT_ID, requestPreferences.defaultServicePointId);
this.setEditFormValue(MEDIATED_REQUEST_FORM_FIELD_NAMES.FULFILLMENT_PREFERENCE, request.fulfillmentPreference);
this.setEditFormValue(MEDIATED_REQUEST_FORM_FIELD_NAMES.PICKUP_SERVICE_POINT_ID, requestPreferences.defaultServicePointId);

// check if previously saved address exists in user's address list
const selectedDeliveryAddress = selectedUser.personal.addresses?.find(address => request.deliveryAddressTypeId === address.addressTypeId);

form.change(MEDIATED_REQUEST_FORM_FIELD_NAMES.DELIVERY_ADDRESS_TYPE_ID, selectedDeliveryAddress?.addressTypeId || requestPreferences.defaultDeliveryAddressTypeId);
this.setEditFormValue(MEDIATED_REQUEST_FORM_FIELD_NAMES.DELIVERY_ADDRESS_TYPE_ID, selectedDeliveryAddress?.addressTypeId || requestPreferences.defaultDeliveryAddressTypeId);
}
} else { // when request type, fulfilment preference, pickup SP/delivery address were not saved before
form.change(MEDIATED_REQUEST_FORM_FIELD_NAMES.FULFILLMENT_PREFERENCE, requestPreferences.fulfillmentPreference);
form.change(MEDIATED_REQUEST_FORM_FIELD_NAMES.PICKUP_SERVICE_POINT_ID, requestPreferences.defaultServicePointId);
form.change(MEDIATED_REQUEST_FORM_FIELD_NAMES.DELIVERY_ADDRESS_TYPE_ID, requestPreferences.defaultDeliveryAddressTypeId);
this.setEditFormValue(MEDIATED_REQUEST_FORM_FIELD_NAMES.FULFILLMENT_PREFERENCE, requestPreferences.fulfillmentPreference);
this.setEditFormValue(MEDIATED_REQUEST_FORM_FIELD_NAMES.PICKUP_SERVICE_POINT_ID, requestPreferences.defaultServicePointId);
this.setEditFormValue(MEDIATED_REQUEST_FORM_FIELD_NAMES.DELIVERY_ADDRESS_TYPE_ID, requestPreferences.defaultDeliveryAddressTypeId);
this.setState({
hasDelivery: requestPreferences.hasDelivery,
isDeliverySelected: requestPreferences.isDeliverySelected,
});
}

/* resetting form values for edit mediated request page let us click "Cancel" button
or cross at the left top corner without having "Are you sure?" modal */
form.reset(this.editMediatedRequestData);
})
.catch(() => {
form.change(MEDIATED_REQUEST_FORM_FIELD_NAMES.REQUEST_TYPE, DEFAULT_REQUEST_TYPE_VALUE);
Expand Down Expand Up @@ -864,7 +876,6 @@ class RequestForm extends React.Component {
selectedInstance,
values,
onCancel,
pristine,
onSetSelectedItem,
onSetSelectedInstance,
onSetSelectedUser,
Expand All @@ -875,7 +886,6 @@ class RequestForm extends React.Component {
let addressDetail;
const { createTitleLevelRequest } = values;
const patronGroup = getPatronGroup(selectedUser, patronGroups);
const isSubmittingDisabled = isSubmittingButtonDisabled(pristine, submitting);
const isTitleLevelRequest = isEditMode ? request?.requestLevel === MEDIATED_REQUEST_LEVEL.TITLE : createTitleLevelRequest;
const isTlrCheckboxDisabled = !titleLevelRequestsFeatureEnabled || isItemOrInstanceLoading;
const requestTypeOptions = getRequestTypesOptions(requestTypes);
Expand All @@ -885,7 +895,7 @@ class RequestForm extends React.Component {
deliveryLocations,
deliveryLocationsDetail,
} = getDeliveryInformation(selectedUser, addressTypes);
const isSaveAndCloseButtonDisabled = isSubmittingDisabled || !(isTitleLevelRequest ? selectedInstance?.id : selectedItem?.id) || !selectedUser?.id;
const isSaveAndCloseButtonDisabled = submitting || !(isTitleLevelRequest ? selectedInstance?.id : selectedItem?.id) || !selectedUser?.id;
const isConfirmButtonDisabled = isSaveAndCloseButtonDisabled || !values.requestType || !(isDeliverySelected ? values.deliveryAddressTypeId : values.pickupServicePointId);
const paneTitle = isEditMode ? <FormattedMessage id="ui-requests-mediated.form.edit.title" /> : <FormattedMessage id="ui-requests-mediated.form.create.title" />;
const isTlrCheckboxVisible = titleLevelRequestsFeatureEnabled && !isEditMode;
Expand All @@ -901,7 +911,7 @@ class RequestForm extends React.Component {
onSubmit={handleSubmit}
onCancel={this.handleCancelAndClose}
accordionStatusRef={this.accordionStatusRef}
isSubmittingDisabled={isSubmittingDisabled}
isSubmittingDisabled={submitting}
>
<form
id="requestsMediatedForm"
Expand Down
2 changes: 0 additions & 2 deletions src/components/MediatedRequestsActivities/components/RequestForm/RequestForm.test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,6 @@ const basicProps = {
form: {
change: jest.fn(),
},
pristine: true,
submitting: false,
patronGroups: [],
selectedItem: {},
Expand Down Expand Up @@ -155,7 +154,6 @@ jest.mock('../../../../utils', () => ({
})),
handleKeyCommand: jest.fn(),
getPatronGroup: jest.fn(),
isSubmittingButtonDisabled: jest.fn(),
resetFieldState: jest.fn(),
getFulfillmentTypeOptions: jest.fn(() => []),
getDefaultRequestPreferences: jest.fn(),
Expand Down
2 changes: 0 additions & 2 deletions src/utils.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -91,8 +91,6 @@ export const getPatronGroup = (patron, patronGroups) => {
return patronGroups.find(group => group.id === id);
};

export const isSubmittingButtonDisabled = (pristine, submitting) => pristine || submitting;

const isYear = (value) => {
const YEAR_REGEX = /^([1-9]\d{0,3})$/;

Expand Down
27 changes: 0 additions & 27 deletions src/utils.test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,6 @@ import {
memoizeValidation,
getTlrSettings,
getPatronGroup,
isSubmittingButtonDisabled,
getFormattedYears,
getInstanceQueryString,
getFulfillmentTypeOptions,
Expand Down Expand Up @@ -367,32 +366,6 @@ describe('utils', () => {
});
});

describe('isSubmittingButtonDisabled', () => {
describe('when pristine is true and submitting is false', () => {
it('should return true', () => {
expect(isSubmittingButtonDisabled(true, false)).toBe(true);
});
});

describe('when pristine is false and submitting is true', () => {
it('should return true', () => {
expect(isSubmittingButtonDisabled(false, true)).toBe(true);
});
});

describe('when pristine is true and submitting is true', () => {
it('should return true', () => {
expect(isSubmittingButtonDisabled(true, true)).toBe(true);
});
});

describe('when pristine is false and submitting is false', () => {
it('should return true', () => {
expect(isSubmittingButtonDisabled(false, false)).toBe(false);
});
});
});

describe('getFormattedYears', () => {
describe('When publications are not passed', () => {
it('should return empty string', () => {
Expand Down

0 comments on commit 16b200a

Please sign in to comment.