index.js 4.36 KB
import React, { Component } from 'react';
import logo from './img/logo.svg'
import close from './img/close_header.svg'

import saveIcon from '../../img/save.svg'

import arrowDownSave from '../../img/arrow_down_save.svg'

import ProgressBar from '../ProgressBar'

import * as SelectActionCreators from '../actions/profilationSelect'
import { connect } from 'react-redux';


class Header extends Component {
  constructor(props){
    super(props)
    this.state= {
      pathname:''
    }
  }

  componentDidUpdate(prevState){

    /*if(prevState.pathname!==this.props.history.location.pathname){
      this.setState({
        pathname:this.props.history.location.pathname
      })
    }*/
  }


    redirect(){
        window.location.href='http://preprod-rep-sketchin.netlify.com'
    }

    render(){
        const saved=(this.props.activationSteps[2].isComplete||(this.props.modalContacts.activationSaveModal.contact.valid&&this.props.sessionSaved))
        return(
            <div>
                <header className="">
                    <div className="bigContainer">
                        <div className="logo ">
                        <a href="http://localhost:3001/?newProfilation=false"> <img src={logo} alt={'logo'} /> </a>} />
                            <p className="header--payoff ">Costruisci in pochi secondi
                                <br />la tua tariffa flat, 100% online.
                            </p>

                        </div>
                        <nav className="main-navi">
                        </nav>
                        <div className="navigation_right navigation_right--activation ">

                         {(!saved && this.props.history.location.pathname!=='/')&&

          <div data-modal="modal-save" className="triggher_modal saveOffer" id="show-modal-three" onClick={() => this.props.showModal('SAVE_MODAL')}>
            <div className="outline-offer-cta-top">
              <img src={saveIcon} alt="" />
              <p>Salva e riprendi dopo</p>
            </div>
          </div>
         
        }

        {(saved && this.props.history.location.pathname!=='/') && window.innerWidth>768 &&
          <div className='codeContainer' onClick={()=>this.props.showModal('SAVE_MODAL')}>
              {/*this.props.showSessionMessage && <p className="saveProcess">Processo Salvato <span><img src={greenCheckOutline} alt=""/></span></p> */}
              <p className='title'>Codice Repower:</p> <p className="code">
              {this.props.activationCode} </p>
              <img src={arrowDownSave} alt='' />
          </div>
          }
                            {this.props.history.location.pathname!=='/' &&
                        <div className="close--header" onClick={() => this.props.showModal('WAYOUT_MODAL')}>
                            <img src={close} alt="" />

                        </div> }

                            {this.props.history.location.pathname==='/' &&
                            <div className="close--header" onClick={()=>this.redirect()}>
                                <img src={close} alt="" />

                            </div> }
                        </div>
                        
                    </div>
                    
                      <ProgressBar/>
                    
                    
                    
                    
                </header>
            </div>

        )
    }
}


const mapStateToProps = state => {
  return {
    sessionSaved:state.ProfilationSelectReducer.sessionSaved,
    activationCode:state.ProfilationSelectReducer.activationCode,
    activationSteps:state.ProfilationSelectReducer.activationSteps,
    modalContacts:state.ProfilationSelectReducer.modalContacts,
  steps:state.ProfilationSelectReducer.steps,
  solutions:state.ProfilationSelectReducer.solutions,
  showSessionMessage:state.ProfilationSelectReducer.showSessionMessage,
}};

const mapDispatchToProps = dispatch => ({
  updatePropValue: (prop,value,index,complete) => 
    dispatch(SelectActionCreators.changeValue(prop,value,index,complete)),
  updateStoreValue: (prop,value) => 
    dispatch(SelectActionCreators.changeProp(prop,value)),
    showModal: (modalName) => 
    dispatch(SelectActionCreators.showModal(modalName)),
});

export default connect(mapStateToProps, mapDispatchToProps)(Header);