americanexpress / react-albus

✨ React component library for building declarative multi-step flows.
Apache License 2.0
1.1k stars 89 forks source link

`withWizard` example #16

Closed loqtor closed 6 years ago

loqtor commented 6 years ago

Hi guys,

I'm currently trying to use the withWizard enhancer and I cannot get my head around on what is expecting me to pass in.

Here's what I'm trying:

const ChangeCoverConnected = connect(mapStateToProps, mapDispatchToProps)(ChangeCover);

export default withWizard(ChangeCoverConnected);

I get this error:

Uncaught TypeError: Cannot read property 'init' of undefined

When trying to debug it, I noticed that when the enhancer is invoked, it (apparently) expects a reference to the wizard and that's the part where I'm lost. :)

Can you guys provide an example of how the enhancer should be used? Thanks.

Cheers!

nathanforce commented 6 years ago

Hello! Thanks for reaching out.

https://codesandbox.io/s/oqmqxnoj2y

I've augmented the redux example app on CodeSandbox with some react-albus stuff in there. All seems to work fine using withWizard. Specifically, check /containers/VisibleTodoList

What version of react-albus are you using?

nathanforce commented 6 years ago

@loqtor Be sure you are rendering your withWizard wrapped component within a Wizard, else it won't be able to access context.wizard