Commit 7e66e534 authored by Florent Chehab's avatar Florent Chehab

Alert when trying to edit and there is an alement pending moderation

parent 19b1cd5e
......@@ -12,6 +12,7 @@ import green from '@material-ui/core/colors/green';
import MyComponent from '../../MyComponent';
import isModerationRequired from '../../../utils/isModerationRequired';
import Alert from './editors/Alert';
import {
serverModerationStatusFetchData,
......@@ -81,16 +82,44 @@ class GenericModule extends MyComponent {
pendingModerationOpen: false,
rawModelDataForEditor: this.props.rawModelData,
forceSave: false,
alert: { open: false }
};
handleOpenEditor = () => {
this.setState({ editorOpen: true });
handleOpenEditor = (force = false) => {
if (force || this.props.rawModelData.pending_moderation.length == 0) {
this.setState({ editorOpen: true });
} else {
this.setState({
alert: {
open: true,
info: false,
title: "Une version est en attente de modération",
description: "Vous vous apprêter à éditer le module tel qu'il est présenté sur la page principale. Toutefois, il conseillé d'éditer le module à partir de la version en attente de modération car cette dernière sera écrasée par votre contribution.",
agreeText: "Ok, je vais voir la version en attente de modération",
disagreeText: "Je ne veux pas me baser sur le travail en attente de modération",
handleResponse: (agree) => {
if (agree) {
this.handleOpenPendingModeration();
} else {
this.handleOpenEditor(true);
}
},
multilineButtons: true,
}
})
}
};
handleCloseEditor = () => {
this.setState({ editorOpen: false, dataToSave: null });
};
handleCloseAlert = () => {
this.setState({ alert: { open: false } })
}
handleCloseHistory = () => {
this.setState({ historyOpen: false });
};
......@@ -107,6 +136,8 @@ class GenericModule extends MyComponent {
this.setState({ pendingModerationOpen: false });
}
handleEditPendingModeration = (rawModelData) => {
this.setState({
rawModelDataForEditor: rawModelData,
......@@ -170,6 +201,10 @@ class GenericModule extends MyComponent {
return (
<div>
<Alert
{...this.state.alert}
handleClose={this.handleCloseAlert}
/>
<this.props.editor
open={this.state.editorOpen}
handleCloseEditor={this.handleCloseEditor}
......
......@@ -7,36 +7,66 @@ import DialogContent from '@material-ui/core/DialogContent';
import DialogContentText from '@material-ui/core/DialogContentText';
import DialogTitle from '@material-ui/core/DialogTitle';
import withStyles from '@material-ui/core/styles/withStyles';
import compose from 'recompose/compose';
const styles = theme => ({
multilineButton: {
display: 'block',
marginLeft: 'auto',
marginRight: 'auto',
},
button: {}
})
class Alert extends React.Component {
render() {
const { classes } = this.props;
return (
<Dialog
open={this.props.open}
>
<DialogTitle>{this.props.title}</DialogTitle>
<DialogContent>
<DialogContentText style={{whiteSpace: 'pre-wrap'}}>
{this.props.description}
</DialogContentText>
</DialogContent>
<DialogActions>
{
this.props.info ?
<Button onClick={() => { this.props.handleClose(); this.props.handleResponse() }} color="primary">
{this.props.infoText}
</Button>
:
<div>
<Button onClick={() => { this.props.handleClose(); this.props.handleResponse(false) }} color="primary">
{this.props.disagreeText}
</Button>
<Button onClick={() => { this.props.handleClose(); this.props.handleResponse(true) }} color="primary" autoFocus>
{this.props.agreeText}
</Button>
</div>
}
</DialogActions>
{
this.props.open ?
<div>
<DialogTitle>{this.props.title}</DialogTitle>
<DialogContent>
<DialogContentText style={{ whiteSpace: 'pre-wrap' }}>
{this.props.description}
</DialogContentText>
</DialogContent>
<DialogActions>
{
this.props.info ?
<Button onClick={() => { this.props.handleClose(); this.props.handleResponse() }} color="primary">
{this.props.infoText}
</Button>
:
<div>
<Button
onClick={() => { this.props.handleClose(); this.props.handleResponse(false) }}
color='secondary'
className={this.props.multilineButtons ? classes.multilineButton : classes.button}
>
{this.props.disagreeText}
</Button>
<Button
onClick={() => { this.props.handleClose(); this.props.handleResponse(true) }}
className={this.props.multilineButtons ? classes.multilineButton : classes.button}
variant='outlined'
color="primary"
autoFocus
>
{this.props.agreeText}
</Button>
</div>
}
</DialogActions>
</div>
:
<div></div>
}
</Dialog >
);
}
......@@ -50,6 +80,7 @@ Alert.defaultProps = {
agreeText: "OK",
disagreeText: "Annuler",
infoText: "J'ai compris",
multilineButtons: false,
handleClose: () => { Console.log("Missing function for closing alert.") },
handleResponse: () => { Console.log("Missing function for handling post close.") }
}
......@@ -64,7 +95,10 @@ Alert.propTypes = {
description: PropTypes.string,
handleClose: PropTypes.func.isRequired,
handleResponse: PropTypes.func.isRequired,
multilineButtons: PropTypes.bool.isRequired,
};
export default Alert;
\ No newline at end of file
export default compose(
withStyles(styles, { withTheme: true }),
)(Alert);
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment