ComponentState Hook

Is used to create actions

@react-state follows React and supports hooks from version 7.0.0.

In order to cretae actions you need to pass followinf parameters to useComponentState hook

1. Actions type

2. statePath (optional - if not passed then takes root)

3. stateIndex (optional)

Hook returns actions and new statePath which can be passed further.

const TodoDescriptionHooks = ({ statePath, stateIndex }) => {
    const { actions, statePath } = useComponentState(TodoStateActions, statePath, stateIndex);

    return (<div>{ actions.testTodoDescription }</div>);
};

export default React.memo(TodoDescriptionHooks);

In @ComponentState decorator, when using classes, there is extended shouldComponentUpdate method which makes sure that component is not rerendered until state is changed. Since hooks do not have shouldComponentUpdate lifecycle method, React proposes to use React.memo in places where it is needed. So in this I strongly advice users to pay more attention and use hooks to according to best React practices because it might affect overall performance.

Hooks allows to use multiple actions in one component. If you need to to this it is first sign of state architecture smell and is going against @react-state ideology that - state is representation of your components on the screen