mirror of
https://github.com/strapi/strapi.git
synced 2025-09-06 15:22:59 +00:00
Add submit logic
This commit is contained in:
parent
2b5cc4c405
commit
cf19cb0960
@ -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,
|
||||
};
|
||||
|
||||
|
@ -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,
|
||||
};
|
||||
}
|
||||
|
@ -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';
|
||||
|
@ -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
|
||||
);
|
||||
|
@ -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;
|
||||
}
|
||||
|
@ -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 { GET_DATA } from './constants';
|
||||
import { getDataSucceeded, submitSucceeded } from './actions';
|
||||
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
|
||||
}
|
||||
|
@ -24,5 +24,12 @@ const makeSelectSettingView = () =>
|
||||
}
|
||||
);
|
||||
|
||||
const makeSelectModifiedData = () =>
|
||||
createSelector(
|
||||
settingViewDomain(),
|
||||
substate => {
|
||||
return substate.get('modifiedData').toJS();
|
||||
}
|
||||
);
|
||||
export default makeSelectSettingView;
|
||||
export { settingViewDomain };
|
||||
export { settingViewDomain, makeSelectModifiedData };
|
||||
|
@ -16,6 +16,14 @@
|
||||
"policies": []
|
||||
}
|
||||
},
|
||||
{
|
||||
"method": "PUT",
|
||||
"path": "/fixtures/general-settings",
|
||||
"handler": "ContentManagerFixtures.updateGeneralSettings",
|
||||
"config": {
|
||||
"policies": []
|
||||
}
|
||||
},
|
||||
{
|
||||
"method": "GET",
|
||||
"path": "/fixtures/groups",
|
||||
|
@ -47,4 +47,8 @@ module.exports = {
|
||||
|
||||
ctx.body = { models };
|
||||
},
|
||||
|
||||
updateGeneralSettings: ctx => {
|
||||
ctx.body = { ok: true };
|
||||
},
|
||||
};
|
||||
|
Loading…
x
Reference in New Issue
Block a user