tyler.durden/opensupports
1
0
Fork 0
mirror of https://github.com/opensupports/opensupports.git synced 2025-07-29 00:34:35 +02:00
Code Issues Packages Projects Releases Wiki Activity

Sets loading state in form when an user edits a topic

Browse Source
This commit is contained in:
Maxi Redigonda 2018-03-22 12:10:07 -03:00
parent 23f9fb7833
commit bc5968126d
1 changed files with 13 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
client/src/app-components/topic-edit-modal.js
View File

@ -24,14 +24,15 @@ class TopicEditModal extends React.Component {
}; };
state = { state = {
values: this.props.defaultValues || {title: '', icon: 'address-card', color: '#ff6900'} values: this.props.defaultValues || {title: '', icon: 'address-card', color: '#ff6900'},
loading: false
}; };
render() { render() {
return ( return (
<div className="topic-edit-modal"> <div className="topic-edit-modal">
<Header title={i18n((this.props.addForm) ? 'ADD_TOPIC' : 'EDIT_TOPIC')} description={i18n((this.props.addForm) ? 'ADD_TOPIC_DESCRIPTION' : 'EDIT_TOPIC_DESCRIPTION')} /> <Header title={i18n((this.props.addForm) ? 'ADD_TOPIC' : 'EDIT_TOPIC')} description={i18n((this.props.addForm) ? 'ADD_TOPIC_DESCRIPTION' : 'EDIT_TOPIC_DESCRIPTION')} />
<Form values={this.state.values} onChange={this.onFormChange.bind(this)} onSubmit={this.onSubmit.bind(this)}> <Form values={this.state.values} onChange={this.onFormChange.bind(this)} onSubmit={this.onSubmit.bind(this)} loading={this.state.loading}>
<FormField name="title" label={i18n('TITLE')} fieldProps={{size: 'large'}} validation="TITLE" required /> <FormField name="title" label={i18n('TITLE')} fieldProps={{size: 'large'}} validation="TITLE" required />
<FormField name="icon" className="topic-edit-modal__icon" label={i18n('ICON')} decorator={IconSelector} /> <FormField name="icon" className="topic-edit-modal__icon" label={i18n('ICON')} decorator={IconSelector} />
<FormField name="color" className="topic-edit-modal__color" label={i18n('COLOR')} decorator={ColorSelector} /> <FormField name="color" className="topic-edit-modal__color" label={i18n('COLOR')} decorator={ColorSelector} />
@ -48,6 +49,10 @@ class TopicEditModal extends React.Component {
} }
onSubmit() { onSubmit() {
this.setState({
loading: true
});
API.call({ API.call({
path: (this.props.addForm) ? '/article/add-topic' : '/article/edit-topic', path: (this.props.addForm) ? '/article/add-topic' : '/article/edit-topic',
data: { data: {
@ -58,10 +63,14 @@ class TopicEditModal extends React.Component {
} }
}).then(() => { }).then(() => {
this.context.closeModal(); this.context.closeModal();
if(this.props.onChange) { if(this.props.onChange) {
this.props.onChange(); this.props.onChange();
} }
}).catch(() => {
this.setState({
loading: false
});
}); });
} }
@ -77,4 +86,4 @@ class TopicEditModal extends React.Component {
} }
} }
export default TopicEditModal; export default TopicEditModal;