Redux for Mattermost
Clone or download
mkraft Ldap groups phase1 (#706)
* MM-11839: Add ldap groups list/unlink/link actions (#705)

* Adding the ldap groups count

* Initial code for groups.

* Fix for group members.

* Fix for group syncables.

* Removes commented code.

* Adds group member count.

* Adding getAllChannels and searchAllChannels calls to redux library

* Adding unit tests to getAllChannels and searchAllChannels actions

* Adds tests for new groups actions.

* Fix some lint errors.

* Flow fixes.

* Adding pagination to get all channels

* Adding store types and initial data for missing requests data

* Switches from var to let or const.

* Updates copy/paste error.

* Removes unused action data.

* Fix merge.

* Moving webapp related reducers and selectors to the webapp

* Adding RECEIVED_ALL_CHANNELS to channels reducers

* Using simple funtions where selectors arent needed

* Converted syncables groups selectors to plain functions

* Fixed flow errors

* Lockfile update.

* Bad merge fixes.
Latest commit ef51b00 Jan 10, 2019
Type Name Latest commit message Commit time
Failed to load latest commit information.
build [MM-12333] Convert mocha to jest and move test files adjacent to the … Jan 10, 2019
src Ldap groups phase1 (#706) Jan 10, 2019
test Ldap groups phase1 (#706) Jan 10, 2019
.editorconfig MM-11157 Switch ESLint to use eslint-config-mattermost (#675) Oct 11, 2018
.eslintignore Add initial JenkinsFile for redux (#528) Jun 18, 2018
.eslintrc.json [MM-12333] Convert mocha to jest and move test files adjacent to the … Jan 10, 2019
.flowconfig Upgrading flow to the last version and fixing flow errors (#746) Jan 4, 2019
.gitattributes moved redux from react native app Mar 15, 2017
.gitignore [MM-12333] Convert mocha to jest and move test files adjacent to the … Jan 10, 2019
.npmignore Don't remove .babelrc May 22, 2017 Add link to developer docs in (#600) Aug 20, 2018 moved redux from react native app Mar 15, 2017
LICENSE.txt Revert Redux #647 (#649) Sep 26, 2018
Makefile Run babel on 'npm install' and remove .npminstall (#635) Sep 18, 2018
NOTICE.txt Update NOTICE.txt (#696) Nov 6, 2018 s/cheking/checking/ (#526) Jun 8, 2018 Fix make bundle command (#536) Jun 18, 2018
babel.config.js Transform flow types to comment, instead of strip-types and coping so… Jan 2, 2019
package-lock.json Ldap groups phase1 (#706) Jan 10, 2019
package.json [MM-12333] Convert mocha to jest and move test files adjacent to the … Jan 10, 2019
webpack.config.js Upgrade to babel 7 (#579) Nov 6, 2018

Mattermost Redux

The project purpose is consolidating the storage, web utilities and logic of the webapp and React Native mobile clients into a single driver. We encourage you to use mattermost-redux to power your own Mattermost clients or integrations.

Redux is the backbone for this project and many of the design decisions and patterns stem from it.

Mattermost is an open source Slack-alternative used by thousands of companies around the world in more than 12 languages. Learn more at


Basic Usage

To hook up your application to the mattermost-redux store:

import configureServiceStore from 'mattermost-redux/store';

configureServiceStore(yourInitialState, yourAppReducers, yourOfflineOptions);

const store = configureStore();

// use store
  • yourInitialState - any initial state for any extra reducers you may have (set to {} if none)
  • yourAppReducers - any reducers from your app (set to {} if none)
  • yourOfflineOptions - any offline options, specified using this redux-offline configuration object

Web Client Usage

If you're only looking to use the v4 JavaScript web client for the Mattermost server:

With async/await:

import {Client4} from 'mattermost-redux/client';


async function loginAndGetUser(username, password) {
    try {
        await Client4.login(username, password);
    } catch (error) {
        return null;

    let user;
    try {
        user = await Client4.getMe();
    } catch (error) {
        return null;

    return user;

With promises:

import {Client4} from 'mattermost-redux/client';


function loginAndGetUser(username, password, callback) {
    Client4.login(username, password).then(
        () => {
                (data) => {
                (error) => {
        (error) => {

If you already have a personal access token or session token, you can set the token manually instead of logging in:

import {Client4} from 'mattermost-redux/client';


Browser Usage

To build a browser-compatible client via webpack:

$ git clone <this repo>
$ cd mattermost-redux
$ make bundle

This will generate lib/mattermost.client4.js, and lib/mattermost.websocket.js which can be loaded in a browser. Also note that babel-polyfill is required.

<script src="/path/to/babel/polyfill.js"></script>
<script src="/path/to/mattermost.client4.js"></script>
<script src="/path/to/mattermost.websocket.js"></script>
<script type="text/javascript">
    const client = Mattermost.client4.default();
    const wsClient = Mattermost.websocket.default;
    var token;
    /* use an existing personal access token */
    /* login and obtain a token */
    client.login(username, password)
        console.log(`Logged in as ${}`);
        token = client.getToken();
        wsClient.initialize(token, {}, {}, {connectionUrl: 'wss://'});

node.js Usage

Running the client from node.js requires making the fetch and WebSocket packages globally available, and the use of babel-polyfill:

if (!global.WebSocket) {
    global.WebSocket = require('ws');
const Client4 = require('./client/client4.js').default;
const client = new Client4;
const wsClient = require('./client/websocket_client.js').default;
var token;


client.login(username, password)
    console.log(`logged in as ${}`);
    token = client.getToken();
    wsClient.initialize(token, {}, {}, {connectionUrl: 'wss://'});

How to Contribute

How to Build mattermost-redux

You only need to build mattermost-redux if you are developing it.

Webapp Development

If your mattermost-webapp and mattermost-redux are in the same directory, you only need to run npm run dev or npm run dev:watch.

If you have mattermost-webapp in other directory or you are developing your own application, you can define the environment variable WEBAPP_DIR to change the destination app (e. g. WEBAPP_DIR=/tmp/mattermost-webapp).

React Native (Mobile) Development

If your mattermost-mobile and mattermost-redux are in the same directory, you only need to run npm run dev-mobile or npm run dev-mobile:watch.

If you have mattermost-mobile in other directory or you are developing your own application, you can define the environment variable MOBILE_DIR to change the destination app (e. g. MOBILE_DIR=/tmp/mattermost-mobile).

Resetting apps to use package redux

If you want to go back to using the package specified redux in your web or mobile app you can stop the server and run rm -rf .npminstall to force your project to reset to the specified package version on next server start.

Contribute Code

If you're contributing to help migrate the webapp to Redux go ahead and submit your PR. If you're just fixing a small bug or adding a small improvement then feel free to submit a PR for it. For everything else, please either work on an issue labeled [Help Wanted] or open an issue if there's something else that you'd like to work on.

Feel free to drop by the Redux channel on our Mattermost instance.

Running the Tests

make test will run the tests against a mocked server.

To run the tests against a live server, you must have a system admin user with the email and password password1. If you're using a developer copy of the Mattermost server, you can create this user by running:

go build ./cmd/platform
./platform user create --email "" --password "password1" --username "redux-admin" --system_admin

If you're using a release binary for the server, just run:

./bin/platform user create --email "" --password "password1" --username "redux-admin" --system_admin

The server needs to be available at http://localhost:8065. This can be overridden by setting an environment variable named MATTERMOST_SERVER_URL.

Finally, set "EnableOpenServer", "EnableCustomEmoji", "EnableLinkPreviews", "EnableUserAccessTokens" and "EnableOAuthServiceProvider" to true and "EnableOnlyAdminIntegrations" to false in your config.json. If you don't have a config.json yet, create it by copying default.json.

With that set up, you can run the tests against your server with npm run test-no-mock.