From 3334c34da1867ce35669ac6d1fbb6acbfd9c8478 Mon Sep 17 00:00:00 2001 From: Aizizi Yigaimu Date: Sun, 3 May 2020 23:25:12 -0400 Subject: [PATCH 01/18] Add complete buttons to end pages --- src/Congrats.js | 2 ++ src/ThankYou.js | 25 ++++++++++++++----------- 2 files changed, 16 insertions(+), 11 deletions(-) diff --git a/src/Congrats.js b/src/Congrats.js index d90ad302b..035560e18 100644 --- a/src/Congrats.js +++ b/src/Congrats.js @@ -1,6 +1,7 @@ import React from "react"; import congrats from './utils/images/spot-results-congratulations.svg'; // with import import './index.css'; +import CompleteButtons from './CompleteButtons'; import ReactGA from 'react-ga'; export default class Congrats extends React.Component { @@ -48,6 +49,7 @@ export default class Congrats extends React.Component {
We'll send you an email to find a time to chat or you can call us at {process.env.REACT_APP_BLOCPOWER_CONTACT}.
+ ); diff --git a/src/ThankYou.js b/src/ThankYou.js index 7194812a6..a6836db4a 100644 --- a/src/ThankYou.js +++ b/src/ThankYou.js @@ -1,6 +1,8 @@ import React from "react"; +import { Button } from 'reactstrap'; import result from './utils/images/spot-results-more-info.svg'; // with import import './index.css'; +import CompleteButtons from './CompleteButtons'; import ReactGA from 'react-ga'; export default class ThankYou extends React.Component { @@ -16,27 +18,27 @@ export default class ThankYou extends React.Component { render() { // If building type is not single family (for NYC BIS) and for other surveys - var data = + var data =
Looks like we need more information to see if your building is a good fit for air source heat pumps. We'll send you an email to find a time to chat or you can {' '} - call us at {process.env.REACT_APP_BLOCPOWER_CONTACT}. + call us at {process.env.REACT_APP_BLOCPOWER_CONTACT}.
// If building type is single family and user has joined the waitlist if (this.props.singleFamily === true) { - data = + data = this.props.waitList === true ?
Thanks for joining our waitlist! We'll be in touch as soon as we expand our services!
- If you’d like to reach out to us in the meantime you can call us at {process.env.REACT_APP_BLOCPOWER_CONTACT}. + If you’d like to reach out to us in the meantime you can call us at {process.env.REACT_APP_BLOCPOWER_CONTACT}.
:
Sorry to see you go! Come back any time if you change your mind!
- } + } if (this.props.oakland === true ||this.props.milwaukee === true) { const email = this.props.milwaukee === true ? @@ -45,16 +47,16 @@ export default class ThankYou extends React.Component { const emailURL = this.props.milwaukee === true ? "mailto:welcome.milwaukee@blocpower.io": "mailto:welcome.oakland@blocpower.io" - data = + data =
Looks like we need more information to see what energy saving projects are a good fit for your building.
- We’ll send you an email to find a time to chat or you - can call us at {process.env.REACT_APP_BLOCPOWER_CONTACT} + We’ll send you an email to find a time to chat or you + can call us at {process.env.REACT_APP_BLOCPOWER_CONTACT} or email us at {email}. -
- } - + + } + const content = (
@@ -62,6 +64,7 @@ export default class ThankYou extends React.Component { Thank You!
{ data } + ); -- GitLab From 224aa47e78f0716734756735ebc5f8b1115b7075 Mon Sep 17 00:00:00 2001 From: Aizizi Yigaimu Date: Sun, 3 May 2020 23:27:04 -0400 Subject: [PATCH 02/18] Add complelete button component --- src/CompleteButtons.js | 38 ++++++++++++++++++++++++++++++++++++++ 1 file changed, 38 insertions(+) create mode 100644 src/CompleteButtons.js diff --git a/src/CompleteButtons.js b/src/CompleteButtons.js new file mode 100644 index 000000000..68dedc9e1 --- /dev/null +++ b/src/CompleteButtons.js @@ -0,0 +1,38 @@ +import React from "react"; +import { Row, Col, Button } from 'reactstrap'; +import './index.css'; + +export default class CompleteButtons extends React.Component { + addBuilding = () => { + console.log('yes'); + } + + closePage = () => { + window.close(); + } + + render() { + return ( +
+ + + + + + + + +
+ ); + } +} -- GitLab From b822157239a69888842c397878d96448637d8ae2 Mon Sep 17 00:00:00 2001 From: Aizizi Yigaimu Date: Mon, 4 May 2020 01:50:41 -0400 Subject: [PATCH 03/18] add anotherBuilding component --- src/AnotherBuilding.js | 328 +++++++++++++++++++++++++++++++++++++++++ src/App.css | 12 ++ src/App.js | 27 +++- src/CompleteButtons.js | 13 +- src/Congrats.js | 8 +- src/ThankYou.js | 8 +- 6 files changed, 390 insertions(+), 6 deletions(-) create mode 100644 src/AnotherBuilding.js diff --git a/src/AnotherBuilding.js b/src/AnotherBuilding.js new file mode 100644 index 000000000..e89ea14a2 --- /dev/null +++ b/src/AnotherBuilding.js @@ -0,0 +1,328 @@ +import React from "react"; +import { Row, Col, Button, Input, Modal, ModalHeader, ModalBody, ModalFooter } from 'reactstrap'; +import './index.css'; +import Geocoder from 'react-mapbox-gl-geocoder'; +import location from './utils/images/location.svg'; // with import +import jsonp from "jsonp"; +import ReactGA from 'react-ga'; + +const mapAccess = { + mapboxApiAccessToken: process.env.REACT_APP_MAPBOX_TOKEN +} + +const queryParams = { + country: 'us' +} + +export default class AnotherBuilding extends React.Component { + constructor(props) { + super(props); + this.state = { + viewport: {}, + addressFound: false, + answer: this.props.answer, + loadingAddressSearchBtn: false, + disabledAddressSearchBtn: true, + showModal: true, + form: { + FNAME: '', + LNAME: '', + EMAIL: '', + PHONE: '', + }, + subscribed: false, + }; + } + componentDidMount () { + let url = document.URL + let key = url.split('?')[1] + if(key !== undefined){ + let address = decodeURI(key).split('address=')[1] + if (address !== "undefined"){ + if (address.length !== 0){ + this.setState({ + answer: address, + addressFound: true, + }); + } + } + } + if(process.env.REACT_APP_ENVIRONMENT==='production'){ + ReactGA.pageview('/address-search'); + } + } + + handleOnSelected = (viewport, item) => { + this.setState({viewport}); + this.setState({ + answer: item.place_name, + addressFound: true, + }, () => { + this.validateEmptyInputs(); + }); + } + + validateEmptyInputs = () => { + this.state.answer.length > 0 ? + this.setState({ disabled: false }) : this.setState({ disabled: true }); + } + + nextQuestion = () => { + if(process.env.REACT_APP_ENVIRONMENT==='production'){ + ReactGA.event({ + category: "Intake Survey NYC", + action: "Clicked continue button", + label: "address-search" + }); + } + this.setState({ + loadingAddressSearchBtn: true, + disabledAddressSearchBtn: true, + showModal: true, + }); + this.props.nextQuestion('addressSearch', this.state.answer, this.state.answer); + } + + disableText = () => { + this.setState({ + addressFound: false , + loadingAddressSearchBtn: false, + disabledAddressSearchBtn: true, + }); + } + + validateContact() { + const emptyFields = []; + const invalidFields = []; + const errorMessage = []; + const validFirstName = /^[a-zA-Z ]{2,30}$/; + const validLastName = /^[a-zA-Z ]{2,30}$/; + const validEmail = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w+)+$/; + const validPhone = /^$|^\(?(\d{3})\)?[- ]?(\d{3})[- ]?(\d{4})$/; + + if (this.state.form.FNAME.toString().replace(/^\s+|\s+$/g, '') === '') { + emptyFields.push('First Name'); + } + if (this.state.form.LNAME.toString().replace(/^\s+|\s+$/g, '') === '') { + emptyFields.push('Last Name'); + } + if (this.state.form.EMAIL.toString().replace(/^\s+|\s+$/g, '') === '') { + emptyFields.push('Email address'); + } + if (emptyFields.length > 0) { + errorMessage.push(`Please fill in:\n${emptyFields.join('\n')}`); + alert(errorMessage); + return false; + } + if (this.state.form.PHONE.toString().replace(/^\s+|\s+$/g, '') !== '' && + !(validPhone.test(this.state.form.PHONE))) { + invalidFields.push('Phone number'); + } + if (!(validFirstName.test(this.state.form.FNAME))) { + invalidFields.push('First Name'); + } + if (!(validLastName.test(this.state.form.LNAME))) { + invalidFields.push('Last Name'); + } + if (!(validEmail.test(this.state.form.EMAIL))) { + invalidFields.push('Email address'); + } + if (invalidFields.length > 0) { + errorMessage.push(`\nInvalid input in:\n${invalidFields.join('\n')}`); + alert(errorMessage); + return false; + } + return true; + } + + handleInputChange = (event) => { + const val = event.target.value; + const name = event.target.name; + this.setState({ + form: { + ...this.state.form, + [name]: val, + }, + }); + } + + subscribe = () => { + if (this.validateContact() && process.env.NODE_ENV === 'production') { + const action = process.env.REACT_APP_MAILCHIMP_URL; + const fields = ['FNAME', 'LNAME', 'EMAIL', 'PHONE']; + const values = fields.map(field => { + return `${field}=${encodeURIComponent(this.state.form[field])}`; + }).join("&"); + const path = `${action}&${values}`; + const url = path.replace('/post?', '/post-json?'); + jsonp(url, { param: "c" }); + this.setState({ + subscribed: true, + }); + } + // If environment is not production close the form. + // Commenting out the below code because it closes the form on invalid inputs. + // else { + // this.setState({ + // showModal: false, + // }) + // } + } + + closeModal = () => { + this.setState({ + showModal: false, + }) + } + + render() { + let addressData = ""; + const {viewport} = this.state; + if(this.state.addressFound === false){ + addressData = ( + + ) + } + else { + addressData = ( + + ) + } + + let modalHeader = 'Oops, something is wrong'; + let modalBody = this.props.message; + let modalFooter = ( +
+ +
+ ); + + if (this.props.message === 'Sorry! Area not covered at the moment.') { + modalHeader = this.state.subscribed ? 'Congratulations!' : 'Sorry, we\'re not in your city yet!'; + modalBody = this.state.subscribed ? 'You have been successfully subscribed.' : ( +
+
+ We apologize, your area isn't covered by BlocPower yet, but we will get in touch once we introduce service there. +
+ + + this.handleInputChange(e)} + /> + + + this.handleInputChange(e)} + /> + + + + + this.handleInputChange(e)} + /> + + + + + this.handleInputChange(e)} + /> + + +
+ ); + modalFooter = this.state.subscribed ? ( +
+ +
+ ) : ( +
+ {' '} + +
+ ); + } + + let message = ( + + + {modalHeader} + + + {modalBody} + + + {modalFooter} + + + ); + + const content = ( +
+ {message} +
+ The next building I want to tell you about is at the same address (click the button below) + +
+
+
+ The next building I want to tell you about is at a new address (enter address below) +
+ + + + + + {addressData} + + +
+ + + Having trouble entering your address?
+ Please email us at support@blocpower.io + + + + +
+
+ ); + + return ( +
+ {content} +
+ ); + } +} diff --git a/src/App.css b/src/App.css index 42eef8fb0..ea210ab9f 100644 --- a/src/App.css +++ b/src/App.css @@ -244,6 +244,18 @@ width: 60%; } +.anotherBuildingExistBuilding { + margin-bottom: 8%; +} + +.anotherBuildingExistBuildingButton { + margin-top: 2%; +} + +.anotherBuildingNewBuildingNote { + margin-bottom: 15px; +} + @media (max-width: 1367px) { .main-content { padding: 300px 20% 4% 10%; diff --git a/src/App.js b/src/App.js index e88f1ed07..c49e5e514 100644 --- a/src/App.js +++ b/src/App.js @@ -33,6 +33,7 @@ import ChurchCoolingSystemAge from './ChurchCoolingSystemAge'; import ChurchBuildingType from './ChurchBuildingType'; import ChurchHoursPerWeek from './ChurchHoursPerWeek'; import OperationalSeasons from './OperationalSeasons'; +import AnotherBuilding from './AnotherBuilding'; import { questionTree } from './constants'; import { connect } from 'react-redux'; import { submitContact, submitAnswer, submitBuilding, submitQuestionnaire, submitUserAnswer } from './actions'; @@ -64,9 +65,11 @@ class App extends React.Component { waitList={false} oakland={false} milwaukee={false} + anotherBuilding={this.anotherBuilding} />, congrats: , }, multiFamilyAnswerId: 21, @@ -290,7 +293,8 @@ class App extends React.Component { 81: 'HelpFindingContractors', 82: 'AdviceOnEnergyWaterEfficiency', 83: 'HelpFinancingEnergyProject', - 33: 'other' }, + 33: 'other', + }, prev: 'buildingTypeSubType', next: 'buildingOperatingChallenges', }, @@ -705,6 +709,13 @@ class App extends React.Component { prev: 'buildingPastImprovement', next: '', }, + anotherBuilding: { + title: '', + answer: '', + value: '', + prev: 'anotherBuilding', + next: '', + }, order: [], }; } @@ -849,10 +860,17 @@ class App extends React.Component { this.setState({ buildingQualified: true}); this.state.pages.congrats = ; } } + anotherBuilding = () => { + this.setState({ + question: 'anotherBuilding', + }); + } + submitContact = (contact) => { this.setQuestion(this.state.questions['contact'].next); this.setState({ @@ -1187,6 +1205,13 @@ class App extends React.Component { nextQuestion={this.nextQuestion} questions={this.state.questions['buildingFutureImprovement'].questions} />, + anotherBuilding: , }; let content = ""; diff --git a/src/CompleteButtons.js b/src/CompleteButtons.js index 68dedc9e1..3397ab253 100644 --- a/src/CompleteButtons.js +++ b/src/CompleteButtons.js @@ -3,8 +3,15 @@ import { Row, Col, Button } from 'reactstrap'; import './index.css'; export default class CompleteButtons extends React.Component { - addBuilding = () => { - console.log('yes'); + anotherBuilding = () => { + // if(process.env.REACT_APP_ENVIRONMENT==='production'){ + // ReactGA.event({ + // category: "Intake Survey General", + // action: "Clicked continue button", + // label: "building-needs" + // }); + // } + this.props.anotherBuilding(); } closePage = () => { @@ -18,7 +25,7 @@ export default class CompleteButtons extends React.Component { diff --git a/src/Congrats.js b/src/Congrats.js index 035560e18..641033382 100644 --- a/src/Congrats.js +++ b/src/Congrats.js @@ -15,6 +15,10 @@ export default class Congrats extends React.Component { } } + anotherBuilding = () => { + this.props.anotherBuilding(); + } + render() { const items = [ 'Air source heat pumps use less energy than your current system', @@ -49,7 +53,9 @@ export default class Congrats extends React.Component {
We'll send you an email to find a time to chat or you can call us at {process.env.REACT_APP_BLOCPOWER_CONTACT}.
- + ); diff --git a/src/ThankYou.js b/src/ThankYou.js index a6836db4a..21cd793f1 100644 --- a/src/ThankYou.js +++ b/src/ThankYou.js @@ -16,6 +16,10 @@ export default class ThankYou extends React.Component { } } + anotherBuilding = () => { + this.props.anotherBuilding(); + } + render() { // If building type is not single family (for NYC BIS) and for other surveys var data = @@ -64,7 +68,9 @@ export default class ThankYou extends React.Component { Thank You! { data } - + ); -- GitLab From a180290ceec59b95a15bbe469356cfb3aa186f2a Mon Sep 17 00:00:00 2001 From: Aizizi Yigaimu Date: Mon, 4 May 2020 02:04:58 -0400 Subject: [PATCH 04/18] Populate address --- src/AnotherBuilding.js | 2 +- src/App.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/AnotherBuilding.js b/src/AnotherBuilding.js index e89ea14a2..e2150d3c4 100644 --- a/src/AnotherBuilding.js +++ b/src/AnotherBuilding.js @@ -283,7 +283,7 @@ export default class AnotherBuilding extends React.Component {
The next building I want to tell you about is at the same address (click the button below)
diff --git a/src/App.js b/src/App.js index c49e5e514..c4f797ac6 100644 --- a/src/App.js +++ b/src/App.js @@ -1210,7 +1210,7 @@ class App extends React.Component { success={addressSearchSuccess} loading={this.props.building.loading} nextQuestion={this.nextQuestion} - answer={this.state.questions['anotherBuilding'].value} + answer={this.state.questions['addressSearch'].value} />, }; -- GitLab From 8bba93d3c1cfba7bb2b30aaf2bbce4a7dce8b386 Mon Sep 17 00:00:00 2001 From: Aizizi Yigaimu Date: Mon, 4 May 2020 12:02:10 -0400 Subject: [PATCH 05/18] update new building search next component --- src/App.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/App.js b/src/App.js index c4f797ac6..8c158a17b 100644 --- a/src/App.js +++ b/src/App.js @@ -714,7 +714,7 @@ class App extends React.Component { answer: '', value: '', prev: 'anotherBuilding', - next: '', + next: 'churchBuildingType', }, order: [], }; -- GitLab From df68af0da2c86dfb0d5542593113a988afd7f74d Mon Sep 17 00:00:00 2001 From: Aizizi Yigaimu Date: Mon, 4 May 2020 15:10:48 -0400 Subject: [PATCH 06/18] Enable another building search --- src/AnotherBuilding.js | 16 ++++++++++++---- src/App.js | 22 +++++++++++++++++++--- 2 files changed, 31 insertions(+), 7 deletions(-) diff --git a/src/AnotherBuilding.js b/src/AnotherBuilding.js index e2150d3c4..5e6e1d86c 100644 --- a/src/AnotherBuilding.js +++ b/src/AnotherBuilding.js @@ -67,7 +67,11 @@ export default class AnotherBuilding extends React.Component { this.setState({ disabled: false }) : this.setState({ disabled: true }); } - nextQuestion = () => { + existAddressSubmitted = () => { + this.props.nextQuestion('anotherBuilding', this.props.answer, this.props.answer); + } + + newAddressSubmitted = () => { if(process.env.REACT_APP_ENVIRONMENT==='production'){ ReactGA.event({ category: "Intake Survey NYC", @@ -80,7 +84,7 @@ export default class AnotherBuilding extends React.Component { disabledAddressSearchBtn: true, showModal: true, }); - this.props.nextQuestion('addressSearch', this.state.answer, this.state.answer); + this.props.nextQuestion('anotherBuilding', this.state.answer, this.state.answer); } disableText = () => { @@ -282,7 +286,11 @@ export default class AnotherBuilding extends React.Component { {message}
The next building I want to tell you about is at the same address (click the button below) -
@@ -307,7 +315,7 @@ export default class AnotherBuilding extends React.Component {
} + let buttons = ''; + if (this.props.worshipBuilding === true) { + buttons = ( + + ); + } + const content = (
@@ -68,9 +77,7 @@ export default class ThankYou extends React.Component { Thank You!
{ data } - + { buttons } ); -- GitLab From 4647feae20635cf7e6a9c16f5673e52e3b7176a3 Mon Sep 17 00:00:00 2001 From: Aizizi Yigaimu Date: Mon, 4 May 2020 17:33:25 -0400 Subject: [PATCH 08/18] Fix nav issue --- src/App.js | 28 +++++++++++++--------------- 1 file changed, 13 insertions(+), 15 deletions(-) diff --git a/src/App.js b/src/App.js index 4da4802b6..c85e1bb0e 100644 --- a/src/App.js +++ b/src/App.js @@ -78,18 +78,6 @@ class App extends React.Component { }; } - componentWillReceiveProps(nextProps) { - if (this.props.building.data !== undefined && nextProps.building.data !== undefined) { - console.log(this.props.building.data); - console.log(nextProps.building.data); - if (this.props.building.data.buildingId !== nextProps.building.data.buildingId) { - this.setState({ anotherBuildingSubmitted: true }); - } else { - this.setState({ anotherBuildingSubmitted: false }); - } - } - } - resetQuestions = () => { return { addressSearch: { @@ -757,6 +745,10 @@ class App extends React.Component { questionAnswers[questions[question].id] = value; } + if (question === 'anotherBuilding') { + questions['churchBuildingType']['prev'] = 'anotherBuilding'; + } + const updatedOrder = questions.order.filter(item => item !== question); updatedOrder.push(question); questions.order = updatedOrder; @@ -766,6 +758,11 @@ class App extends React.Component { this.props.onSubmitBuilding({ address: this.state.questions[question].value, }); + if (question === 'anotherBuilding') { + this.setState({ anotherBuildingSubmitted: true }); + } else { + this.setState({ anotherBuildingSubmitted: false }); + } } else if (question === 'unitBreakdown' || question === 'feedback'){ this.setQuestion(this.state.questions[question].next); this.props.onSubmitUserAnswer({ @@ -915,6 +912,7 @@ class App extends React.Component { prevQuestion = (question) => { this.setQuestion(this.state.questions[question].prev); + this.setState({ anotherBuildingSubmitted: false }); } setQuestion = (question) => { @@ -945,6 +943,8 @@ class App extends React.Component { this.setState({ question, prevQuestion: Object.keys(this.state.questions).includes(question) ? this.state.questions[question].prev : '', + }, () => { + console.log(this.state.question); }); } @@ -1242,8 +1242,6 @@ class App extends React.Component { }; let content = ""; - console.log(this.props.building.data); - console.log(this.state.question); // TODO: In plain english what does this if statement mean if (this.props.building.data !== undefined && this.props.building.data.buildingId !== undefined && @@ -1252,7 +1250,7 @@ class App extends React.Component { content = questions['buildingTypes']; } else if (this.state.question === 'addressSearch' && [2,3].includes(this.props.building.data.surveyId)){ content = questions['buildingTypeSubType']; - } else if (this.state.anotherBuildingSubmitted === true) { + } else if (this.state.anotherBuildingSubmitted) { content = questions['churchBuildingType']; } else { content = questions[this.state.question]; -- GitLab From 7828beda509ac7fd9b3803811735263e27ff5dc1 Mon Sep 17 00:00:00 2001 From: Aizizi Yigaimu Date: Mon, 4 May 2020 19:29:59 -0400 Subject: [PATCH 09/18] Fix continue button frozen issue --- src/App.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/App.js b/src/App.js index c85e1bb0e..8b115e828 100644 --- a/src/App.js +++ b/src/App.js @@ -760,8 +760,6 @@ class App extends React.Component { }); if (question === 'anotherBuilding') { this.setState({ anotherBuildingSubmitted: true }); - } else { - this.setState({ anotherBuildingSubmitted: false }); } } else if (question === 'unitBreakdown' || question === 'feedback'){ this.setQuestion(this.state.questions[question].next); @@ -772,6 +770,7 @@ class App extends React.Component { buildingId: this.props.building.data.buildingId, userId: this.props.building.data.userId, }); + this.setState({ anotherBuildingSubmitted: false }); } else { this.setQuestion(this.state.questions[question].next); this.props.onSubmitAnswer({ @@ -781,6 +780,7 @@ class App extends React.Component { buildingId: this.props.building.data.buildingId, userId: this.props.building.data.userId, }); + this.setState({ anotherBuildingSubmitted: false }); } }); -- GitLab From ac240f633ecd7ac8451f8d735057f8a2f95e8b52 Mon Sep 17 00:00:00 2001 From: Aizizi Yigaimu Date: Tue, 5 May 2020 00:05:35 -0400 Subject: [PATCH 10/18] Remove console log --- src/App.js | 2 -- 1 file changed, 2 deletions(-) diff --git a/src/App.js b/src/App.js index 8b115e828..55aef6351 100644 --- a/src/App.js +++ b/src/App.js @@ -943,8 +943,6 @@ class App extends React.Component { this.setState({ question, prevQuestion: Object.keys(this.state.questions).includes(question) ? this.state.questions[question].prev : '', - }, () => { - console.log(this.state.question); }); } -- GitLab From 94206455d5d65df6077cc54f80ef77eca02185ed Mon Sep 17 00:00:00 2001 From: Aizizi Yigaimu Date: Tue, 5 May 2020 11:59:55 -0400 Subject: [PATCH 11/18] Remove not needed button import --- src/ThankYou.js | 1 - 1 file changed, 1 deletion(-) diff --git a/src/ThankYou.js b/src/ThankYou.js index b14c3d594..f87d0ef0b 100644 --- a/src/ThankYou.js +++ b/src/ThankYou.js @@ -1,5 +1,4 @@ import React from "react"; -import { Button } from 'reactstrap'; import result from './utils/images/spot-results-more-info.svg'; // with import import './index.css'; import CompleteButtons from './CompleteButtons'; -- GitLab From 36946557a69ecef2c0431195f8a9a6e56aca36cb Mon Sep 17 00:00:00 2001 From: Aizizi Yigaimu Date: Tue, 5 May 2020 13:35:26 -0400 Subject: [PATCH 12/18] Fix property logic issue --- src/App.js | 49 ++++++++++++------------------------------ src/CompleteButtons.js | 4 +++- 2 files changed, 17 insertions(+), 36 deletions(-) diff --git a/src/App.js b/src/App.js index 55aef6351..fc78d55ba 100644 --- a/src/App.js +++ b/src/App.js @@ -947,42 +947,21 @@ class App extends React.Component { } submit = () => { - // 20 is the id for single family building type - if (this.state.questions.buildingTypes.value === 20) { - this.state.pages.thankYou = ; - } + const isSingleFamily = this.state.questions.buildingTypes.value === 20 || this.state.questions.waitList.value === 1 ? true : false; + const isWorshipBuilding = this.state.questions.buildingTypes.value === 32 ? true : false; + const anotherBuilding = this.state.questions.buildingTypes.value === 32 ? this.anotherBuilding : null; + const isWaitList = this.state.questions.waitList.value === 1 ? true : false; + const isOakland = this.props.building.data.surveyId === 2 ? true : false; + const isMilwaukee = this.props.building.data.surveyId === 3 ? true : false; - // 32 is the id for worship building type - if (this.state.questions.buildingTypes.value === 32) { - this.state.pages.thankYou = ; - } - - // 1 - Yes & 2 - No for joining the waitlist - if(this.state.questions.waitList.value === 1) { - this.state.pages.thankYou = ; - } - - // Oakland Survey ID = 2 - if(this.props.building.data.surveyId === 2) { - this.state.pages.thankYou = ; - } - - // Milwaukee Survey ID = 3 - if(this.props.building.data.surveyId === 3) { - this.state.pages.thankYou = ; - } + this.state.pages.thankYou = ; this.setState({ submitted: true, diff --git a/src/CompleteButtons.js b/src/CompleteButtons.js index 3397ab253..3afc15b0b 100644 --- a/src/CompleteButtons.js +++ b/src/CompleteButtons.js @@ -15,7 +15,9 @@ export default class CompleteButtons extends React.Component { } closePage = () => { - window.close(); + console.log('clicked'); + const win = window.open("about:blank", "_self"); + win.close(); } render() { -- GitLab From 35a8172390e3adf275bf9401adf76b9c0f07c77a Mon Sep 17 00:00:00 2001 From: Aizizi Yigaimu Date: Tue, 5 May 2020 13:39:31 -0400 Subject: [PATCH 13/18] Fix close window button issue --- src/CompleteButtons.js | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/src/CompleteButtons.js b/src/CompleteButtons.js index 3afc15b0b..dd8581d2f 100644 --- a/src/CompleteButtons.js +++ b/src/CompleteButtons.js @@ -15,9 +15,8 @@ export default class CompleteButtons extends React.Component { } closePage = () => { - console.log('clicked'); - const win = window.open("about:blank", "_self"); - win.close(); + window.open('location', '_self', ''); + window.close(); } render() { -- GitLab From 9574decb25b4fa53f93e8b433cd7add6b1f4e085 Mon Sep 17 00:00:00 2001 From: Aizizi Yigaimu Date: Tue, 5 May 2020 15:11:12 -0400 Subject: [PATCH 14/18] Fix clear out answers for new loop --- src/App.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/src/App.js b/src/App.js index fc78d55ba..60cd31f57 100644 --- a/src/App.js +++ b/src/App.js @@ -882,7 +882,10 @@ class App extends React.Component { } anotherBuilding = () => { + const questions = this.resetQuestions(); + questions['addressSearch'].value = this.state.questions['addressSearch'].value; this.setState({ + questions, question: 'anotherBuilding', }); } -- GitLab From f3c631050402f58ebb18b13aa1fa69eff8707ce3 Mon Sep 17 00:00:00 2001 From: Aizizi Yigaimu Date: Tue, 5 May 2020 16:48:11 -0400 Subject: [PATCH 15/18] Limit questionnaire to 2 loops max --- src/App.js | 5 +++++ src/CompleteButtons.js | 3 +-- src/Congrats.js | 2 +- src/ThankYou.js | 2 +- 4 files changed, 8 insertions(+), 4 deletions(-) diff --git a/src/App.js b/src/App.js index 60cd31f57..65f14a421 100644 --- a/src/App.js +++ b/src/App.js @@ -75,6 +75,7 @@ class App extends React.Component { multiFamilyAnswerId: 21, miniSplitCheckBox: false, anotherBuildingSubmitted: false, + numOfLoops: 1, }; } @@ -871,12 +872,14 @@ class App extends React.Component { naturalGas={true} worshipBuilding={questions['buildingTypes']['value'] === 32} anotherBuilding={this.anotherBuilding} + numOfLoops={this.state.numOfLoops} />; } else { this.state.pages.congrats = ; } } @@ -887,6 +890,7 @@ class App extends React.Component { this.setState({ questions, question: 'anotherBuilding', + numOfLoops: this.state.numOfLoops+1, }); } @@ -964,6 +968,7 @@ class App extends React.Component { waitList={isWaitList} oakland={isOakland} milwaukee={isMilwaukee} + numOfLoops={this.state.numOfLoops} />; this.setState({ diff --git a/src/CompleteButtons.js b/src/CompleteButtons.js index dd8581d2f..d5524c744 100644 --- a/src/CompleteButtons.js +++ b/src/CompleteButtons.js @@ -15,8 +15,7 @@ export default class CompleteButtons extends React.Component { } closePage = () => { - window.open('location', '_self', ''); - window.close(); + window.open('location', '_self', '').close(); } render() { diff --git a/src/Congrats.js b/src/Congrats.js index 40aad92cf..3512f2200 100644 --- a/src/Congrats.js +++ b/src/Congrats.js @@ -37,7 +37,7 @@ export default class Congrats extends React.Component { let buttons = ''; - if (this.props.worshipBuilding === true) { + if (this.props.worshipBuilding === true && this.props.numOfLoops < 2) { buttons = ( Date: Tue, 5 May 2020 17:13:33 -0400 Subject: [PATCH 16/18] Submit builing type answer for second loop, keep worship state --- src/App.js | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/src/App.js b/src/App.js index 65f14a421..d2919fc97 100644 --- a/src/App.js +++ b/src/App.js @@ -761,6 +761,13 @@ class App extends React.Component { }); if (question === 'anotherBuilding') { this.setState({ anotherBuildingSubmitted: true }); + this.props.onSubmitAnswer({ + questionId: ["6"], + answerId: [32], + surveyId: this.props.building.data.surveyId, + buildingId: this.props.building.data.buildingId, + userId: this.props.building.data.userId, + }); } } else if (question === 'unitBreakdown' || question === 'feedback'){ this.setQuestion(this.state.questions[question].next); @@ -887,6 +894,7 @@ class App extends React.Component { anotherBuilding = () => { const questions = this.resetQuestions(); questions['addressSearch'].value = this.state.questions['addressSearch'].value; + questions['buildingTypes'].value = this.state.questions['buildingTypes'].value; this.setState({ questions, question: 'anotherBuilding', -- GitLab From 67b23b0b714f44e16e6873edc17a327e4dd77ae0 Mon Sep 17 00:00:00 2001 From: Aizizi Yigaimu Date: Wed, 6 May 2020 15:31:15 -0400 Subject: [PATCH 17/18] Fix loop limit issue, fix submit second loop questionnaire issue --- src/App.js | 7 ++----- src/Congrats.js | 2 +- src/ThankYou.js | 2 +- 3 files changed, 4 insertions(+), 7 deletions(-) diff --git a/src/App.js b/src/App.js index d2919fc97..8fec02773 100644 --- a/src/App.js +++ b/src/App.js @@ -75,7 +75,6 @@ class App extends React.Component { multiFamilyAnswerId: 21, miniSplitCheckBox: false, anotherBuildingSubmitted: false, - numOfLoops: 1, }; } @@ -879,26 +878,24 @@ class App extends React.Component { naturalGas={true} worshipBuilding={questions['buildingTypes']['value'] === 32} anotherBuilding={this.anotherBuilding} - numOfLoops={this.state.numOfLoops} />; } else { this.state.pages.congrats = ; } } anotherBuilding = () => { + // When user starts new loop of questionnaire, we reset all the answers const questions = this.resetQuestions(); questions['addressSearch'].value = this.state.questions['addressSearch'].value; questions['buildingTypes'].value = this.state.questions['buildingTypes'].value; this.setState({ questions, question: 'anotherBuilding', - numOfLoops: this.state.numOfLoops+1, }); } @@ -962,6 +959,7 @@ class App extends React.Component { } submit = () => { + // Assign property values for last pages (thankyou and congrats) const isSingleFamily = this.state.questions.buildingTypes.value === 20 || this.state.questions.waitList.value === 1 ? true : false; const isWorshipBuilding = this.state.questions.buildingTypes.value === 32 ? true : false; const anotherBuilding = this.state.questions.buildingTypes.value === 32 ? this.anotherBuilding : null; @@ -976,7 +974,6 @@ class App extends React.Component { waitList={isWaitList} oakland={isOakland} milwaukee={isMilwaukee} - numOfLoops={this.state.numOfLoops} />; this.setState({ diff --git a/src/Congrats.js b/src/Congrats.js index 3512f2200..40aad92cf 100644 --- a/src/Congrats.js +++ b/src/Congrats.js @@ -37,7 +37,7 @@ export default class Congrats extends React.Component { let buttons = ''; - if (this.props.worshipBuilding === true && this.props.numOfLoops < 2) { + if (this.props.worshipBuilding === true) { buttons = ( Date: Wed, 6 May 2020 16:13:26 -0400 Subject: [PATCH 18/18] Fix user ID issue for second loop questionnaire submission --- src/App.js | 23 ++++++++++++++++------- 1 file changed, 16 insertions(+), 7 deletions(-) diff --git a/src/App.js b/src/App.js index 8fec02773..49375cfc5 100644 --- a/src/App.js +++ b/src/App.js @@ -78,6 +78,21 @@ class App extends React.Component { }; } + componentWillReceiveProps(nextProps) { + // If user submitted another building search, use the new building object data + if (nextProps.building !== undefined && this.props.building !== undefined && + nextProps.building.data.userId !== this.props.building.data.userId && + this.state.anotherBuildingSubmitted === true) { + this.props.onSubmitAnswer({ + questionId: ["6"], + answerId: [32], + surveyId: nextProps.building.data.surveyId, + buildingId: nextProps.building.data.buildingId, + userId: nextProps.building.data.userId, + }); + } + } + resetQuestions = () => { return { addressSearch: { @@ -758,15 +773,9 @@ class App extends React.Component { this.props.onSubmitBuilding({ address: this.state.questions[question].value, }); + // If user clicks on 'continue' button on another building search page if (question === 'anotherBuilding') { this.setState({ anotherBuildingSubmitted: true }); - this.props.onSubmitAnswer({ - questionId: ["6"], - answerId: [32], - surveyId: this.props.building.data.surveyId, - buildingId: this.props.building.data.buildingId, - userId: this.props.building.data.userId, - }); } } else if (question === 'unitBreakdown' || question === 'feedback'){ this.setQuestion(this.state.questions[question].next); -- GitLab