Commit 83ecd677 authored by Florent Chehab's avatar Florent Chehab

Pending Moderation moved to new setup

parent 6d3d2c3a
import React from "react";
import React, { Component } from "react";
import { connect } from "react-redux";
import { openFullScreenDialog, closeFullScreenDialog } from "../../../actions/fullScreenDialog";
import PropTypes from "prop-types";
import withStyles from "@material-ui/core/styles/withStyles";
import compose from "recompose/compose";
import Button from "@material-ui/core/Button";
import Dialog from "@material-ui/core/Dialog";
import Paper from "@material-ui/core/Paper";
import AppBar from "@material-ui/core/AppBar";
import Toolbar from "@material-ui/core/Toolbar";
import IconButton from "@material-ui/core/IconButton";
import Typography from "@material-ui/core/Typography";
import CloseIcon from "@material-ui/icons/Close";
import Slide from "@material-ui/core/Slide";
import Divider from "@material-ui/core/Divider";
import editorStyle from "./editorStyle";
......@@ -30,21 +31,53 @@ const styles = theme => ({
}
});
function Transition(props) {
return <Slide direction="up" {...props} />;
}
class PendingModeration extends React.Component {
state = {
versionInView: 0
}
/**
* Class to handle models that are pending moderation.
*
* @class PendingModeration
* @extends {Component}
*/
class PendingModeration extends Component {
componentWillMount() {
// TODO REMOVE THIS
let tmp = _pick(this.props.factory, ["props", "renderCore", "renderTitle"]);
tmp = _omit(tmp, ["props.children"]);
this.newFactory = _cloneDeep(tmp);
}
/**
* Customization to handle opening the app full screen dialog when needed.
*
* @memberof PendingModeration
*/
componentDidUpdate(prevProps) {
if (this.props.open && !prevProps.open) { // a bit of rendering optimization
this.props.openFullScreenDialog(this.renderPendingModerationPanel());
}
}
/**
* Retrieve the raw model data from the pending moderation data
*
* @returns
* @memberof PendingModeration
*/
getRawModelDataFromPending() {
let rawModelData = Object.assign({}, this.props.factory.props.rawModelData.pending_moderation[0].new_object);
// we have to copy the original ID
rawModelData.id = this.newFactory.props.rawModelData.id;
return rawModelData;
}
/**
* Renders top of the panel
*
* @param {object} rawModelData
* @returns
* @memberof PendingModeration
*/
renderPendingModerationInfo(rawModelData) {
return (
<div>
......@@ -73,45 +106,51 @@ class PendingModeration extends React.Component {
);
}
renderPendingModeration() {
let rawModelData = this.props.factory.props.rawModelData.pending_moderation[0].new_object;
// we have to copy the original ID
rawModelData.id = this.newFactory.props.rawModelData.id;
/**
* Close the panel and make sure to update parent
*
* @memberof PendingModeration
*/
closePanel() {
this.props.handleClosePendingModeration();
this.props.closeFullScreenDialog();
}
/**
* Renders the panel content
*
* @returns
* @memberof PendingModeration
*/
renderPendingModerationPanel() {
const { classes } = this.props,
rawModelData = this.getRawModelDataFromPending();
return (
<div>
{this.renderPendingModerationInfo(rawModelData)}
<br></br>
{this.newFactory.renderTitle(rawModelData)}
{this.newFactory.renderCore(rawModelData)}
<AppBar className={classes.appBar} >
<Toolbar>
<IconButton color="inherit" onClick={() => this.closePanel()} aria-label="Close">
<CloseIcon />
</IconButton>
<Typography variant="h6" color="inherit" className={classes.flex}>
Version en attente de modération
</Typography>
</Toolbar>
</AppBar>
<Paper className={classes.paper}>
{this.renderPendingModerationInfo(rawModelData)}
<br></br>
{this.newFactory.renderTitle(rawModelData)}
{this.newFactory.renderCore(rawModelData)}
</Paper>
</div>
);
}
render() {
const { classes } = this.props;
return (
<div>
<Dialog
fullScreen
open={this.props.open}
TransitionComponent={Transition}
>
<AppBar className={classes.appBar} >
<Toolbar>
<IconButton color="inherit" onClick={() => { this.props.handleClosePendingModeration(); }} aria-label="Close">
<CloseIcon />
</IconButton>
<Typography variant="h6" color="inherit" className={classes.flex}>
Version en attente de modération
</Typography>
</Toolbar>
</AppBar>
<Paper className={classes.paper}>
{this.props.open ? this.renderPendingModeration() : <div></div>}
</Paper>
</Dialog>
</div>
);
return <div></div>;
}
}
......@@ -123,6 +162,8 @@ PendingModeration.propTypes = {
handleApproveModeration: PropTypes.func.isRequired,
open: PropTypes.bool.isRequired,
userCanModerate: PropTypes.bool.isRequired,
openFullScreenDialog: PropTypes.func.isRequired,
closeFullScreenDialog: PropTypes.func.isRequired,
};
PendingModeration.defaultProps = {
......@@ -131,7 +172,15 @@ PendingModeration.defaultProps = {
handleClosePendingModeration: () => console.error("Dev forgot something...")
};
const mapDispatchToProps = (dispatch) => {
return {
openFullScreenDialog: (innerNodes) => dispatch(openFullScreenDialog(innerNodes)),
closeFullScreenDialog: () => dispatch(closeFullScreenDialog()),
};
};
export default compose(
withStyles(styles, { withTheme: true }),
connect(() => Object(), mapDispatchToProps)
)(PendingModeration);
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