Add storybook addon-redux to an existing project with redux-sagas and connected-react-router

addons.js

import addons from '@storybook/addons'
import registerRedux from 'addon-redux/register'
registerRedux(addons)

Component.stories.tsx

import React from 'react';
import { Story, Meta } from '@storybook/react/types-6-0';
import { Provider } from 'react-redux';
import addons from '@storybook/addons';
import withRedux from 'addon-redux/withRedux';

import { MyComponent } from '../components/MyComponent/MyComponent';
import store from '../store';
import { RootState } from '../types';

const withCondition1ReduxSettings: { Provider: any; store: any; state: RootState } = {
  Provider,
  store,
  state: {
    schedule: { condition1: 'Aaa'},
  },
};

const withCondition1ReduxDecorator = withRedux(addons)(withCondition1ReduxSettings);

const withCondition2ReduxSettings: { Provider: any; store: any; state: RootState } = {
  Provider,
  store,
  state: {
    schedule: { condition1: 'Bbb' },
  },
};

const withCondition2ReduxDecorator = withRedux(addons)(withCondition2ReduxSettings);

export default {
  title: 'MyComponent',
  component: MyComponent,
  decorators: [withCondition1ReduxDecorator],
} as Meta;

const Template: Story = () => <MyComponent />;

export const Condition1 = Template.bind({});
Condition1.decorators = [withCondition1ReduxDecorator];

export const Condition2 = Template.bind({});
Condition2.decorators = [withCondition2ReduxDecorator];

store.ts

import { createStore, combineReducers, applyMiddleware, compose } from 'redux';
import { routerMiddleware } from 'connected-react-router';
import { createHashHistory } from 'history';
import createSagaMiddleware from 'redux-saga';
import withReduxEnhancer from 'addon-redux/enhancer';

import main from './sagas/main';
import scheduleReducer from './reducers/scheduleReducer';

export const history = createHashHistory();
const allReducers = combineReducers({
  // add your reducers here
  schedule: scheduleReducer,
});

// setup redux devTools extension
const composeEnhancers =
  (window as any).__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;

const middleware = routerMiddleware(history);
const sagaMiddleware = createSagaMiddleware();

const store = createStore(
  allReducers,
  composeEnhancers(
    // applyMiddleware takes an array of middlewares and returns an enhancer
    applyMiddleware(middleware, sagaMiddleware),
    // add the remaining enhancers
    withReduxEnhancer
  )
);
// saga entry point
sagaMiddleware.run(main);

export default store;