From ba32c4fd0dd89ba7a8e51647ee563fe9852eb771 Mon Sep 17 00:00:00 2001 From: vjrj Date: Sun, 18 Feb 2018 17:00:54 +0100 Subject: [PATCH] Feedback button --- imports/startup/server/feedback.js | 25 ++++ imports/startup/server/index.js | 1 + imports/ui/components/Feedback/Feedback.js | 120 +++++++++++++++++++ imports/ui/components/Feedback/Feedback.scss | 71 +++++++++++ imports/ui/layouts/App/App.js | 4 +- public/locales/en/common.json | 10 +- public/locales/es/common.json | 10 +- 7 files changed, 238 insertions(+), 3 deletions(-) create mode 100644 imports/startup/server/feedback.js create mode 100644 imports/ui/components/Feedback/Feedback.js create mode 100644 imports/ui/components/Feedback/Feedback.scss diff --git a/imports/startup/server/feedback.js b/imports/startup/server/feedback.js new file mode 100644 index 0000000..98ebaca --- /dev/null +++ b/imports/startup/server/feedback.js @@ -0,0 +1,25 @@ +/* eslint-disable prefer-arrow-callback */ +/* eslint-disable import/no-absolute-path */ + +import { Meteor } from 'meteor/meteor'; +import i18n from 'i18next'; +import { check } from 'meteor/check'; +import sendEmail from '/imports/startup/server/email'; + +Meteor.methods({ + 'send-feedback': function sendFeedback(email, feedback) { + check(email, String); + check(feedback, String); + const appName = i18n.t('AppName'); + sendEmail({ + to: 'info@comunes.org', + from: `${appName} `, + subject: `Feedback de ${email}!`, + sendAt: new Date(), + text: `Feedback de ${email}\n\n${feedback}`, + html: `

${feedback}

`, + template: '{{appName}}

{{{subject}}}

{{{html}}}', + appName + }, true); + } +}); diff --git a/imports/startup/server/index.js b/imports/startup/server/index.js index 6db3588..101d249 100644 --- a/imports/startup/server/index.js +++ b/imports/startup/server/index.js @@ -12,3 +12,4 @@ import '../common/comments'; import './sitemaps'; import './subsUnion'; import './prerender'; +import './feedback'; diff --git a/imports/ui/components/Feedback/Feedback.js b/imports/ui/components/Feedback/Feedback.js new file mode 100644 index 0000000..af2f845 --- /dev/null +++ b/imports/ui/components/Feedback/Feedback.js @@ -0,0 +1,120 @@ +/* eslint-disable react/jsx-indent-props */ +/* eslint-disable import/no-absolute-path */ +/* eslint-disable import/no-absolute-path */ + +import React, { Component } from 'react'; +import PropTypes from 'prop-types'; +import { Meteor } from 'meteor/meteor'; +import { translate } from 'react-i18next'; +import { FormGroup, Button, FormControl } from 'react-bootstrap'; +import { Bert } from 'meteor/themeteorchef:bert'; +import validate from '../../../modules/validate'; + +import './Feedback.scss'; + +class Feedback extends Component { + constructor(props) { + super(props); + this.t = props.t; + this.handleSubmit = this.handleSubmit.bind(this); + this.onTabClick = this.onTabClick.bind(this); + } + + componentDidMount() { + const component = this; + + validate(component.form, { + rules: { + email: { + required: true, + email: true + }, + feedbackText: { + required: true + } + }, + messages: { + feedbackText: { + required: this.t('Por favor, escribe aquí tu feedback...') + }, + email: { + required: this.t('Tu correo'), + email: this.t('¿Es correcto este correo?') + } + }, + submitHandler() { component.handleSubmit(); } + }); + } + + onTabClick() { + $('#feedback-form').toggle('slide'); + } + + handleSubmit() { + const email = this.email.value.trim(); + const feedbackText = this.feedbackText.value.trim(); + + Meteor.call('send-feedback', email, feedbackText, (error) => { + if (error) { + Bert.alert(error.reason, 'danger'); + } else { + this.form.reset(); + Bert.alert('Feedback recibido, gracias...', 'success'); + this.onTabClick(); + } + }); + } + + render() { + return ( +
+
(this.formdiv = formdiv)} style={{ display: 'none' }} className="card"> +
(this.form = form)} + className="form card-body" + onSubmit={event => event.preventDefault()} + > + + (this.email = email)} + placeholder={this.t('Tu correo')} + type="email" + /> + + +