How to use redux-starter-kit - 10 common examples

import { createReducer } from "redux-starter-kit";

import SFX, { TYPES } from "../constants/sfx";

const initialState = {};

// CONSTANTS
export const actionTypes = { PLAY_SFX: "PLAY_SFX" };

// ACTIONS

export const playSFX = id => dispatch => {
  dispatch({ type: actionTypes.PLAY_SFX, id });
};

export const sfx = createReducer(initialState, {
  [actionTypes.PLAY_SFX]: (state, action) => {
    try {
      SFX[TYPES[action.id]].play();
    } catch (error) {
      // eslint-disable-next-line
      console.warn("Unknown SFX type requested ", action, error);
    }
  }
});

export default sfx;

var port, tabId
// Setup port for communication with the background script
if (chrome) {
  try {
    tabId = chrome.devtools.inspectedWindow.tabId;
    port = chrome.runtime.connect(null, { name: "panel" });
    port.postMessage({ tabId, action: "init" });
    port.onMessage.addListener(_onMessageRecived);
    chrome.tabs.onUpdated.addListener(_onTabUpdated);

  } catch (error) {
    console.warn("not running app in chrome extension panel")
  }
}

const store = configureStore({
  reducer: {
    network: networkReducer,
    toolbar: toolbarReducer,
    clipboard: clipboardReducer,
  }
});

function _onMessageRecived({ action, data }) {
  if (action === "gRPCNetworkCall") {
    store.dispatch(networkLog(data));
  }
}

function _onTabUpdated(tId, { status }) {
  if (tId === tabId && status === "loading") {
    store.dispatch(clearLog());

export default orbs;

// SELECTORS

export const getOrbs = createSelector(
  ["orbs.orbs"],
  orbModels => orbModels
);
export const getOrbById = createSelector(
  ["orbs.orbs", "id"],
  (orbModels, id) => {
    return orbModels[id];
  }
);

export const getOrbsTouched = createSelector([
  "orbs.touchedOrbs",
  touchedOrbs => touchedOrbs
]);

export const getOrbTouched = createSelector(
  ["orbs.touchedOrbs", "id"],
  (touchedOrbs, id) => touchedOrbs.indexOf(id) > -1
);

export const getOrbsComplete = createSelector([
  "orbs.completedOrbs",
  completedOrbs => completedOrbs
]);

export const getOrbComplete = createSelector(
  ["orbs.completedOrbs", "id"],

export default chapters;

// SELECTORS

export const getActiveChapterIndex = createSelector(
  ["chapters.activeChapterIndex"],
  activeChapterIndex => activeChapterIndex
);

export const getActiveChapterData = createSelector(
  ["chapters.activeChapterIndex"],
  activeChapterIndex => CHAPTERS[activeChapterIndex]
);

export const getActiveChapterId = createSelector(
  ["chapters.activeChapterIndex"],
  activeChapterIndex => CHAPTERS[activeChapterIndex].id
);

export const getActiveChapterDuration = createSelector(
  ["chapters.activeChapterIndex"],
  activeChapterIndex => CHAPTERS[activeChapterIndex].duration
);

export const getChapterById = createSelector(
  ["id"],
  id => CHAPTERS.find(chapter => chapter.id === id)
);

chapterTimer.reset();
    return initialState;
  }
});
/* eslint-enable no-param-reassign */

export default tasksReducer;

// SELECTORS

export const getEndingChapter = createSelector(
  ["tasks.endingChapter"],
  endingChapter => endingChapter
);

export const getAllTasks = createSelector(
  ["tasks.tasks"],
  _tasks => _tasks
);

export const getActiveTask = createSelector(
  ["tasks.taskOrder", "tasks.activeTaskIndex"],
  (taskOrder, activeTaskIndex) => {
    return taskOrder[activeTaskIndex];
  }
);

export const getActiveTaskIndex = createSelector(
  ["tasks.activeTaskIndex"],
  activeTaskIndex => activeTaskIndex
);

// INITIAL STATE
const initialState = SettingsFactory.getInitialSettings();

// CONSTANTS
export const actionTypes = {};

// ACTIONS

// REDUCERS
export const settings = createReducer(initialState, {});

export default settings;

// SELECTORS

export const getOrbCount = createSelector(
  ["settings.orbCount"],
  orbCount => orbCount
);

export const getOrbSize = createSelector(
  ["settings.orbSize"],
  orbSize => orbSize
);

export const getPeriod = createSelector(
  ["settings.period"],
  period => period
);

export const getVelocityRange = createSelector(
  [

imageAlt: taskData.imageAlt,
        locations: taskData.locations,
        weighting: modifiedTaskWeight,
        points: taskData.points
      };
      result.push(genericItem);

      return result;
    }, []);

    return possibleTasks;
  }
);

// Returns pets / people save obj. Doesn't include first 2 "Save Yourself" tasks
export const getSavedMetrics = createSelector(
  ["tasks.taskOrder"],
  taskOrder => {
    return taskOrder.reduce(
      (accumulator, task, index) => {
        if (index > 1) {
          accumulator.people += task.completedResults.people;
          accumulator.pets += task.completedResults.pets;
        }
        return accumulator;
      },
      {
        people: 0,
        pets: 0
      }
    );
  }

chapterTimer.reset();
    return initialState;
  }
});
/* eslint-enable no-param-reassign */

export default tasksReducer;

// SELECTORS

export const getEndingChapter = createSelector(
  ["tasks.endingChapter"],
  endingChapter => endingChapter
);

export const getAllTasks = createSelector(
  ["tasks.tasks"],
  _tasks => _tasks
);

export const getActiveTask = createSelector(
  ["tasks.taskOrder", "tasks.activeTaskIndex"],
  (taskOrder, activeTaskIndex) => {
    return taskOrder[activeTaskIndex];
  }
);

export const getActiveTaskIndex = createSelector(
  ["tasks.activeTaskIndex"],
  activeTaskIndex => activeTaskIndex
);

import {
    createReducer,
    createAction
} from 'redux-starter-kit';

export const setAccount = createAction('setAccount');
export const setToken = createAction('setToken');
export const setAccounts = createAction('setAccounts');
export const setSelectedBankRecordId = createAction('setSelectedBankRecordId');
export const changeDealCurrencyPage = createAction('changeDealCurrencyPage');
export const setAirdropInfo = createAction('setAirdropInfo');

export const accountsReducer = createReducer({
    selected: {
        tokens: {
            basic: {},
            smart: {}
        },
        type: false,
        name: false,
        address: false,
        balance: 0,
        transactions: {
            // cached: [],
            // uncached: 0

import {
    createReducer,
    createAction
} from 'redux-starter-kit';

export const setAccount = createAction('setAccount');
export const setToken = createAction('setToken');
export const setAccounts = createAction('setAccounts');
export const setSelectedBankRecordId = createAction('setSelectedBankRecordId');
export const changeDealCurrencyPage = createAction('changeDealCurrencyPage');
export const setAirdropInfo = createAction('setAirdropInfo');

export const accountsReducer = createReducer({
    selected: {
        tokens: {
            basic: {},
            smart: {}
        },
        type: false,
        name: false,
        address: false,
        balance: 0,
        transactions: {
            // cached: [],
            // uncached: 0
        },
        selectedToken: {},