Made EditGroup prettier

This commit is contained in:
Philipp Czora
2018-08-06 17:04:33 +02:00
parent 9f6466eaa5
commit 7549a31065

View File

@@ -2,11 +2,11 @@
import React from "react"; import React from "react";
import { connect } from "react-redux"; import { connect } from "react-redux";
import GroupForm from "../components/GroupForm"; import GroupForm from "../components/GroupForm";
import { modifyGroup, fetchGroup } from "../modules/groups" import { modifyGroup, fetchGroup } from "../modules/groups";
import type { History } from "history"; import type { History } from "history";
import { withRouter } from "react-router-dom"; import { withRouter } from "react-router-dom";
import type { Group } from "../types/Group" import type { Group } from "../types/Group";
import { isModifyGroupPending, getModifyGroupFailure } from "../modules/groups" import { isModifyGroupPending, getModifyGroupFailure } from "../modules/groups";
import ErrorNotification from "../../components/ErrorNotification"; import ErrorNotification from "../../components/ErrorNotification";
type Props = { type Props = {
@@ -20,39 +20,47 @@ type Props = {
class EditGroup extends React.Component<Props> { class EditGroup extends React.Component<Props> {
groupModified = (group: Group) => () => { groupModified = (group: Group) => () => {
this.props.fetchGroup(group.name) this.props.fetchGroup(group.name);
this.props.history.push(`/group/${group.name}`) this.props.history.push(`/group/${group.name}`);
} };
modifyGroup = (group: Group) => { modifyGroup = (group: Group) => {
this.props.modifyGroup(group, this.groupModified(group)); this.props.modifyGroup(group, this.groupModified(group));
} };
render() { render() {
const { group, loading, error } = this.props; const { group, loading, error } = this.props;
return <div> return (
<ErrorNotification error={error} /> <div>
<GroupForm group={group} submitForm={(group) =>{this.modifyGroup(group)}} loading={loading}/> <ErrorNotification error={error} />
</div> <GroupForm
group={group}
submitForm={group => {
this.modifyGroup(group);
}}
loading={loading}
/>
</div>
);
} }
} }
const mapStateToProps = (state, ownProps) => { const mapStateToProps = (state, ownProps) => {
const loading = isModifyGroupPending(state, ownProps.group.name) const loading = isModifyGroupPending(state, ownProps.group.name);
const error = getModifyGroupFailure(state, ownProps.group.name) const error = getModifyGroupFailure(state, ownProps.group.name);
return { return {
loading, loading,
error error
}; };
}; };
const mapDispatchToProps = (dispatch) => { const mapDispatchToProps = dispatch => {
return { return {
modifyGroup: (group: Group, callback?: () => void) => { modifyGroup: (group: Group, callback?: () => void) => {
dispatch(modifyGroup(group, callback)) dispatch(modifyGroup(group, callback));
}, },
fetchGroup: (name: string) => { fetchGroup: (name: string) => {
dispatch(fetchGroup(name)) dispatch(fetchGroup(name));
} }
}; };
}; };