Skip to content

Commit a743a1d

Browse files
bahossbahoss
committed
refactor: Split React components into logical and representational
Fix php-coder#1405
1 parent d29390e commit a743a1d

File tree

6 files changed

+131
-42
lines changed

6 files changed

+131
-42
lines changed

‎src/main/frontend/src/components/AddCatalogNumbersForm.js

Lines changed: 26 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -84,13 +84,31 @@ class AddCatalogNumbersForm extends React.PureComponent {
8484
});
8585
}
8686
render() {
87-
const hasValidationErrors = this.state.validationErrors.length > 0;
87+
return (
88+
<AddCatalogNumbersFormView
89+
l10n={this.props.l10n}
90+
handleSubmit={this.handleSubmit}
91+
hasServerError={this.state.hasServerError}
92+
handleChangeCatalog={this.handleChangeCatalog}
93+
handleChangeNumbers={this.handleChangeNumbers}
94+
validationErrors={this.state.validationErrors}
95+
isDisabled={this.state.isDisabled}
96+
/>
97+
);
98+
}
99+
}
100+
101+
class AddCatalogNumbersFormView extends React.PureComponent {
102+
render() {
103+
const {handleSubmit, hasServerError, handleChangeCatalog, handleChangeNumbers, validationErrors, isDisabled} = this.props;
104+
const hasValidationErrors = validationErrors.length > 0;
105+
88106
return (
89107
<div className="col-sm-12 form-group">
90-
<form className={`form-horizontal ${hasValidationErrors ? 'has-error' : ''}`} onSubmit={this.handleSubmit}>
108+
<form className={ `form-horizontal ${hasValidationErrors ? 'has-error' : ''}` } onSubmit={ handleSubmit }>
91109
<div
92110
id="add-catalog-numbers-failed-msg"
93-
className={`alert alert-danger text-center col-sm-8 col-sm-offset-2 ${this.state.hasServerError ? '' : 'hidden'}`}>
111+
className={ `alert alert-danger text-center col-sm-8 col-sm-offset-2 ${hasServerError ? '' : 'hidden'}` }>
94112
{ this.props.l10n['t_server_error'] || 'Server error' }
95113
</div>
96114
<div className="form-group form-group-sm">
@@ -102,7 +120,7 @@ class AddCatalogNumbersForm extends React.PureComponent {
102120
id="catalog-name"
103121
name="catalogName"
104122
className="form-control"
105-
onChange={this.handleChangeCatalog}>
123+
onChange={ handleChangeCatalog }>
106124
<option value="michel">
107125
{ this.props.l10n['t_michel'] || 'Michel' }
108126
</option>
@@ -136,25 +154,25 @@ class AddCatalogNumbersForm extends React.PureComponent {
136154
className="form-control"
137155
size="5"
138156
required="required"
139-
onChange={ this.handleChangeNumbers } />
157+
onChange={ handleChangeNumbers } />
140158
</div>
141159
</div>
142160
</div>
143161
<div className="col-sm-offset-3 col-sm-4">
144162
<span
145163
id="catalog-numbers.errors"
146164
className={`help-block ${hasValidationErrors ? '' : 'hidden'}`}>
147-
{ this.state.validationErrors.join(', ') }
165+
{ validationErrors.join(', ') }
148166
</span>
149167
<button
150168
type="submit"
151169
className="btn btn-primary btn-sm"
152-
disabled={ this.state.isDisabled }>
170+
disabled={ isDisabled }>
153171
{ this.props.l10n['t_add'] || 'Add' }
154172
</button>
155173
</div>
156174
</form>
157175
</div>
158176
);
159177
}
160-
}
178+
}

‎src/main/frontend/src/components/AddCatalogPriceForm.js

Lines changed: 30 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -100,15 +100,35 @@ class AddCatalogPriceForm extends React.PureComponent {
100100
});
101101
}
102102
render() {
103-
const hasValidationErrors = this.state.validationErrors.length > 0;
104-
const [currencySymbol, currencyName] = this.getCurrencyByCatalogName(this.state.catalog);
105-
103+
104+
return (
105+
<AddCatalogPriceFormView
106+
l10n={this.props.l10n}
107+
handleSubmit={this.handleSubmit}
108+
hasServerError={this.state.hasServerError}
109+
handleChangeCatalog={this.handleChangeCatalog}
110+
catalog={this.state.catalog}
111+
getCurrencyByCatalogName={this.getCurrencyByCatalogName}
112+
handleChangePrice={this.handleChangePrice}
113+
validationErrors={this.state.validationErrors}
114+
isDisabled={this.state.isDisabled}
115+
/>
116+
);
117+
}
118+
}
119+
120+
class AddCatalogPriceFormView extends React.PureComponent {
121+
render() {
122+
const {handleSubmit, hasServerError, handleChangeCatalog, handleChangePrice, validationErrors, isDisabled, catalog, getCurrencyByCatalogName} = this.props;
123+
const hasValidationErrors = validationErrors.length > 0;
124+
const [currencySymbol, currencyName] = getCurrencyByCatalogName(catalog);
125+
106126
return (
107127
<div className="col-sm-12 form-group">
108-
<form className={`form-horizontal ${hasValidationErrors ? 'has-error' : ''}`} onSubmit={this.handleSubmit}>
128+
<form className={ `form-horizontal ${hasValidationErrors ? 'has-error' : ''}` } onSubmit={ handleSubmit }>
109129
<div
110130
id="add-catalog-price-failed-msg"
111-
className={`alert alert-danger text-center col-sm-8 col-sm-offset-2 ${this.state.hasServerError ? '' : 'hidden'}`}>
131+
className={`alert alert-danger text-center col-sm-8 col-sm-offset-2 ${hasServerError ? '' : 'hidden'}`}>
112132
{ this.props.l10n['t_server_error'] || 'Server error' }
113133
</div>
114134
<div className="form-group form-group-sm">
@@ -120,7 +140,7 @@ class AddCatalogPriceForm extends React.PureComponent {
120140
id="catalog-name"
121141
name="catalogName"
122142
className="form-control"
123-
onChange={this.handleChangeCatalog}>
143+
onChange={ handleChangeCatalog }>
124144
<option value="michel">
125145
{ this.props.l10n['t_michel'] || 'Michel' }
126146
</option>
@@ -156,25 +176,25 @@ class AddCatalogPriceForm extends React.PureComponent {
156176
size="5"
157177
title={ currencyName }
158178
required="required"
159-
onChange={ this.handleChangePrice }/>
179+
onChange={ handleChangePrice }/>
160180
</div>
161181
</div>
162182
</div>
163183
<div className="col-sm-offset-3 col-sm-4">
164184
<span
165185
id="catalog-price.errors"
166186
className={`help-block ${hasValidationErrors ? '' : 'hidden'}`}>
167-
{ this.state.validationErrors.join(', ') }
187+
{ validationErrors.join(', ') }
168188
</span>
169189
<button
170190
type="submit"
171191
className="btn btn-primary btn-sm"
172-
disabled={ this.state.isDisabled }>
192+
disabled={ isDisabled }>
173193
{ this.props.l10n['t_add'] || 'Add' }
174194
</button>
175195
</div>
176196
</form>
177197
</div>
178198
);
179199
}
180-
}
200+
}

‎src/main/frontend/src/components/AddCommentForm.js

Lines changed: 23 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -73,13 +73,29 @@ class AddCommentForm extends React.PureComponent {
7373
});
7474
}
7575
render() {
76-
const hasValidationErrors = this.state.validationErrors.length > 0;
76+
return (
77+
<AddCommentFormView
78+
l10n={this.props.l10n}
79+
handleSubmit={this.handleSubmit}
80+
hasServerError={this.state.hasServerError}
81+
handleChange={this.handleChange}
82+
validationErrors={this.state.validationErrors}
83+
isDisabled={this.state.isDisabled}
84+
/>
85+
);
86+
}
87+
}
88+
89+
class AddCommentFormView extends React.PureComponent {
90+
render() {
91+
const {handleSubmit, hasServerError, handleChange, validationErrors, isDisabled} = this.props;
92+
const hasValidationErrors = validationErrors.length > 0;
7793
return (
7894
<div className="col-sm-12 form-group">
79-
<form className={`form-horizontal ${hasValidationErrors ? 'has-error' : ''}`} onSubmit={this.handleSubmit}>
95+
<form className={`form-horizontal ${hasValidationErrors ? 'has-error' : ''}`} onSubmit={ handleSubmit }>
8096
<div
8197
id="add-comment-failed-msg"
82-
className={`alert alert-danger text-center col-sm-8 col-sm-offset-2 ${this.state.hasServerError ? '' : 'hidden'}`}>
98+
className={ `alert alert-danger text-center col-sm-8 col-sm-offset-2 ${hasServerError ? '' : 'hidden'}` }>
8399
{ this.props.l10n['t_server_error'] || 'Server error' }
84100
</div>
85101
<div className="form-group form-group-sm">
@@ -93,25 +109,25 @@ class AddCommentForm extends React.PureComponent {
93109
cols="22"
94110
rows="3"
95111
required="required"
96-
onChange={this.handleChange}>
112+
onChange={ handleChange }>
97113
</textarea>
98114
</div>
99115
</div>
100116
<div className="col-sm-offset-3 col-sm-4">
101117
<span
102118
id="comment.errors"
103119
className={`help-block ${hasValidationErrors ? '' : 'hidden'}`}>
104-
{ this.state.validationErrors.join(', ') }
120+
{ validationErrors.join(', ') }
105121
</span>
106122
<button
107123
type="submit"
108124
className="btn btn-primary btn-sm"
109-
disabled={ this.state.isDisabled }>
125+
disabled={ isDisabled }>
110126
{ this.props.l10n['t_add'] || 'Add' }
111127
</button>
112128
</div>
113129
</form>
114130
</div>
115131
);
116132
}
117-
}
133+
}

