Redux Example

reducer.index.jsx

import match_options, * as matchOptionsSelectors from "./match_options.reducer.jsx";
const galaxyApp = combineReducers({
    match_options
});

// GETTER
export const getMatchOptions = (state) => {
    return matchOptionsSelectors.getMatchOptions(state.match_options);
};

export default galaxyApp;

______________________________________________________________________________________

index.jsx

import { createStore, applyMiddleware } from "redux";
import appReducer from "./reducers/reducer.index.jsx";
const store = createStore(appReducer, applyMiddleware(thunk));

______________________________________________________________________________________

ACTIONS.jsx

// SETTER
const ACTION_TYPES = {
    SET_MATCH_OPTIONS: "SET_MATCH_OPTIONS",
}

export default ACTION_TYPES;

______________________________________________________________________________________

action.index.jsx

import ACTION_TYPES from "../config/ACTIONS.jsx";

// SETTER
export default {
    setMatchOptions(header, text) {
        return {
            type: ACTION_TYPES.SET_MATCH_OPTIONS,
            header: header,
            text: text,
        };
    }
};

______________________________________________________________________________________

match_options.reducer.jsx

import ACTION_TYPES from "../config/ACTIONS.jsx";
const INIT_STATE = {
    match_options: {},
};

// SETTER
const match_options = (state = INIT_STATE, action) => {
    let new_state;
    switch (action.type) {
        case ACTION_TYPES.SET_MATCH_OPTIONS:
            new_state = Object.assign({}, INIT_STATE);
            new_state.match_options[action.header] = action.text;
            return new_state;
        default:
            return state;
    }
};

export default match_options;

// GETTER
export const getMatchOptions = (state) => {
    return state.match_options;
};

______________________________________________________________________________________

USAGE:

// GETTER
const mapStateToProps = (state) => ({
    match_options: reduxSelector.getMatchOptions(state),
});

// SETTER
const mapDispatchtoProps = dispatch => {
    return {
        setMatchOptions: (header, text) => {
            dispatch(Action.setMatchOptions(header, text));
        },
    };
};

export default connect(
    mapStateToProps,
    mapDispatchtoProps
)(MongoUploadedView);