asyncredux-connector-pattern
Installation
SKILL.md
Overview
The connector pattern separates store access logic from UI presentation. Instead of widgets directly accessing the store via context.state and context.dispatch(), a "smart" connector widget extracts store data and passes it to a "dumb" presentational widget through constructor parameters.
Why Use the Connector Pattern?
- Testing simplification - Test UI widgets without creating a Redux store by passing mock data
- Separation of concerns - UI widgets focus on appearance; connectors handle business logic
- Reusability - Presentational widgets function independently of Redux
- Code clarity - Widget code is not cluttered with state access and transformation logic
- Optimized rebuilds - Only rebuild when the view-model changes
The Three Components
1. ViewModel (Vm)
Contains only the data the UI widget requires. Extends Vm and lists equality fields: