I am using Storybook 6.5 but I am still on storiesOf and having issues with Decorators alongside tons of questions

[gabycperezdias]

I am currently using Storybook 6.5, and although I updated the version, I chose not to migrate my stories to the new CSF and keep things as-is with storiesOf.

I really like the way my storybook is set up, with all the stories organized together inside Storybook folder. I also have my own "common" components made to build stories that work for my team.

I feel that changing to make use of CSF will be a lot of effort for something we currently are (in theory) not having issues with the structure. I feel that having stories spread throughout the entire library will be confusing...

BUT my concern is that, I am working on something new to integrate redux into storybook with global decorators and is not working... I am not sure if maybe the storiesOf approach doesn't really support global decorators properly, or if I am doing something wrong on my side... I would really appreciate some help on this, my current project was not accounting for a full refactor on stories to make support for CSF... we were thinking that adding redux support would be a simple task, but if we cannot make redux to work with what we have, we will have to migrate... and we are talking about 100+ stories that needs to be migrated, and although there's a tool to automatically do the migration, trying to run it didn't work for me. So I want to see if I can fix as-is first...

I asked some questions around on Stackoverflow and directly on redux, but I could not find a solution on this, could someone please help me?

Thank you so much

https://stackoverflow.com/questions/76757793/how-to-add-redux-provider-as-a-storybook-v6-decorator-and-use-redux-inside-of

[shilman]

We are planning to remove storiesOf support in 8.0, so I'd definitely recommend moving to CSF, since we're making significant improvements to Storybook with each release. (I already can't imagine using 6.5 now that 7.0 is out!)

That said, I don't think there's any significant difference between the decorator implementation for StoriesOf and CSF, so I'm not sure that's your problem. I also looked at your stank overflow post and the code looked reasonable. Perhaps there are multiple versions of React installed so that the context is get set on one and then is not available on the other?

My recommendation would be to start a tiny fresh project spike on https://storybook.new and see if you can get redux working there and then once you have a working project try to move your full project to that setup. It's always easier to debug when things are small.

[gabycperezdias]

@shilman So I started to migrate my stories, but I have an issue where I need to wrap my stories with my own providers and they are used for all stories, so ideally those would be global decorators, but for some reason I cannot import anything inside preview.js that is sitting outside the .storybook folder, is this a configuration I am missing or an actual limitation?

[shilman]

@gabycperezdias that sounds really strange. You should be able to load files from anywhere inside preview.js. If you have a reproduction I'd be happy to take a look!