ModuleWrapper.jsx 4.56 KB
Newer Older
1
/* eslint-disable react/jsx-curly-newline */
Florent Chehab's avatar
Florent Chehab committed
2
import React, { useCallback } from "react";
3
import PropTypes from "prop-types";
4

5
import Paper from "@material-ui/core/Paper";
Florent Chehab's avatar
Florent Chehab committed
6
import { makeStyles } from "@material-ui/styles";
7
8
9
import ModuleTitle from "./subComponents/ModuleTitle";
import ModuleFirstRow from "./subComponents/ModuleFirstRow";
import UsefulLinks from "./subComponents/UsefulLinks";
Florent Chehab's avatar
Florent Chehab committed
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
import AlertService from "../../../../services/AlertService";
import useEditor from "../../../../hooks/useEditor";
import FormInfo from "../../../../utils/editionRelated/FormInfo";
import FullScreenDialogService from "../../../../services/FullScreenDialogService";
import History from "../../../edition/History";
import PendingModeration from "../../../edition/PendingModeration";

const useStyles = makeStyles(theme => ({
  root: {
    flexGrow: 1,
    padding: theme.spacing(1)
    // marginBottom: theme.spacing(2)
  }
}));

function alertThereIsSomethingPendingModeration(
  openPendingModeration,
  openEditor
) {
  AlertService.open({
    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) {
        openPendingModeration();
      } else {
        openEditor(true);
      }
    },
    multilineButtons: true
  });
}

// TODO clean render methods
49

Florent Chehab's avatar
Florent Chehab committed
50
/**
51
52
 * Wrapper around modules to handle in a standard way the edition/moderation/history version;
 * displaying of certain attributes, etc.
Florent Chehab's avatar
Florent Chehab committed
53
 */
Florent Chehab's avatar
Florent Chehab committed
54
55
56
57
58
59
60
61
62
63
64
65
66
function ModuleWrapper({
  formInfo,
  rawModelData,
  onSave,
  buildTitle,
  CoreComponent,
  Icon
}) {
  const classes = useStyles();

  const openEditorTmp = useEditor(formInfo, (somethingWasSaved = false) => {
    if (somethingWasSaved) {
      onSave();
67
    }
Florent Chehab's avatar
Florent Chehab committed
68
  });
69

Florent Chehab's avatar
Florent Chehab committed
70
  function renderCore(modelData) {
71
72
    return (
      <>
Florent Chehab's avatar
Florent Chehab committed
73
74
        <CoreComponent rawModelData={modelData} />
        <UsefulLinks usefulLinks={modelData.useful_links} />
75
76
77
      </>
    );
  }
Florent Chehab's avatar
Florent Chehab committed
78

Florent Chehab's avatar
Florent Chehab committed
79
80
81
  function renderTitle(modelData) {
    return <ModuleTitle rawModelData={modelData} buildTitle={buildTitle} />;
  }
82

Florent Chehab's avatar
Florent Chehab committed
83
84
85
86
87
88
89
90
91
92
93
94
  const openHistory = useCallback(() => {
    FullScreenDialogService.openDialog(
      <History
        modelInfo={{
          contentTypeId: rawModelData.content_type_id,
          id: rawModelData.id
        }}
        editFromVersion={openEditorTmp}
        rawModelDataEx={rawModelData}
        renderCore={renderCore}
        renderTitle={renderTitle}
      />
95
    );
Florent Chehab's avatar
Florent Chehab committed
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
  }, [rawModelData, openEditorTmp]);

  const openPendingModeration = useCallback(() => {
    FullScreenDialogService.openDialog(
      <PendingModeration
        renderTitle={renderTitle}
        renderCore={renderCore}
        modelInfo={{
          contentTypeId: rawModelData.content_type_id,
          id: rawModelData.id
        }}
        editFromPendingModeration={openEditorTmp}
        userCanModerate={rawModelData.obj_info.user_can_moderate}
      />
    );
  }, [rawModelData, openEditorTmp]);
112
113

  /**
Florent Chehab's avatar
Florent Chehab committed
114
115
   * Function to open the editor panels.
   * It also checks that there is no model pending moderation
116
   *
Florent Chehab's avatar
Florent Chehab committed
117
   * @param {boolean} [ignorePendingModeration=false]
118
   */
Florent Chehab's avatar
Florent Chehab committed
119
120
121
122
123
124
125
126
127
  const openEditor = useCallback(
    (ignorePendingModeration = false) => {
      if (ignorePendingModeration || !rawModelData.has_pending_moderation) {
        openEditorTmp(rawModelData);
      } else {
        alertThereIsSomethingPendingModeration(
          openPendingModeration,
          openEditor
        );
128
      }
Florent Chehab's avatar
Florent Chehab committed
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
    },
    [rawModelData]
  );

  return (
    <>
      <Paper className={classes.root} square>
        <ModuleFirstRow
          editCurrent={openEditor}
          openHistoryPanel={openHistory}
          openPendingModerationPanel={openPendingModeration}
          rawModelData={rawModelData}
          buildTitle={buildTitle}
          Icon={Icon}
        />
        {renderCore(rawModelData)}
      </Paper>
    </>
  );
Florent Chehab's avatar
Florent Chehab committed
148
149
}

150
ModuleWrapper.propTypes = {
Florent Chehab's avatar
Florent Chehab committed
151
  formInfo: PropTypes.instanceOf(FormInfo).isRequired,
Florent Chehab's avatar
Florent Chehab committed
152
  rawModelData: PropTypes.object.isRequired,
153
  buildTitle: PropTypes.func,
Florent Chehab's avatar
Florent Chehab committed
154
  CoreComponent: PropTypes.func.isRequired,
155
  Icon: PropTypes.object,
Florent Chehab's avatar
Florent Chehab committed
156
  onSave: PropTypes.func
Florent Chehab's avatar
Florent Chehab committed
157
158
};

Florent Chehab's avatar
Florent Chehab committed
159
160
161
162
163
ModuleWrapper.defaultProps = {
  buildTitle: () => null,
  onSave: () => {},
  Icon: undefined
};
Florent Chehab's avatar
Florent Chehab committed
164

Florent Chehab's avatar
Florent Chehab committed
165
export default ModuleWrapper;