How to use redux-act - 10 common examples

To help you get started, we’ve selected a few redux-act examples, based on popular ways it is used in public projects.

github WorldBrain / Memex / src / overview / onboarding / reducer.ts View on Github external
// Decides whether or not to show the Congrats message
    // Set to true after all stages are done
    congratsMessage: boolean
}

const defState = {
    annotationStage: '',
    powerSearchStage: '',
    taggingStage: '',
    backupStage: '',
    showOnboardingBox: false,
    congratsMessage: false,
}

const reducer = createReducer<State>({}, defState)

reducer.on(actions.setAnnotationStage, (state, payload) => ({
    ...state,
    annotationStage: payload,
}))

reducer.on(actions.setPowerSearchStage, (state, payload) => ({
    ...state,
    powerSearchStage: payload,
}))

reducer.on(actions.setTaggingStage, (state, payload) => ({
    ...state,
    taggingStage: payload,
}))
github danilobjr / timer / src / redux / modules / toast.ts View on Github external
import { createActionDescription } from 'src/redux/utils';
import { v1 as uuid } from 'uuid';
import { delay } from 'redux-saga';
import { ToastMessage } from 'src/redux/models';
import { Toast } from 'models';

// ACTIONS

const actionDescription = createActionDescription('toast');

export const actions = {
  showMessage: createAction<ToastMessage>(actionDescription('SHOW_MESSAGE')),

  // INTERNAL
  addToast: createAction<Toast>(actionDescription('SHOW_TOAST')),
  hideToast: createAction(actionDescription('HIDE_TOAST')),
  removeToast: createAction(actionDescription('REMOVE_TOAST')),
  showToast: createAction(actionDescription('SHOW_TOAST')),
};

// STATE

const initialState = {
  toast: null as Toast,
};

export type ToastState = typeof initialState;

// REDUCER

const toast = createReducer({}, initialState.toast)
  .on(actions.addToast, (_, toast) => toast)
github WorldBrain / Memex / src / overview / results / reducer.ts View on Github external
: [...state.results, ...payload.docs]

    const annotsByDay =
        payload.annotsByDay && overwrite
            ? payload.annotsByDay
            : { ...state.annotsByDay, ...payload.annotsByDay }

    return {
        ...state,
        ...commonState,
        results,
        annotsByDay,
    }
}

const reducer = createReducer<State>({}, defState)

reducer.on(acts.setShowOnboardingMessage, (state, showOnboardingMessage) => ({
    ...state,
    showOnboardingMessage,
}))

