Web: People: rename component LeaveFormDialog to DataLossWarningDialog, action setIsVisibleModalLeave to setIsVisibleDataLossDialog

This commit is contained in:
Artem Tarasov 2020-10-06 13:29:11 +03:00
parent 045e618c3a
commit 0244d97007
12 changed files with 67 additions and 63 deletions

View File

@ -3,7 +3,7 @@ import { connect } from "react-redux";
import { utils, TreeMenu, TreeNode, Icons, Link } from "asc-web-components";
import {
selectGroup,
setIsVisibleModalLeave,
setIsVisibleDataLossDialog,
} from "../../../store/people/actions";
import { getSelectedGroup } from "../../../store/people/selectors";
import { withTranslation, I18nextProvider } from "react-i18next";
@ -103,10 +103,10 @@ class ArticleBodyContent extends React.Component {
return false;
}
onSelectHandler = (data) => {
const { editingForm, setIsVisibleModalLeave } = this.props;
const { editingForm, setIsVisibleDataLossDialog } = this.props;
if (editingForm.isEdit) {
setIsVisibleModalLeave(true, this.onSelect(data));
setIsVisibleDataLossDialog(true, this.onSelect(data));
} else {
this.onSelect(data)();
}
@ -244,5 +244,5 @@ function mapStateToProps(state) {
export default connect(mapStateToProps, {
selectGroup,
setIsVisibleModalLeave,
setIsVisibleDataLossDialog,
})(BodyContent);

View File

@ -7,37 +7,37 @@ import { utils } from "asc-web-common";
import ModalDialogContainer from "../ModalDialogContainer";
import { createI18N } from "../../../helpers/i18n";
import {
setIsVisibleModalLeave,
setIsVisibleDataLossDialog,
setIsEditingForm,
} from "../../../store/people/actions";
const i18n = createI18N({
page: "LeaveFormDialog",
localesPath: "dialogs/LeaveFormDialog",
page: "DataLossWarningDialog",
localesPath: "dialogs/DataLossWarningDialog",
});
const { changeLanguage } = utils;
class LeaveFormDialogComponent extends React.Component {
class DataLossWarningDialogComponent extends React.Component {
constructor(props) {
super(props);
changeLanguage(i18n);
}
onClose = () => {
const { setIsVisibleModalLeave } = this.props;
setIsVisibleModalLeave(false);
const { setIsVisibleDataLossDialog } = this.props;
setIsVisibleDataLossDialog(false);
};
onSubmit = () => {
const {
onContinue,
setIsVisibleModalLeave,
setIsVisibleDataLossDialog,
setIsEditingForm,
editingForm,
} = this.props;
setIsVisibleModalLeave(false, null);
setIsVisibleDataLossDialog(false, null);
setIsEditingForm(false);
if (editingForm.callback) {
@ -52,17 +52,17 @@ class LeaveFormDialogComponent extends React.Component {
return (
<ModalDialogContainer>
<ModalDialog
visible={editingForm.isVisibleModalLeave}
visible={editingForm.isVisibleDataLossDialog}
onClose={this.onClose}
>
<ModalDialog.Header>{t("LeaveDialogHeader")}</ModalDialog.Header>
<ModalDialog.Header>{t("DataLossWarningHeader")}</ModalDialog.Header>
<ModalDialog.Body>
<Text fontSize="13px">{t("LeaveDialogBody")}</Text>
<Text fontSize="13px">{t("DataLossWarningBody")}</Text>
</ModalDialog.Body>
<ModalDialog.Footer>
<Button
key="LeaveForm"
label={t("LeaveDialogLeaveBtn")}
label={t("DataLossWarningLeaveBtn")}
size="medium"
primary={true}
onClick={this.onSubmit}
@ -70,7 +70,7 @@ class LeaveFormDialogComponent extends React.Component {
<Button
className="button-dialog"
key="StayOnPage"
label={t("LeaveDialogCancelBtn")}
label={t("DataLossWarningCancelBtn")}
size="medium"
onClick={this.onClose}
/>
@ -81,13 +81,15 @@ class LeaveFormDialogComponent extends React.Component {
}
}
const LeaveFormDialogTranslated = withTranslation()(LeaveFormDialogComponent);
const LeaveFormDialog = (props) => (
<LeaveFormDialogTranslated i18n={i18n} {...props} />
const DataLossWarningDialogTranslated = withTranslation()(
DataLossWarningDialogComponent
);
LeaveFormDialog.propTypes = {
const DataLossWarningDialog = (props) => (
<DataLossWarningDialogTranslated i18n={i18n} {...props} />
);
DataLossWarningDialog.propTypes = {
editingForm: PropTypes.object.isRequired,
onContinue: PropTypes.func.isRequired,
};
@ -99,6 +101,6 @@ function mapStateToProps(state) {
}
export default connect(mapStateToProps, {
setIsVisibleModalLeave,
setIsVisibleDataLossDialog,
setIsEditingForm,
})(LeaveFormDialog);
})(DataLossWarningDialog);

View File

@ -0,0 +1,6 @@
{
"DataLossWarningHeader": "Leave the page?",
"DataLossWarningBody": "Changes you made may not be saved.",
"DataLossWarningLeaveBtn": "Leave",
"DataLossWarningCancelBtn": "Cancel"
}

View File

@ -0,0 +1,6 @@
{
"DataLossWarningHeader": "Покинуть страницу?",
"DataLossWarningBody": "Внесенные вами изменения могут быть не сохранены.",
"DataLossWarningLeaveBtn": "Покинуть",
"DataLossWarningCancelBtn": "Отмена"
}

View File

@ -1,6 +0,0 @@
{
"LeaveDialogHeader": "Leave the page?",
"LeaveDialogBody": "Changes you made may not be saved.",
"LeaveDialogLeaveBtn": "Leave",
"LeaveDialogCancelBtn": "Cancel"
}

View File

@ -1,6 +0,0 @@
{
"LeaveDialogHeader": "Покинуть страницу?",
"LeaveDialogBody": "Внесенные вами изменения могут быть не сохранены.",
"LeaveDialogLeaveBtn": "Покинуть",
"LeaveDialogCancelBtn": "Отмена"
}

View File

@ -8,7 +8,7 @@ import InviteDialog from "./InviteDialog";
import SendInviteDialog from "./SendInviteDialog";
import ChangeUserStatusDialog from "./ChangeUserStatusDialog";
import ChangeUserTypeDialog from "./ChangeUserTypeDialog";
import LeaveFormDialog from "./LeaveFormDialog";
import DataLossWarningDialog from "./DataLossWarningDialog";
export {
ChangeEmailDialog,
@ -21,5 +21,5 @@ export {
SendInviteDialog,
ChangeUserStatusDialog,
ChangeUserTypeDialog,
LeaveFormDialog,
DataLossWarningDialog,
};

View File

@ -25,7 +25,7 @@ import {
import {
setFilter,
updateProfileInUsers,
setIsVisibleModalLeave,
setIsVisibleDataLossDialog,
setIsEditingForm,
} from "../../../../../store/people/actions";
import {
@ -41,7 +41,7 @@ import RadioField from "./FormFields/RadioField";
import DepartmentField from "./FormFields/DepartmentField";
import ContactsField from "./FormFields/ContactsField";
import InfoFieldContainer from "./FormFields/InfoFieldContainer";
import { LeaveFormDialog } from "../../../../dialogs";
import { DataLossWarningDialog } from "../../../../dialogs";
import { api, toastr } from "asc-web-common";
const { createThumbnailsAvatar, loadAvatar } = api.people;
@ -289,10 +289,10 @@ class CreateUserForm extends React.Component {
}
onCancelHandler() {
const { editingForm, setIsVisibleModalLeave } = this.props;
const { editingForm, setIsVisibleDataLossDialog } = this.props;
if (editingForm.isEdit) {
setIsVisibleModalLeave(true);
setIsVisibleDataLossDialog(true);
} else {
this.onCancel();
}
@ -404,7 +404,7 @@ class CreateUserForm extends React.Component {
return (
<>
<MainContainer>
<LeaveFormDialog onContinue={this.onCancel} />
<DataLossWarningDialog onContinue={this.onCancel} />
<AvatarContainer>
<Avatar
size="max"
@ -638,6 +638,6 @@ export default connect(mapStateToProps, {
updateCreatedAvatar,
setFilter,
updateProfileInUsers,
setIsVisibleModalLeave,
setIsVisibleDataLossDialog,
setIsEditingForm,
})(withRouter(withTranslation()(CreateUserForm)));

View File

@ -27,7 +27,7 @@ import {
import {
setFilter,
updateProfileInUsers,
setIsVisibleModalLeave,
setIsVisibleDataLossDialog,
setIsEditingForm,
} from "../../../../../store/people/actions";
import {
@ -43,7 +43,7 @@ import DepartmentField from "./FormFields/DepartmentField";
import ContactsField from "./FormFields/ContactsField";
import InfoFieldContainer from "./FormFields/InfoFieldContainer";
import styled from "styled-components";
import { LeaveFormDialog } from "../../../../dialogs";
import { DataLossWarningDialog } from "../../../../dialogs";
import { api, toastr } from "asc-web-common";
import {
ChangeEmailDialog,
@ -257,10 +257,10 @@ class UpdateUserForm extends React.Component {
});
}
onCancelHandler() {
const { editingForm, setIsVisibleModalLeave } = this.props;
const { editingForm, setIsVisibleDataLossDialog } = this.props;
if (editingForm.isEdit) {
setIsVisibleModalLeave(true);
setIsVisibleDataLossDialog(true);
} else {
this.onCancel();
}
@ -561,7 +561,7 @@ class UpdateUserForm extends React.Component {
return (
<>
<MainContainer>
<LeaveFormDialog onContinue={this.onCancel} />
<DataLossWarningDialog onContinue={this.onCancel} />
<AvatarContainer>
<Avatar
size="max"
@ -838,7 +838,7 @@ export default connect(mapStateToProps, {
updateProfile,
fetchProfile,
updateProfileInUsers,
setIsVisibleModalLeave,
setIsVisibleDataLossDialog,
setIsEditingForm,
setFilter,
})(withRouter(withTranslation()(UpdateUserForm)));

View File

@ -7,7 +7,7 @@ import { Headline } from "asc-web-common";
import { useTranslation } from "react-i18next";
import {
setFilter,
setIsVisibleModalLeave,
setIsVisibleDataLossDialog,
} from "../../../../../store/people/actions";
const Wrapper = styled.div`
@ -35,7 +35,7 @@ const SectionHeaderContent = (props) => {
filter,
editingForm,
setFilter,
setIsVisibleModalLeave,
setIsVisibleDataLossDialog,
} = props;
const { userCaption, guestCaption } = settings.customNames;
const { type } = match.params;
@ -51,7 +51,7 @@ const SectionHeaderContent = (props) => {
const onClickBackHandler = () => {
if (editingForm.isEdit) {
setIsVisibleModalLeave(true, onClickBack);
setIsVisibleDataLossDialog(true, onClickBack);
} else {
onClickBack();
}
@ -87,6 +87,7 @@ function mapStateToProps(state) {
};
}
export default connect(mapStateToProps, { setFilter, setIsVisibleModalLeave })(
withRouter(SectionHeaderContent)
);
export default connect(mapStateToProps, {
setFilter,
setIsVisibleDataLossDialog,
})(withRouter(SectionHeaderContent));

View File

@ -26,7 +26,8 @@ export const SET_SELECTED = "SET_SELECTED";
export const SET_FILTER = "SET_FILTER";
export const SELECT_GROUP = "SELECT_GROUP";
export const SET_SELECTOR_USERS = "SET_SELECTOR_USERS";
export const SET_IS_VISIBLE_MODAL_LEAVE = "SET_IS_VISIBLE_MODAL_LEAVE";
export const SET_IS_VISIBLE_DATA_LOSS_DIALOG =
"SET_IS_VISIBLE_DATA_LOSS_DIALOG";
export const SET_IS_EDITING_FORM = "SET_IS_EDITING_FORM";
export function setUser(user) {
@ -143,9 +144,9 @@ export function setSelectorUsers(users) {
};
}
export function setIsVisibleModalLeave(isVisible, callback) {
export function setIsVisibleDataLossDialog(isVisible, callback) {
return {
type: SET_IS_VISIBLE_MODAL_LEAVE,
type: SET_IS_VISIBLE_DATA_LOSS_DIALOG,
isVisible,
callback,
};

View File

@ -9,7 +9,7 @@ import {
SELECT_GROUP,
SET_USER,
SET_SELECTOR_USERS,
SET_IS_VISIBLE_MODAL_LEAVE,
SET_IS_VISIBLE_DATA_LOSS_DIALOG,
SET_IS_EDITING_FORM,
} from "./actions";
import { isUserSelected, skipUser, getUsersBySelected } from "./selectors";
@ -28,7 +28,7 @@ const initialState = {
},
editingForm: {
isEdit: false,
isVisibleModalLeave: false,
isVisibleDataLossDialog: false,
},
};
@ -83,11 +83,11 @@ const peopleReducer = (state = initialState, action) => {
users: action.users,
}),
});
case SET_IS_VISIBLE_MODAL_LEAVE:
case SET_IS_VISIBLE_DATA_LOSS_DIALOG:
return Object.assign({}, state, {
editingForm: {
...state.editingForm,
isVisibleModalLeave: action.isVisible,
isVisibleDataLossDialog: action.isVisible,
callback: action.callback,
},
});