Async Actions React

Добрый вечер, помогите новичку с Async Actions. Мне нужно дождаться пока загрузится вся фронтенд часть (пока загружается фронтенд часть работает прелоадер {this.props.loading ? (<Loader />) : []}) после загрузи фронтенд части естественно прелоадер убирается. Написал вроде как кастыльно, хотелось бы что-бы автоматически прелоадер после выполнения всех функций переходил в состояние false. Или подскажите другой метод если я чего-то не правильно понимаю, спасибо :). Кастыльно использую

setTimeout(function () {
            self.props.rebaseData('loading', false);
        }, 1000);

Вот код:

import React, {Component} from "react";
import {Paper} from 'material-ui';
import OwlCarousel from 'react-owl-carousel2';
import locations from '../../data/locations.json';
import Loader from  '../Loader/LoaderContainer';
import './Fares.css';
class Fares extends Component {
    constructor(props) {
        super(props);
        this.state = {
            inwardPrice: 0,
            outwardPrice: 0,
            inwardDom: [],
            route: [],
            fullFaresStatus: false,
            totalStatus: false,
            fullFaresPrice: 0,
        };
        this.handlePrice = this.handlePrice.bind(this);
    }
    createRoute(id) {
        //do something
    }
    handlePrice(price, direction) {
        //do something
    }
    componentDidMount() {
        console.log('work')
        this.setState({loading: false})
    }
    render() {
        let self = this;
        let tap = Number(this.state.outwardPrice !== 0 ? this.state.outwardPrice : this.props.outwardPrice) + Number(this.state.inwardPrice);
        let originFound = locations.find((e) => {
            return this.props.searchResult.response ? e.code === this.props.searchResult.response.outward.map((key) => key.origin)[0] : undefined;
        });
        let destinationFound = locations.find((e) => {
            return this.props.searchResult.response ? e.code === this.props.searchResult.response.outward.map((key) => key.destination)[0] : undefined;
        });
        let origin = originFound ? originFound.name : undefined;
        let destination = destinationFound ? destinationFound.name : undefined;
        const fares = this.getFares();
        setTimeout(function () {
            self.props.rebaseData('loading', false);
        }, 1000);
        return (
            <section className="fares">
                <div className="container">
                    {this.props.loading ? (<Loader />) : []}
                    <ul>
                        {this.props.searchResult.response.length ? 'No results' : this.getCarosel(this.props.searchResult.response.outward, 'out', fares, this.outwardSelected)}
                     </ul>
                     <ul className="fare-list clearfix">
                         {this.props.searchResult.response.length ? 'No results' : this.getCarosel(this.props.searchResult.response.inward, 'inw', fares[this.outwardSelected].with, this.inwardSelected)}
                     </ul>
            </section>
        );
    }
    getCarosel(journeys, direction, fares, selectedId) {
      return (<OwlCarousel ref={"fares-" +direction} options={options}>
        {journeys.map(journey => {
          let price = fares[journey.id].price;
          let pence;
          return (
            <Paper key={journey.id} className="fare pull-left" zDepth={2}>
              <label className="fare-input center">
                <div className="fare-stations bold clearfix">
                  <span className="fare-station pull-left">{journey.origin}</span>
                  <span className="fare-station pull-right">{journey.destination}</span>
                </div>
                <div className="fare-times bold clearfix">
                  <time className="fare-time pull-left">{journey.departureTime}</time>
                  <time className="fare-time pull-right">{journey.arrivalTime}</time>
                </div>
                <p className="duration">{journey.duration} min</p>
                <p className="fare-ticket"><a href="/" onClick={(event) => {
                    if(!this.state.route.length) {
                        this.createRoute();
                    }
                    this.handleFullFaresModal(event, journey.id, price);
                }}>More info</a></p>
                <div className="fare-bottom" onClick={() => {
                    if(direction === 'inw') {
                        this.handlePrice(price, direction);
                    } else {
                        this.createRoute(journey.id);
                        this.getNewFares(journey.id);
                        this.handlePrice(price, direction);
                    }
                }}>
                  <p className="fare-price bold">
                    <span className="pound">&#163;</span>{price === 0 ? '-' : Math.floor(price / 100)}<span className="pence">.{pence}</span>
                  </p>
                  <input defaultChecked={journey.id === selectedId} type="radio" className="radio" name={direction} />
                  <span className="radio-custom"></span>
                </div>
              </label>
            </Paper>
          );
        })}
      </OwlCarousel>);
    }
    getNewFares(id) {
        //do something
    }
    getFares() {
        //do something
    }
    getJourneyFares(journey) {
      //do something
    }
    getFareOptions(fareOptionId) {
      //do something
    }
}
export default Fares;

после всех этих функций выключать прелоадер:

getCarosel(){}
getNewFares(id) {
    //do something
}
getFares() {
    //do something
}
getJourneyFares(journey) {
  //do something
}
getFareOptions(fareOptionId) {
  //do something
}