‎src/main/frontend/src/components/AddReleaseYearForm.js

Lines changed: 25 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -85,13 +85,31 @@ class AddReleaseYearForm extends React.PureComponent {
8585
this.props.sinceYear,
8686
this.props.tillYear
8787
);
88-
const hasValidationErrors = this.state.validationErrors.length > 0;
88+
89+
return (
90+
<AddReleaseYearFormView
91+
l10n={this.props.l10n}
92+
handleSubmit={this.handleSubmit}
93+
hasServerError={this.state.hasServerError}
94+
handleChange={this.handleChange}
95+
rangeOfYears={rangeOfYears}
96+
validationErrors={this.state.validationErrors}
97+
isDisabled={this.state.isDisabled}
98+
/>
99+
);
100+
}
101+
}
102+
103+
class AddReleaseYearFormView extends React.PureComponent {
104+
render() {
105+
const {handleSubmit, hasServerError, handleChange, rangeOfYears, validationErrors, isDisabled} = this.props;
106+
const hasValidationErrors = validationErrors.length > 0;
89107
return (
90108
<div className="col-sm-12 form-group">
91-
<form className={`form-horizontal ${hasValidationErrors ? 'has-error' : ''}`} onSubmit={this.handleSubmit}>
109+
<form className={ `form-horizontal ${hasValidationErrors ? 'has-error' : ''}` } onSubmit={ handleSubmit }>
92110
<div
93111
id="add-release-year-failed-msg"
94-
className={`alert alert-danger text-center col-sm-8 col-sm-offset-2 ${ this.state.hasServerError ? '' : 'hidden' }`}>
112+
className={ `alert alert-danger text-center col-sm-8 col-sm-offset-2 ${hasServerError ? '' : 'hidden' }` }>
95113
{ this.props.l10n['t_server_error'] || 'Server error' }
96114
</div>
97115
<div className="form-group form-group-sm">
@@ -104,7 +122,7 @@ class AddReleaseYearForm extends React.PureComponent {
104122
name="release-year"
105123
className="form-control"
106124
required="required"
107-
onChange={this.handleChange}>
125+
onChange={ handleChange }>
108126
<option value=""></option>
109127
{rangeOfYears.map(year => (
110128
<option key={year.toString()} value={year}>
@@ -118,17 +136,17 @@ class AddReleaseYearForm extends React.PureComponent {
118136
<span
119137
id="release-year.errors"
120138
className={`help-block ${hasValidationErrors ? '' : 'hidden'}`}>
121-
{ this.state.validationErrors.join(', ') }
139+
{ validationErrors.join(', ') }
122140
</span>
123141
<button
124142
type="submit"
125143
className="btn btn-primary btn-sm"
126-
disabled={ this.state.isDisabled }>
144+
disabled={ isDisabled }>
127145
{ this.props.l10n['t_add'] || 'Add' }
128146
</button>
129147
</div>
130148
</form>
131149
</div>
132150
);
133151
}
134-
}
152+
}

‎src/main/frontend/src/components/SeriesSaleImportForm.js

Lines changed: 26 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -94,7 +94,24 @@ class SeriesSaleImportForm extends React.PureComponent {
9494
}
9595

9696
render() {
97-
const hasValidationErrors = this.state.validationErrors.length > 0;
97+
return (
98+
<SeriesSaleImportFormView
99+
l10n={this.props.l10n}
100+
hasServerError={this.state.hasServerError}
101+
handleSubmit={this.handleSubmit}
102+
url={this.state.url}
103+
handleChange={this.handleChange}
104+
isDisabled={this.state.isDisabled}
105+
validationErrors={this.state.validationErrors}
106+
/>
107+
)
108+
}
109+
}
110+
111+
class SeriesSaleImportFormView extends React.PureComponent {
112+
render() {
113+
const { hasServerError, handleSubmit, url, handleChange, isDisabled, validationErrors} = this.props;
114+
const hasValidationErrors = validationErrors.length > 0;
98115

99116
return (
100117
<div className="row">
@@ -108,15 +125,15 @@ class SeriesSaleImportForm extends React.PureComponent {
108125
</div>
109126
<div className="row">
110127
<div id="import-series-sale-failed-msg"
111-
className={`alert alert-danger text-center col-sm-8 col-sm-offset-2 ${this.state.hasServerError ? '' : 'hidden'}`}>
128+
className={ `alert alert-danger text-center col-sm-8 col-sm-offset-2 ${hasServerError ? '' : 'hidden'}` }>
112129
{ this.props.l10n['t_could_not_import_info'] || 'Could not import information from this page' }
113130
</div>
114131
</div>
115132
<div className="row">
116133
<div className="col-sm-12">
117134
<form id="import-series-sale-form"
118135
className={`form-horizontal ${hasValidationErrors ? 'has-error' : ''}`}
119-
onSubmit={this.handleSubmit}>
136+
onSubmit={ handleSubmit }>
120137

121138
<div className="form-group form-group-sm">
122139
<label htmlFor="series-sale-url" className="control-label col-sm-3">
@@ -129,12 +146,12 @@ class SeriesSaleImportForm extends React.PureComponent {
129146
type="url"
130147
className="form-control"
131148
required="required"
132-
value={this.state.url}
133-
onChange={this.handleChange}
134-
disabled={this.state.isDisabled} />
149+
value={ url }
150+
onChange={ handleChange }
151+
disabled={ isDisabled } />
135152
<span id="series-sale-url.errors"
136153
className={`help-block ${hasValidationErrors ? '' : 'hidden'}`}>
137-
{ this.state.validationErrors.join(', ') }
154+
{ validationErrors.join(', ') }
138155
</span>
139156
</div>
140157
</div>
@@ -143,7 +160,7 @@ class SeriesSaleImportForm extends React.PureComponent {
143160
<div className="col-sm-offset-3 col-sm-4">
144161
<button type="submit"
145162
className="btn btn-primary btn-sm"
146-
disabled={this.state.isDisabled}>
163+
disabled={ isDisabled }>
147164
{ this.props.l10n['t_import_info'] || 'Import info' }
148165
</button>
149166
</div>
@@ -156,4 +173,4 @@ class SeriesSaleImportForm extends React.PureComponent {
156173
</div>
157174
)
158175
}
159-
}
176+
}

‎src/main/java/ru/mystamps/web/feature/site/ResourceUrl.java

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,7 @@ public final class ResourceUrl {
3232
public static final String STATIC_RESOURCES_URL = "https://stamps.filezz.ru";
3333

3434
// MUST be updated when any of our resources were modified
35-
public static final String RESOURCES_VERSION = "v0.4.3.7";
35+
public static final String RESOURCES_VERSION = "v0.4.3.8";
3636

3737
// CheckStyle: ignore LineLength for next 15 lines
3838
private static final String CATALOG_UTILS_JS = "/public/js/" + RESOURCES_VERSION + "/CatalogUtils.min.js";

0 commit comments

Comments
 (0)