reducer.on(acts.addTag, (state, { tag, index }) => {
    const doc = state.results[index]

    return {
        ...state,
        results: [
            ...state.results.slice(0, index),
            {
                ...doc,
                tags: [...doc.tags, tag],
github gluon-project / gluon-rxp / src / Reducers / ContactsReducer.ts View on Github external
}

const initialState: ContactsState = {
  groupClaimsBy: null,
  roomForSharing: null,
  editing: null,
  newClaimType: null,
  newClaimValue: null,
  selectedContact: null,
  list: Config.contacts.defaultList,
  claims: Config.contacts.defaultClaimsList,
  matrixClaims: [],
  hiddenDataSources: [],
}

export const reducer = createReducer({}, initialState)
reducer.on(resetToInitialState, (state: ContactsState) => {
  return initialState
})

export const toggleHiddenDataSource = createAction('Toggle hidden datasource')
reducer.on(toggleHiddenDataSource, (state: ContactsState, payload?: DataSource) => {
  let currentHiddenDataSources = [...state.hiddenDataSources]
  if (find(currentHiddenDataSources, payload)) {
    remove(currentHiddenDataSources, (source: DataSource) => {
      return source.type === payload.type && source.id === payload.id
    })
  } else {
    currentHiddenDataSources.push(payload)
  }
  return {
    ...state,
github gluon-project / gluon-rxp / src / Reducers / TokensReducer.ts View on Github external
const emptyBurnTransaction: BurnTransaction = {
  numTokens: '0',
  reward: '0',
}

const initialState: TokensState = {
  current: Config.tokens.defaultList[0].address,
  mintTransaction: emptyMintTransaction,
  burnTransaction: emptyBurnTransaction,
  new: null,
  list: Config.tokens.defaultList,
  available: [],
}

export const reducer = createReducer({}, initialState)
reducer.on(resetToInitialState, (state: TokensState) => {
  return initialState
})

export const addToken = createAction('Add token')
reducer.on(addToken, (state: TokensState, payload?: Token) => {
  return {
    ...state,
    list: uniqBy([ ...state.list, payload ], (token: Token) => token.address),
  }
})

export const selectToken = createAction('Select token')
reducer.on(selectToken, (state: TokensState, payload?: string) => {
  return {
    ...state,
github tsirlucas / soundplace / src / core / player / player.reducer.ts View on Github external
import {combineReducers} from 'redux';
import {createReducer} from 'redux-act';

import {IndexedTracks} from 'models';

import {actions} from './player.actions';

export const initialState = {
  list: null as IndexedTracks,
  isPlaying: false,
  currentTime: null as number,
  duration: null as number,
  currentId: null as string,
};

const currentId = createReducer({}, initialState.currentId).on(
  actions.playMusic,
  (_state, payload) => payload,
);

const isPlaying = createReducer({}, initialState.isPlaying)
  .on(actions.playMusic, () => true)
  .on(actions.toggle, (state) => !state);

const currentTime = createReducer({}, initialState.currentTime).on(
  actions.updateTime,
  (_state, {currentTime}) => currentTime,
);

const duration = createReducer({}, initialState.duration)
  .on(actions.updateTime, (_state, {duration}) => duration)
  .on(actions.playMusic, () => null);
github ridi / select-frontend / src / app / services / customHistory / index.ts View on Github external
import { Location } from 'history';
import { createAction, createReducer } from 'redux-act';

import { HistoryStack, updateHistoryStack } from 'app/services/customHistory/historyStack.helpers';

export * from './sagas';
export * from '../../components/CustomHistory';

export const Actions = {
  syncHistoryStack: createAction<{
    location: Location,
    stack?: HistoryStack,
  }>('syncHistoryStack'),
  navigateUp: createAction('navigateUp'),
};

export interface CustomHistoryState {
  historyStack: HistoryStack;
}

export const INITIAL_CUSTOM_HISTORY_STATE: CustomHistoryState = {
  historyStack: [],
};

export const customHistoryReducer = createReducer<typeof INITIAL_CUSTOM_HISTORY_STATE>({}, INITIAL_CUSTOM_HISTORY_STATE);

customHistoryReducer.on(Actions.syncHistoryStack, (state, action) => {
  const { stack, location } = action;
  return {
    ...state,
github Imater / 4redux / src / routes / CalendarPage / modules / holidays.js View on Github external
import { createReducer, createAction } from 'redux-act'
import { loop, Effects } from 'redux-loop'
import client from '../../../helpers/apiClient'

export const fetch = createAction('mg/holidays/getHolidays')
export const fetchSuccess = createAction('mg/holidays/getHolidaysSuccess')
export const fetchFailure = createAction('mg/holidays/getHolidaysFailure')

const initialState = {
  isLoaded: false,
  isLoading: false,
  data: {}
}

const request = (country, year) => () =>
  client.get(`https://holidayapi.com/v1/holidays?key=f988097d-8481-420d-8f86-6b29abec97c4&country=${country}&year=${year}`)
    .then(fetchSuccess)
    .catch(fetchFailure)

const handleFetch = (state, payload) => {
  const { country, year } = payload

  return loop({
github Imater / 4redux / src / routes / CalendarPage / modules / holidays.js View on Github external
import { createReducer, createAction } from 'redux-act'
import { loop, Effects } from 'redux-loop'
import client from '../../../helpers/apiClient'

export const fetch = createAction('mg/holidays/getHolidays')
export const fetchSuccess = createAction('mg/holidays/getHolidaysSuccess')
export const fetchFailure = createAction('mg/holidays/getHolidaysFailure')

const initialState = {
  isLoaded: false,
  isLoading: false,
  data: {}
}

const request = (country, year) => () =>
  client.get(`https://holidayapi.com/v1/holidays?key=f988097d-8481-420d-8f86-6b29abec97c4&country=${country}&year=${year}`)
    .then(fetchSuccess)
    .catch(fetchFailure)

const handleFetch = (state, payload) => {
  const { country, year } = payload
github gluon-project / gluon-rxp / src / Reducers / ContactsReducer.ts View on Github external
reducer.on(setGroupClaimsBy, (state: ContactsState, payload?: any) => {
  return {
    ...state,
    groupClaimsBy: payload,
  }
})

export const setRoomForSharing = createAction('Set Room For Sharing clam')
reducer.on(setRoomForSharing, (state: ContactsState, payload?: string) => {
  return {
    ...state,
    roomForSharing: payload,
  }
})

export const addContact = createAction('Add contact')
reducer.on(addContact, (state: ContactsState, payload?: User) => {
  let list = [...state.list]
  remove(list, (item: User) => {
    return item.address === payload.address
  })
  return {
    ...state,
    list: [ ...list, payload ],
  }
})

export const setForEditing = createAction('Set contact for editing')
reducer.on(setForEditing, (state: ContactsState, payload?: User) => {
  return {
    ...state,
    editing: payload,

redux-act

An opinionated lib to create actions and reducers for Redux

Apache-2.0
Latest version published 3 years ago

Package Health Score

53 / 100
Full package analysis