Add submit logic

packages/strapi-plugin-content-manager/admin/src/containers/Main/index.js

@@ -13,7 +13,7 @@ import reducer from './reducer';
 import saga from './saga';
 import makeSelectMain from './selectors';
 
-function Main({ isLoading }) {
+function Main({ isLoading, emitEvent }) {
   strapi.useInjectReducer({ key: 'main', reducer, pluginId });
   strapi.useInjectSaga({ key: 'main', saga, pluginId });
 
@@ -21,17 +21,22 @@ function Main({ isLoading }) {
     return <LoadingIndicatorPage />;
   }
 
+  const renderRoute = props => (
+    <SettingsView emitEvent={emitEvent} {...props} />
+  );
+
   return (
     <Switch>
       <Route
         path="/plugins/content-manager/ctm-configurations/:type"
-        component={SettingsView}
+        render={renderRoute}
       />
     </Switch>
   );
 }
 
 Main.propTypes = {
+  emitEvent: PropTypes.func.isRequired,
   isLoading: PropTypes.bool.isRequired,
 };
 

packages/strapi-plugin-content-manager/admin/src/containers/SettingsView/actions.js

@@ -1,4 +1,11 @@
-import { GET_DATA, GET_DATA_SUCCEEDED, ON_CHANGE } from './constants';
+import {
+  GET_DATA,
+  GET_DATA_SUCCEEDED,
+  ON_CHANGE,
+  ON_RESET,
+  ON_SUBMIT,
+  SUBMIT_SUCCEEDED,
+} from './constants';
 
 export function getData() {
   return {
@@ -22,3 +29,21 @@ export function onChange({ target: { name, value } }) {
     value,
   };
 }
+
+export function onReset() {
+  return {
+    type: ON_RESET,
+  };
+}
+
+export function onSubmit() {
+  return {
+    type: ON_SUBMIT,
+  };
+}
+
+export function submitSucceeded() {
+  return {
+    type: SUBMIT_SUCCEEDED,
+  };
+}

packages/strapi-plugin-content-manager/admin/src/containers/SettingsView/constants.js

@@ -2,3 +2,6 @@ export const GET_DATA = 'ContentManager/SettingsView/GET_DATA';
 export const GET_DATA_SUCCEEDED =
   'ContentManager/SettingsView/GET_DATA_SUCCEEDED';
 export const ON_CHANGE = 'ContentManager/SettingsView/ON_CHANGE';
+export const ON_RESET = 'ContentManager/SettingsView/ON_RESET';
+export const ON_SUBMIT = 'ContentManager/SettingsView/ON_SUBMIT';
+export const SUBMIT_SUCCEEDED = 'ContentManager/SettingsView/SUBMIT_SUCCEEDED';

packages/strapi-plugin-content-manager/admin/src/containers/SettingsView/index.js

@@ -1,4 +1,4 @@
-import React, { memo, useEffect } from 'react';
+import React, { memo, useEffect, useState } from 'react';
 import PropTypes from 'prop-types';
 import { connect } from 'react-redux';
 import { bindActionCreators, compose } from 'redux';
@@ -8,6 +8,7 @@ import {
   InputsIndex as Input,
   LoadingIndicatorPage,
   PluginHeader,
+  PopUpWarning,
 } from 'strapi-helper-plugin';
 
 import pluginId from '../../pluginId';
@@ -16,7 +17,7 @@ import Container from '../../components/Container';
 import Block from '../../components/Block';
 import Row from './Row';
 
-import { getData, onChange } from './actions';
+import { getData, onChange, onReset, onSubmit } from './actions';
 import reducer from './reducer';
 import saga from './saga';
 import makeSelectSettingView from './selectors';
@@ -29,10 +30,23 @@ function SettingsView({
   isLoading,
   modifiedData,
   onChange,
+  onReset,
+  onSubmit,
+  shouldToggleModalSubmit,
 }) {
   strapi.useInjectReducer({ key: 'settingsView', reducer, pluginId });
   strapi.useInjectSaga({ key: 'settingsView', saga, pluginId });
+  const [showWarningCancel, setWarningOpen] = useState(false);
+  const [showWarningSubmit, setWarningSubmitOpen] = useState(false);
+  const toggleWarningCancel = () => setWarningOpen(prevState => !prevState);
+  const toggleWarningSubmit = () =>
+    setWarningSubmitOpen(prevState => !prevState);
 
+  useEffect(() => {
+    if (showWarningSubmit) {
+      toggleWarningSubmit();
+    }
+  }, [shouldToggleModalSubmit]);
   useEffect(() => {
     if (isEmpty(initialData)) {
       getData();
@@ -50,13 +64,13 @@ function SettingsView({
           id: 'cancelChanges',
           label: 'content-manager.popUpWarning.button.cancel',
           kind: 'secondary',
-          onClick: () => {},
+          onClick: toggleWarningCancel,
           type: 'button',
         },
         {
           kind: 'primary',
           label: 'content-manager.containers.Edit.submit',
-          onClick: () => {},
+          onClick: toggleWarningSubmit,
           type: 'submit',
         },
       ];
@@ -74,6 +88,33 @@ function SettingsView({
           id: 'content-manager.containers.SettingsPage.pluginHeaderDescription',
         }}
       />
+      <PopUpWarning
+        isOpen={showWarningSubmit}
+        toggleModal={toggleWarningSubmit}
+        content={{
+          title: 'content-manager.popUpWarning.title',
+          message: 'content-manager.popUpWarning.warning.updateAllSettings',
+          cancel: 'content-manager.popUpWarning.button.cancel',
+          confirm: 'content-manager.popUpWarning.button.confirm',
+        }}
+        popUpWarningType="danger"
+        onConfirm={() => onSubmit()}
+      />
+      <PopUpWarning
+        isOpen={showWarningCancel}
+        toggleModal={toggleWarningCancel}
+        content={{
+          title: 'content-manager.popUpWarning.title',
+          message: 'content-manager.popUpWarning.warning.cancelAllSettings',
+          cancel: 'content-manager.popUpWarning.button.cancel',
+          confirm: 'content-manager.popUpWarning.button.confirm',
+        }}
+        popUpWarningType="danger"
+        onConfirm={() => {
+          onReset();
+          toggleWarningCancel();
+        }}
+      />
       <Row className="row">
         <Block
           description="content-manager.containers.SettingsPage.Block.generalSettings.description"
@@ -103,6 +144,9 @@ SettingsView.propTypes = {
   isLoading: PropTypes.bool.isRequired,
   modifiedData: PropTypes.object.isRequired,
   onChange: PropTypes.func.isRequired,
+  onReset: PropTypes.func.isRequired,
+  onSubmit: PropTypes.func.isRequired,
+  shouldToggleModalSubmit: PropTypes.bool.isRequired,
 };
 
 const mapStateToProps = makeSelectSettingView();
@@ -112,6 +156,8 @@ export function mapDispatchToProps(dispatch) {
     {
       getData,
       onChange,
+      onReset,
+      onSubmit,
     },
     dispatch
   );

packages/strapi-plugin-content-manager/admin/src/containers/SettingsView/reducer.js

@@ -4,7 +4,12 @@
  */
 
 import { fromJS, List, Map } from 'immutable';
-import { GET_DATA_SUCCEEDED, ON_CHANGE } from './constants';
+import {
+  GET_DATA_SUCCEEDED,
+  ON_CHANGE,
+  ON_RESET,
+  SUBMIT_SUCCEEDED,
+} from './constants';
 
 export const initialState = fromJS({
   initialData: Map({}),
@@ -12,6 +17,7 @@ export const initialState = fromJS({
   groups: List([]),
   models: List([]),
   isLoading: true,
+  shouldToggleModalSubmit: true,
 });
 
 function settingsViewReducer(state = initialState, action) {
@@ -25,6 +31,12 @@ function settingsViewReducer(state = initialState, action) {
         .update('isLoading', () => false);
     case ON_CHANGE:
       return state.updateIn(['modifiedData', action.name], () => action.value);
+    case ON_RESET:
+      return state.update('modifiedData', () => state.get('initialData'));
+    case SUBMIT_SUCCEEDED:
+      return state
+        .update('initialData', () => state.get('modifiedData'))
+        .update('shouldToggleModalSubmit', v => !v);
     default:
       return state;
   }

packages/strapi-plugin-content-manager/admin/src/containers/SettingsView/saga.js

@@ -1,10 +1,11 @@
-import { all, fork, put, call, takeLatest } from 'redux-saga/effects';
+import { all, fork, put, call, takeLatest, select } from 'redux-saga/effects';
 import { request } from 'strapi-helper-plugin';
 
 import pluginId from '../../pluginId';
 
-import { getDataSucceeded } from './actions';
+import { getDataSucceeded, submitSucceeded } from './actions';
-import { GET_DATA } from './constants';
+import { GET_DATA, ON_SUBMIT } from './constants';
+import { makeSelectModifiedData } from './selectors';
 
 const getRequestUrl = path => `/${pluginId}/${path}`;
 
@@ -18,13 +19,31 @@ export function* getData() {
 
     yield put(getDataSucceeded(generalSettings, groups, models));
   } catch (err) {
-    console.log(err);
+    strapi.notification.error('content-manager.error.model.fetch');
+  }
+}
+
+export function* submit() {
+  try {
+    const body = yield select(makeSelectModifiedData());
+
+    yield call(request, getRequestUrl('fixtures/general-settings'), {
+      method: 'PUT',
+      body,
+    });
+
+    yield put(submitSucceeded());
+  } catch (err) {
+    strapi.notification.error('notification.error');
   }
 }
 
 function* defaultSaga() {
   try {
-    yield all([fork(takeLatest, GET_DATA, getData)]);
+    yield all([
+      fork(takeLatest, GET_DATA, getData),
+      fork(takeLatest, ON_SUBMIT, submit),
+    ]);
   } catch (err) {
     // Do nothing
   }

packages/strapi-plugin-content-manager/admin/src/containers/SettingsView/selectors.js

@@ -24,5 +24,12 @@ const makeSelectSettingView = () =>
     }
   );
 
+const makeSelectModifiedData = () =>
+  createSelector(
+    settingViewDomain(),
+    substate => {
+      return substate.get('modifiedData').toJS();
+    }
+  );
 export default makeSelectSettingView;
-export { settingViewDomain };
+export { settingViewDomain, makeSelectModifiedData };

packages/strapi-plugin-content-manager/config/routes.json

@@ -16,6 +16,14 @@
         "policies": []
       }
     },
+    {
+      "method": "PUT",
+      "path": "/fixtures/general-settings",
+      "handler": "ContentManagerFixtures.updateGeneralSettings",
+      "config": {
+        "policies": []
+      }
+    },
     {
       "method": "GET",
       "path": "/fixtures/groups",

packages/strapi-plugin-content-manager/controllers/ContentManagerFixtures.js

@@ -47,4 +47,8 @@ module.exports = {
 
     ctx.body = { models };
   },
+
+  updateGeneralSettings: ctx => {
+    ctx.body = { ok: true };
+  },
 };