title: Dispatch action from redux store in non redux component
body: <p>For some days I've been wrapping my head around a problem and I just can't find a good solution.</p>
  
  <p>Long story short, I just want a loader on screen every time I make a custom axios request. I have 6  basic requests instances with interceptors like:</p>
  
  <pre><code>export const axiosRequest1 = axios.create({
    //blabla
  });
  
  axiosRequest1.interceptors.request.use(
    config =&gt; {
       check();
       return config;
    },
  error =&gt; {
    return Promise.reject(error);
    }
  );
  
  axiosRequest1.interceptors.response.use(
    config =&gt; {
      return config;
    },
    error =&gt; {
      return Promise.reject(error);
    }
  );
  </code></pre>
  
  <p>I need to start a loader at first of this requests and get rid of it after the last one. </p>
  
  <pre><code>async function check() {
    if (checked === false) {
      checked = true;
      setTimeout(callback, 699);
    }
  }
  </code></pre>
  
  <p>and the callback:</p>
  
  <pre><code>function callback() {
    isLoading = true;
    console.log('---------------');
    // and here i want to dispatch my actin from redux store with the value of isLoading. 
  </code></pre>
  
  <p>The action looks like:</p>
  
  <pre><code>const setLoader = isLoading =&gt; dispatch =&gt; {
    return dispatch({
      type: actionTypes.SET_LOADER,
      isLoading: isLoading
    });
  }
  export default setLoader;
  </code></pre>
  
  <p>I would normally export my store and call the action creator, except the store declaration is like this. </p>
  
  <pre><code>const initStore = previousStore =&gt; {
    return createStore(//bla);};
  </code></pre>
  
  <p>So if I try that, a new store will pe created, which I don't want.</p>
  
  <p>Does anyone have an idea about how can I solve this?</p>