diff --git a/src/components/modals/feedback/Feedback.jsx b/src/components/modals/feedback/Feedback.jsx index 967549e9..fbbe3b9d 100644 --- a/src/components/modals/feedback/Feedback.jsx +++ b/src/components/modals/feedback/Feedback.jsx @@ -2,24 +2,93 @@ import React from 'react'; import './feedback.scss'; -export default function FeedbackModal(props) { - return ( -
-

{props.language.modals.feedback.title}

- × - -

- -

- -

- -

- -

- -


- -
- ); +export default class FeedbackModal extends React.PureComponent { + constructor() { + super(); + this.state = { + questionone: 5, + questionthree: 5, + questiontwoerror: '', + questionfourerror: '', + formsubmit: '' + }; + } + + async submitForm () { + let questiontwoerror, questionfourerror; + + if (document.getElementById('questiontwo').value.length <= 0) { + questiontwoerror = 'Question box must be filled'; + } + + if (document.getElementById('questionfour').value.length <= 0) { + questionfourerror = 'Question box must be filled'; + } + + if (questiontwoerror || questionfourerror) { + this.setState({ + questiontwoerror: questiontwoerror, + questionfourerror: questionfourerror + }); + } else { + this.setState({ + questiontwoerror: '', + questionfourerror: '' + }); + + await fetch(window.constants.FEEDBACK_FORM, { + 'method': 'POST' + }); + + this.setState({ + formsubmit: 'Sent successfully!' + }); + + setTimeout(() => { + this.props.modalClose(); + }, 3000); + } + } + + render() { + const { feedback } = window.language.modals; + + return ( +
+

{feedback.title}

+ × + <> + + <> + +

+ + this.setState({ questionone: e.target.value })}/> + + +

+ <> + +