The Mattermost web app is going through a big restructuring effort to move from using Flux to Redux. When we first started building the webapp, React was still new to the world, and so were the frameworks and design patterns. As a result, the webapp has had a lot of organic growth over the last couple of years, and is using an assortment of different design patterns.
This campaign is meant to help with that by moving app state and logic into our Redux repository, and by migrating the webapp components to be pure and use Redux to supply their props.
By completing this campaign, we’re looking to:
If you’re interested in contributing please join the Redux channel on pre-release.mattermost.com. Progress on moving individual componentsover to use Redux is tracked on this spreadsheet. If you want to work on one of the components let us know in the Redux channel or by making a comment on the spreadsheet.
List of contributors, in alphabetical order:
For guidance on migrating a webapp component to Redux, read the next section.
There are a few steps involved with migrating a component to use Redux. Some of them may not apply to every component and they may change slightly based on the component you’re working on. In general, you can these steps as a checklist for work that needs to be done on each component.
PropTypesfrom the bottom of the file to be defined at the top of the component, as shown here.
React.PropTypesusages with just
import PropTypes from 'prop-types';to the file imports.
React.Componentand remove the
shouldComponentUpdatefunction if it exists.
user_store.jsx), create a container by:
index.jsfor the component.
actionsprop with each action as a child, similar to this.
You can see some example pull requests here: