'Storybook Redux Provider

I want to render my components in storybook. Everything works fine until it's the component which touches Redux. So I know that I need to wrap these redux components in Provider but it doesn't work. Here is my providers.tsx

import { DecoratorFn } from '@storybook/react'

import { IntlProvider } from "react-intl"
import { ThemeProvider } from "@mui/material/styles"
import { ThemeProvider as Emotion10ThemeProvider } from 'emotion-theming';
import { theme } from "../src/ui-kit/theme"



export const withIntl: DecoratorFn = (StoryFn) => {

    return (
    <IntlProvider
      locale="en"
      defaultLocale="en"
      messages={{
        IHaveTo: "addCorrectMessagesHere"
      }}
    >
      <StoryFn />
    </IntlProvider>
    )
  }

  export const withThemeProvider: DecoratorFn = (StoryFn) => {
    return (
      <Emotion10ThemeProvider theme={theme}>
        <ThemeProvider theme={theme}>
          <StoryFn />
        </ThemeProvider>
      </Emotion10ThemeProvider>
    );
  };

Here is my preview.js where I import these providers created by me and I use them in decorator which is for wrapping every story/component.

import { withIntl, withThemeProvider } from './providers'
export const decorators = [
  withIntl,
  withThemeProvider
]


export const parameters = {
  actions: { argTypesRegex: "^on[A-Z].*" },
  controls: {
    matchers: {
      color: /(background|color)$/i,
      date: /Date$/,
    },
  },
}

I have tried to wrap Story/Component locally in the .stories.tsx file but doesn't work. I have searched any possible thing in Google but nothing did work. This code should work, but it doesn't:

const withReduxProvider = (StoryFn) => {
  return (
    <Provider store={store}>
      <StoryFn />
    </Provider>
  )
}

P.S it's been lots of hours I am trying to solve this issue and one thing I noticed is that when I try to just import store in preview.js from my redux/store everything disappears after reload in storybook. Here is the screenshot: enter image description here



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source