diff --git a/src/AddressSearch.js b/src/AddressSearch.js index b28b0c2e6290d92dd9f99d27d37a961efee59d21..eed611c28858e9452567f846bf1da9aa8c564a96 100644 --- a/src/AddressSearch.js +++ b/src/AddressSearch.js @@ -70,7 +70,7 @@ export default class AddressSearch extends React.Component { nextQuestion = () => { if(process.env.REACT_APP_ENVIRONMENT==='production'){ ReactGA.event({ - category: "Intake Survey", + category: "Intake Survey NYC", action: "Clicked continue button", label: "address-search" }); diff --git a/src/BuildingTypes.js b/src/BuildingTypes.js index c17a22e0845758aaff1baaef851f896b4b3ff175..dae415112d1238723a7a28f1f57ef5e9d53fd3dd 100644 --- a/src/BuildingTypes.js +++ b/src/BuildingTypes.js @@ -40,7 +40,7 @@ export default class BuildingTypes extends React.Component { nextQuestion = () => { if(process.env.REACT_APP_ENVIRONMENT==='production'){ ReactGA.event({ - category: "Intake Survey", + category: "Intake Survey NYC", action: "Clicked continue button", label: "building-type" }); @@ -55,7 +55,7 @@ export default class BuildingTypes extends React.Component { chooseAnswer = (answer) => { if(process.env.REACT_APP_ENVIRONMENT==='production'){ ReactGA.event({ - category: "Intake Survey", + category: "Intake Survey NYC", action: "Chose building type", label: "building-type" }); diff --git a/src/ComfortIssues.js b/src/ComfortIssues.js index 0de86a9eb794348b481c72fc4d4daa01408e88b7..eed94f2f2e07493494edeec687a539b35057f820 100644 --- a/src/ComfortIssues.js +++ b/src/ComfortIssues.js @@ -34,7 +34,7 @@ export default class ComfortIssues extends React.Component { nextQuestion = () => { if(process.env.REACT_APP_ENVIRONMENT==='production'){ ReactGA.event({ - category: "Intake Survey", + category: "Intake Survey NYC", action: "Clicked continue button", label: "comfort-issues" }); @@ -49,7 +49,7 @@ export default class ComfortIssues extends React.Component { chooseAnswer = (answerId) => { if(process.env.REACT_APP_ENVIRONMENT==='production'){ ReactGA.event({ - category: "Intake Survey", + category: "Intake Survey NYC", action: "Select answer", label: "comfort-issues" }); diff --git a/src/Congrats.js b/src/Congrats.js index 7884170fa35c0171441149aee3546b49929fbf68..d90ad302b7ccb907b007661a6576de0df6e64fd1 100644 --- a/src/Congrats.js +++ b/src/Congrats.js @@ -1,8 +1,20 @@ import React from "react"; import congrats from './utils/images/spot-results-congratulations.svg'; // with import import './index.css'; +import ReactGA from 'react-ga'; -const Congrats = (props) => { +export default class Congrats extends React.Component { + constructor(props) { + super(props); + } + + componentDidMount () { + if(process.env.REACT_APP_ENVIRONMENT==='production'){ + ReactGA.pageview('/congratulations'); + } + } + + render() { const items = [ 'Air source heat pumps use less energy than your current system', 'Air source heat pumps require less maintanence than your current system', @@ -14,7 +26,7 @@ const Congrats = (props) => { 'You can then remove your radiators and open up more usable space in your units', ]; - const data = props.naturalGas === true ? + const data = this.props.naturalGas === true ? items.slice(1).map(item => { return (
  • {item}
    • ) }) : items.map(item => { return (
  • {item}
    • ) }); const content = ( @@ -44,6 +56,5 @@ const Congrats = (props) => { {content} ); + } } - -export default Congrats; diff --git a/src/Contact.js b/src/Contact.js index 0aa7fdacbc00704fb5741299e474379f895cb9bc..ce86da53549c6719b432fa21ef962c44c519f087 100644 --- a/src/Contact.js +++ b/src/Contact.js @@ -37,7 +37,7 @@ export default class Contact extends React.Component { submitContact = () => { if(process.env.REACT_APP_ENVIRONMENT==='production'){ ReactGA.event({ - category: "Intake Survey", + category: "Intake Survey NYC", action: "Clicked continue button", label: "contact-information" }); diff --git a/src/Feedback.js b/src/Feedback.js index f6113122d547adf10b76e3207e1908fa3d1d4c1e..30beb76184941fa9c6459188a9b8736d0e74948a 100644 --- a/src/Feedback.js +++ b/src/Feedback.js @@ -1,6 +1,7 @@ import React from "react"; import { Row, Col, Button } from 'reactstrap'; import './index.css'; +import ReactGA from 'react-ga'; export default class Feedback extends React.Component { constructor(props) { @@ -10,6 +11,12 @@ export default class Feedback extends React.Component { }; } + componentDidMount () { + if(process.env.REACT_APP_ENVIRONMENT==='production'){ + ReactGA.pageview('/feedback'); + } + } + handleInputChange = (event) => { const val = event.target.value; const name = event.target.name; @@ -24,6 +31,13 @@ export default class Feedback extends React.Component { } nextQuestion = () => { + if(process.env.REACT_APP_ENVIRONMENT==='production'){ + ReactGA.event({ + category: "Intake Survey NYC", + action: "Clicked continue button", + label: "feedback" + }); + } this.props.nextQuestion( 'feedback', [], diff --git a/src/FinanceInterest.js b/src/FinanceInterest.js index d465d7df3e9dd72ea9181e8adbc5f4165cf2cfa3..3aae4e51e85dd733a476194119bd7d0464110512 100644 --- a/src/FinanceInterest.js +++ b/src/FinanceInterest.js @@ -29,7 +29,7 @@ export default class FinanceInterest extends React.Component { nextQuestion = () => { if(process.env.REACT_APP_ENVIRONMENT==='production'){ ReactGA.event({ - category: "Intake Survey", + category: "Intake Survey NYC", action: "Clicked continue button", label: "finance-interest" }); diff --git a/src/Fuels.js b/src/Fuels.js index 6b57151942e3aa6d940e780017c5c382f9c9b977..41ec2aecfd9790d9bcbf56a92d506228733e8d2f 100644 --- a/src/Fuels.js +++ b/src/Fuels.js @@ -38,7 +38,7 @@ export default class Fuels extends React.Component { nextQuestion = () => { if(process.env.REACT_APP_ENVIRONMENT==='production'){ ReactGA.event({ - category: "Intake Survey", + category: "Intake Survey NYC", action: "Clicked continue button", label: "fuel-type" }); @@ -54,7 +54,7 @@ export default class Fuels extends React.Component { chooseFuel = (answer) => { if(process.env.REACT_APP_ENVIRONMENT==='production'){ ReactGA.event({ - category: "Intake Survey", + category: "Intake Survey NYC", action: "Chose fuel type", label: "fuel-type" }); diff --git a/src/HeatDistribution.js b/src/HeatDistribution.js index ef984f60e306d3c81d46a62c31c09245c37efdd1..caace3de551da63169d3439b8e2a4e29b7d18587 100644 --- a/src/HeatDistribution.js +++ b/src/HeatDistribution.js @@ -37,7 +37,7 @@ export default class HeatDistribution extends React.Component { nextQuestion = () => { if(process.env.REACT_APP_ENVIRONMENT==='production'){ ReactGA.event({ - category: "Intake Survey", + category: "Intake Survey NYC", action: "Clicked continue button", label: "heat-distribution" }); @@ -54,7 +54,7 @@ export default class HeatDistribution extends React.Component { chooseAnswer = (answer) => { if(process.env.REACT_APP_ENVIRONMENT==='production'){ ReactGA.event({ - category: "Intake Survey", + category: "Intake Survey NYC", action: "Chose type of heat distribution", label: "heat-distribution" }); diff --git a/src/HeatingSystemAge.js b/src/HeatingSystemAge.js index 71e893d9803b8323fd1a55a0ff5a3328e273c0cd..995f0987fcac4f95192ae7555021a163fc4ec2c5 100644 --- a/src/HeatingSystemAge.js +++ b/src/HeatingSystemAge.js @@ -33,7 +33,7 @@ export default class HeatingSystemAge extends React.Component { nextQuestion = () => { if(process.env.REACT_APP_ENVIRONMENT==='production'){ ReactGA.event({ - category: "Intake Survey", + category: "Intake Survey NYC", action: "Clicked continue button", label: "heating-system-age" }); @@ -49,7 +49,7 @@ export default class HeatingSystemAge extends React.Component { chooseAnswer = (answer) => { if(process.env.REACT_APP_ENVIRONMENT==='production'){ ReactGA.event({ - category: "Intake Survey", + category: "Intake Survey NYC", action: "Chose heating system age", label: "heating-system-age" }); diff --git a/src/HeatingSystemPlan.js b/src/HeatingSystemPlan.js index fff1d2278b73cb5a17582e0c7d7df5aa63b77257..78a37c06b417f49639f6cc93c76439efc28d87fe 100644 --- a/src/HeatingSystemPlan.js +++ b/src/HeatingSystemPlan.js @@ -32,7 +32,7 @@ export default class HeatingSystemPlan extends React.Component { nextQuestion = () => { if(process.env.REACT_APP_ENVIRONMENT==='production'){ ReactGA.event({ - category: "Intake Survey", + category: "Intake Survey NYC", action: "Clicked continue button", label: "heating-system-plan" }); @@ -48,7 +48,7 @@ export default class HeatingSystemPlan extends React.Component { chooseAnswer = (answer) => { if(process.env.REACT_APP_ENVIRONMENT==='production'){ ReactGA.event({ - category: "Intake Survey", + category: "Intake Survey NYC", action: "Chose heating system plan", label: "heating-system-plan" }); diff --git a/src/ReviewAnswers.js b/src/ReviewAnswers.js index 309d83b4f75ed0121b2baf11a11e1ef9500da695..6a80950d18d29cd9eb5de1eea471dce5f23fd74d 100644 --- a/src/ReviewAnswers.js +++ b/src/ReviewAnswers.js @@ -27,7 +27,7 @@ export default class ReviewAnswers extends React.Component { submit = () => { if(process.env.REACT_APP_ENVIRONMENT==='production'){ ReactGA.event({ - category: "Intake Survey", + category: "Intake Survey NYC", action: "Clicked submit button", label: "review-answers" }); diff --git a/src/SeparateBoiler.js b/src/SeparateBoiler.js index a225dc1013fc369b07cab870a345a14658f0ff72..e1daa7cc96b6270d3909bc8026838888aede83a4 100644 --- a/src/SeparateBoiler.js +++ b/src/SeparateBoiler.js @@ -1,6 +1,7 @@ import React from "react"; import { Row, Col, Button } from 'reactstrap'; import './index.css'; +import ReactGA from 'react-ga'; export default class SeparateBoiler extends React.Component { constructor(props) { @@ -15,11 +16,24 @@ export default class SeparateBoiler extends React.Component { ]; } + componentDidMount () { + if(process.env.REACT_APP_ENVIRONMENT==='production'){ + ReactGA.pageview('/separate-boiler'); + } + } + prevQuestion = () => { this.props.prevQuestion('separateBoiler'); } nextQuestion = () => { + if(process.env.REACT_APP_ENVIRONMENT==='production'){ + ReactGA.event({ + category: "Intake Survey NYC", + action: "Clicked continue button", + label: "separate-boiler" + }); + } this.props.setSeparateBoiler(this.state.answer); this.props.nextQuestion( 'separateBoiler', @@ -29,6 +43,13 @@ export default class SeparateBoiler extends React.Component { } chooseAnswer = (answer) => { + if(process.env.REACT_APP_ENVIRONMENT==='production'){ + ReactGA.event({ + category: "Intake Survey NYC", + action: "Chose DHW boiler type", + label: "separate-boiler" + }); + } this.setState({ answer }); } diff --git a/src/ThankYou.js b/src/ThankYou.js index 6da414970e08a123243b0cdb9246dc61317d03d8..516cb63aaf231fb85bd6ddbbd6d29f6c3aa8bafa 100644 --- a/src/ThankYou.js +++ b/src/ThankYou.js @@ -1,57 +1,70 @@ import React from "react"; import result from './utils/images/spot-results-more-info.svg'; // with import import './index.css'; +import ReactGA from 'react-ga'; -const ThankYou = (props) => { - // If building type is not single family (for NYC BIS) and for other surveys - 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}. -
    +export default class ThankYou extends React.Component { + constructor(props) { + super(props); + } - // If building type is single family and user has joined the waitlist - if (props.singleFamily === true) { - data = - 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}. -
    : -
    - Sorry to see you go! Come back any time if you change your mind! -
    - } + componentDidMount () { + if(process.env.REACT_APP_ENVIRONMENT==='production'){ + ReactGA.pageview('/thank-you'); + } + } - if (props.milwaukee === true) { - data = + render() { + // If building type is not single family (for NYC BIS) and for other surveys + var 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} - or email us at welcome.milwaukee@blocpower.io. -
    - } - - const content = ( -
    - -
    - Thank You! + 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}. +
    + + // If building type is single family and user has joined the waitlist + if (this.props.singleFamily === true) { + 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}. +
    : +
    + Sorry to see you go! Come back any time if you change your mind!
    - { data } -
    - ); + } - return ( -
    - {content} -
    - ); + if (this.props.milwaukee === true) { + 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} + or email us at welcome.milwaukee@blocpower.io. +
    + } + + const content = ( +
    + +
    + Thank You! +
    + { data } +
    + ); + + return ( +
    + {content} +
    + ); + } } -export default ThankYou; +// export default ThankYou; diff --git a/src/UnitBreakdown.js b/src/UnitBreakdown.js index 0ba7871c6ee92eeb3f3dcd0831bbdfedd71d0c02..fa278124c68aa5f72b6391e376005167737594cd 100644 --- a/src/UnitBreakdown.js +++ b/src/UnitBreakdown.js @@ -1,6 +1,7 @@ import React from "react"; import { Row, Col, Button } from 'reactstrap'; import './index.css'; +import ReactGA from 'react-ga'; export default class UnitBreakDown extends React.Component { constructor(props) { @@ -31,6 +32,12 @@ export default class UnitBreakDown extends React.Component { ] } + componentDidMount () { + if(process.env.REACT_APP_ENVIRONMENT==='production'){ + ReactGA.pageview('/unit-breakdown'); + } + } + handleInputChange = (event) => { const val = event.target.value; const name = event.target.name; @@ -46,6 +53,13 @@ export default class UnitBreakDown extends React.Component { nextQuestion = () => { if(this.validateEmptyInputs()) { + if(process.env.REACT_APP_ENVIRONMENT==='production'){ + ReactGA.event({ + category: "Intake Survey NYC", + action: "Clicked continue button", + label: "unit-breakdown" + }); + } this.props.nextQuestion( 'unitBreakdown', [], diff --git a/src/UtilityBills.js b/src/UtilityBills.js index 5e997cb80f3b271333df21dd83d0dc1da6966eef..9f1cff8b78bf7f9cdc66b4558bbeb883eb11f095 100644 --- a/src/UtilityBills.js +++ b/src/UtilityBills.js @@ -27,7 +27,7 @@ export default class UtilityBills extends React.Component { nextQuestion = () => { if(process.env.REACT_APP_ENVIRONMENT==='production'){ ReactGA.event({ - category: "Intake Survey", + category: "Intake Survey NYC", action: "Clicked continue button", label: "utility-bills" }); @@ -45,7 +45,7 @@ export default class UtilityBills extends React.Component { chooseAnswer = (utility, answer) => { if(process.env.REACT_APP_ENVIRONMENT==='production'){ ReactGA.event({ - category: "Intake Survey", + category: "Intake Survey NYC", action: "Chose who pays the bills", label: "utility-bills" }); diff --git a/src/WaitList.js b/src/WaitList.js index 513ec7397291802ac96149001e08276b1e279cf1..7128623c0590b964317fa509e39062bad898d9f2 100644 --- a/src/WaitList.js +++ b/src/WaitList.js @@ -1,7 +1,7 @@ import React from "react"; import { Row, Col, Button } from 'reactstrap'; import './index.css'; - +import ReactGA from 'react-ga'; export default class WaitList extends React.Component { constructor(props) { @@ -15,15 +15,35 @@ export default class WaitList extends React.Component { }; } + componentDidMount () { + if(process.env.REACT_APP_ENVIRONMENT==='production'){ + ReactGA.pageview('/wait-list'); + } + } + prevQuestion = () => { this.props.prevQuestion('waitList'); } nextQuestion = () => { + if(process.env.REACT_APP_ENVIRONMENT==='production'){ + ReactGA.event({ + category: "Intake Survey NYC", + action: "Clicked continue button", + label: "wait-list" + }); + } this.props.nextQuestion('waitList', this.names[this.state.answer], this.state.answer); } chooseAnswer = (answer) => { + if(process.env.REACT_APP_ENVIRONMENT==='production'){ + ReactGA.event({ + category: "Intake Survey NYC", + action: "Chose waitlist type", + label: "wait-list" + }); + } this.setState({ answer }); }