comunes/todos-contra-el-fuego-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Refactor Feedback

Browse source
This commit is contained in:
vjrj 2018-03-03 11:26:19 +01:00
parent 8b0577b46f
commit 83f5048ff8
1 changed files with 13 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

25
imports/ui/components/Feedback/Feedback.js
View file

@ -2,7 +2,7 @@
/* eslint-disable import/no-absolute-path */ /* eslint-disable import/no-absolute-path */
/* eslint-disable import/no-absolute-path */ /* eslint-disable import/no-absolute-path */
import React, { Component, Fragment } from 'react'; import React, { Component } from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import { Meteor } from 'meteor/meteor'; import { Meteor } from 'meteor/meteor';
import { translate } from 'react-i18next'; import { translate } from 'react-i18next';
@ -18,13 +18,13 @@ import './Feedback.scss';
class Feedback extends Component { class Feedback extends Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.t = props.t;
this.handleSubmit = this.handleSubmit.bind(this); this.handleSubmit = this.handleSubmit.bind(this);
this.onTabClick = this.onTabClick.bind(this); this.onTabClick = this.onTabClick.bind(this);
} }
componentDidMount() { componentDidMount() {
const component = this; const component = this;
const { t } = this.props;
validate(component.form, { validate(component.form, {
rules: { rules: {
@ -38,11 +38,11 @@ class Feedback extends Component {
}, },
messages: { messages: {
feedbackText: { feedbackText: {
required: this.t('Por favor, escribe aquí tu feedback...') required: t('Por favor, escribe aquí tu feedback...')
}, },
email: { email: {
required: this.t('Tu correo'), required: t('Tu correo'),
email: this.t('¿Es correcto este correo?') email: t('¿Es correcto este correo?')
} }
}, },
submitHandler() { component.handleSubmit(); } submitHandler() { component.handleSubmit(); }
@ -71,8 +71,9 @@ class Feedback extends Component {
render() { render() {
// console.log(`Render Feedback because isHome ${this.props.isHome}, email: '${this.props.emailAddress}'`); // console.log(`Render Feedback because isHome ${this.props.isHome}, email: '${this.props.emailAddress}'`);
const disabled = this.props.emailVerified && this.props.emailAddress; const disabled = this.props.emailVerified && this.props.emailAddress;
const { t } = this.props;
return ( return (
<Fragment> <div>
{ !this.props.isHome && { !this.props.isHome &&
<div id="feedback"> <div id="feedback">
<div id="feedback-form" ref={formdiv => (this.formdiv = formdiv)} style={{ display: 'none' }} className="card"> <div id="feedback-form" ref={formdiv => (this.formdiv = formdiv)} style={{ display: 'none' }} className="card">
@ -88,7 +89,7 @@ class Feedback extends Component {
name="email" name="email"
className="form-control" className="form-control"
ref={email => (this.email = email)} ref={email => (this.email = email)}
placeholder={this.t('Tu correo')} placeholder={t('Tu correo')}
key={disabled ? 'disabledEmail' : 'enabledEmail'} key={disabled ? 'disabledEmail' : 'enabledEmail'}
disabled={disabled} disabled={disabled}
defaultValue={disabled ? this.props.emailAddress : ''} defaultValue={disabled ? this.props.emailAddress : ''}
@ -103,13 +104,13 @@ class Feedback extends Component {
className="form-control" className="form-control"
name="feedbackText" name="feedbackText"
ref={feedbackText => (this.feedbackText = feedbackText)} ref={feedbackText => (this.feedbackText = feedbackText)}
placeholder={this.t('Por favor, escribe aquí tu feedback...')} placeholder={t('Por favor, escribe aquí tu feedback...')}
rows="6" rows="6"
/> />
<FormControl.Feedback /> <FormControl.Feedback />
</FormGroup> </FormGroup>
<Button type="submit" bsStyle="success" className="float-right" id={testId('sendFeedbackBtn')} > <Button type="submit" bsStyle="success" className="float-right" id={testId('sendFeedbackBtn')} >
{this.t('Enviar')} {t('Enviar')}
</Button> </Button>
</form> </form>
</div> </div>
@ -117,11 +118,11 @@ class Feedback extends Component {
id="feedback-tab" id="feedback-tab"
onClick={(event) => { this.onTabClick(event); }} onClick={(event) => { this.onTabClick(event); }}
> >
{this.t('Feedback')} {t('Feedback')}
</div> </div>
</div> </div>
} }
</Fragment> </div>
); );
} }
} }
@ -133,7 +134,7 @@ Feedback.propTypes = {
isHome: PropTypes.bool.isRequired isHome: PropTypes.bool.isRequired
}; };
export default translate([], { wait: true })(withTracker(props => ({ export default translate()(withTracker(props => ({
emailAddress: props.emailAddress, emailAddress: props.emailAddress,
emailVerified: props.emailVerified, emailVerified: props.emailVerified,
isHome: isHome() isHome: isHome()