App.js 4.34 KB
import React, { Component } from 'react';

import Modal from './components/Modal/Modal'

import Profilation from './components/Profilation'
import Activation from './components/Activation'
import ActivationStep from './components/Activation/ActivationStep'
import MobileUpload from './components/Activation/MobileUpload'
import MobileUploadComplete from './components/Activation/MobileUploadComplete'
import ActivationStep5 from './components/Activation/steps/ActivationStep5'

import Solution from './components/Solution'

import Loader from './components/Loader'

import { Provider } from 'react-redux';
import  ProfilationSelectReducer  from './components/reducers/profilationSelect';


import { createStore, combineReducers, applyMiddleware, compose } from 'redux'

import createHistory from 'history/createBrowserHistory'
import Route from 'react-router-dom/Route';
import * as storage from 'redux-storage'

import './styles/style.css'

import { ConnectedRouter, routerReducer, routerMiddleware } from 'react-router-redux'
import createEngine from 'redux-storage-engine-localstorage';

import Header from "./components/header/index";
import Footer from "./components/Footer/index";

import LemaApi from "./service/service.js";

const history = createHistory()
const engine = createEngine('pro');
const middlewareRouter = routerMiddleware(history)
const middleware = storage.createMiddleware(engine);
const reducer = storage.reducer(combineReducers({
  ProfilationSelectReducer: ProfilationSelectReducer,
  router: routerReducer
}));



const store = createStore(
  reducer,
  compose(applyMiddleware(middlewareRouter), applyMiddleware(middleware))
)

const load = storage.createLoader(engine);
load(store);

// Notice that our load function will return a promise that can also be used
// to respond to the restore event.
load(store)
    .then((newState) => console.log('Loaded state:', newState))
    .catch(() => console.log('Failed to load previous state'));

/*const store = createStore(
  ProfilationSelectReducer
  );*/



class App extends Component {
    
    constructor() {
        super();
        this.state = { loadingData: true }
    }

    componentDidMount() {        
        
        // Servizio per recupero dati di configurazione
        var lemaApi = new LemaApi();

        // Carico i dati dell'applicazione
        lemaApi.getWebClientConfigData()        
            .then(response => {              
                // Salvo i dati nel local storage
                localStorage.setItem("CONFIG_DATA", JSON.stringify(response.data));                
                
                // Update state component
                this.setState({ loadingData: false });
            })
            .catch(function (error) {
                console.log(error);
            });         
    }

  render() {

    /*const { dispatch, steps } = this.props;
    const changeValue= bindActionCreators(SelectActionCreators.changeValue, dispatch);*/

   return (
    <Provider store={store}>

      <div className="repower-app" id='wrap' >
          
          <Header/>
          <ConnectedRouter history={history} >

      <div>
      <Modal />
        <Route exact path="/" component={Profilation} 
        updatePropValue={this.props.updatePropValue}  />
         <Route path="/loader" render={()=><Loader 
                    goTo={'/solution'}
                    history={history} 
                    heading={'Ci siamo quasi'}
                    subHeading={'Stiamo costruendo la soluzione più adatta, basandoci sulle tue abitudini di consumo.'}/>}/>
        <Route path="/solution" component={Solution}/>
        <Route path="/activation" component={Activation}/>
        <Route path="/activation-steps" component={ActivationStep}/>
        <Route path="/activation-step-5" component={ActivationStep5}/>
        <Route path="/mobile-upload" component={MobileUpload}/>
        <Route path="/mobile-upload-loader" render={()=><Loader 
                    goTo={'/mobile-upload-complete'}
                    history={history} 
                    heading={'Caricamento documenti in corso...'}
                    subHeading={''}
                    className={'mobile-upload-loader'}
                    />}/>
        <Route path="/mobile-upload-complete" component={MobileUploadComplete}/>
        <Footer/>
      </div>
    </ConnectedRouter>

    

      </div>
      </Provider>


    );
  }
}

export default App;