How to use the @reduxjs/toolkit.createSlice function in @reduxjs/toolkit

To help you get started, we’ve selected a few @reduxjs/toolkit examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github berty / berty / js / packages / store / protocol / client.js View on Github external
unaryChan,
} from '../utils'
import ExternalTransport from './externalTransport'
import { getMainSettings } from '../settings/main'
import ProtocolServiceSagaClient from './ProtocolServiceSagaClient.gen'
import MessengerServiceSagaClient from '../messenger/MessengerServiceSagaClient.gen'
import { transactions as groupsTransactions, events as groupsEvents } from '../groups'

const protocolMethodsKeys = Object.keys(gen.Methods)
const messengerMethodsKeys = Object.keys(messengerGen.Methods)

const initialState = null

const commandsNames = [...Object.keys(gen.Methods), ...Object.keys(messengerGen.Methods), 'delete']

const commandsSlice = createSlice({
	name: 'protocol/client/command',
	initialState,
	// we don't change state on commands
	reducers: makeDefaultReducers(commandsNames),
})

const eventsNames = [
	...Object.keys(evgen.EventsNames),
	'started',
	'deleted',
	'contactRequestRdvSeedUpdated',
]

const eventHandler = createSlice({
	name: 'protocol/client/event',
	initialState,
github berty / berty / js / packages / store / messenger / account.js View on Github external
initialState,
	// this is stupid but getting https://github.com/kimamula/ts-transformer-keys in might be a headache
	// maybe move commands and events definitions in .protos
	reducers: makeDefaultReducers([
		'generate',
		'create',
		'delete',
		'sendContactRequest',
		'replay',
		'open',
		'onboard',
		'handleDeepLink',
	]),
})

const eventHandler = createSlice({
	name: 'messenger/account/event',
	initialState,
	reducers: {
		created: (state, { payload }) => {
			if (!state) {
				state = {
					name: payload.name,
					onboarded: false,
				}
			}
			return state
		},
		deleted: () => {
			return null
		},
		onboarded: (state) => {
github HospitalRun / hospitalrun-frontend / src / slices / title-slice.ts View on Github external
import { createSlice, PayloadAction } from '@reduxjs/toolkit'
import { AppThunk } from '../store'

interface TitleState {
  title: string
}

const initialState: TitleState = {
  title: '',
}

const titleSlice = createSlice({
  name: 'title',
  initialState,
  reducers: {
    changeTitle(state, { payload }: PayloadAction) {
      state.title = payload
    },
  },
})

export const { changeTitle } = titleSlice.actions

export const updateTitle = (title: string): AppThunk => async (dispatch) => {
  try {
    dispatch(changeTitle(title))
  } catch (error) {
    console.log(error)
github mregni / EmbyStat / EmbyStat.Web / ClientApp / src / store / ServerStatusSlice.tsx View on Github external
import { createSlice, PayloadAction } from '@reduxjs/toolkit';

import { AppDispatch, AppThunk } from '.';
import { ServerState, UpdateSuccessFull } from '../shared/models/embystat';
import { RootState } from './RootReducer';

const initialState: ServerState = {
  missedPings: 0,
  updating: false,
  updateSuccesfull: UpdateSuccessFull.unknown,
}

const serverStatusSlice = createSlice({
  name: 'serverStatus',
  initialState,
  reducers: {
    updateState(state, action: PayloadAction) {
      return {
        ...action.payload,
      }
    },
  },
});

export const receivePingUpdate = (missedPings: number): AppThunk => async (
  dispatch: AppDispatch,
  getState: () => RootState
) => {
  const state = { ...getState().serverStatus };
github pipe-cd / pipe / pkg / app / web / src / modules / applications.ts View on Github external
adding: boolean;
  loading: boolean;
  syncing: Record;
  disabling: Record;
  fetchApplicationError: SerializedError | null;
}>({
  adding: false,
  loading: false,
  syncing: {},
  disabling: {},
  fetchApplicationError: null,
});

export type ApplicationsState = typeof initialState;

export const applicationsSlice = createSlice({
  name: MODULE_NAME,
  initialState,
  reducers: {},
  extraReducers: (builder) => {
    builder
      .addCase(fetchApplications.pending, (state) => {
        state.loading = true;
      })
      .addCase(fetchApplications.rejected, (state) => {
        state.loading = false;
      })
      .addCase(fetchApplication.pending, (state) => {
        state.fetchApplicationError = null;
      })
      .addCase(fetchApplication.fulfilled, (state, action) => {
        state.fetchApplicationError = null;
github berty / berty / js / packages / store / messenger / contact.js View on Github external
Outgoing: 'Outgoing',
}

const initialState = {
	entities: {},
}

const commandsSlice = createCommands('messenger/contact/command', initialState, [
	'acceptRequest',
	'discardRequest',
	'delete',
	'deleteAll',
	'initiateRequest',
])

const eventHandler = createSlice({
	name: 'messenger/contact/event',
	initialState,
	reducers: {
		generated: (state, { payload }) => {
			const { contacts } = payload
			for (const contact of contacts) {
				state.entities[contact.id] = contact
			}
			return state
		},
		deleted: (state, { payload: { contactPk } }) => {
			delete state.entities[contactPk]
			return state
		},
		deletedFake: (state) => {
			for (const contact of Object.values(state.entities)) {
github berty / berty / js / packages / store / messenger / member.ts View on Github external
invited: SimpleCaseReducer
	removed: SimpleCaseReducer
}

const initialState: State = {
	events: [],
	aggregates: {},
}

export type Transactions = {
	[K in keyof CommandsReducer]: CommandsReducer[K] extends SimpleCaseReducer
		? (payload: TPayload) => Generator
		: never
}

const commandHandler = createSlice({
	name: 'messenger/member/command',
	initialState,
	reducers: {
		create: (state: State) => state,
		invite: (state: State) => state,
		remove: (state: State) => state,
	},
})

const eventHandler = createSlice({
	name: 'messenger/member/event',
	initialState,
	reducers: {
		created: (state: State) => state,
		invited: (state: State) => state,
		removed: (state: State) => state,
github thiennn / myshop / myshop-react / src / store / auth-slice.ts View on Github external
import authService from "../services/auth-service";

interface IUser {
  name: string;
}

interface IAuthState {
  user?: IUser;
}

const initialState: IAuthState = {
  user: undefined,
};

export const authSlice = createSlice({
  name: "auth",
  initialState,
  reducers: {
    loginSuccess: (state, { payload }: PayloadAction) => {
      state.user = payload;
    },
    logoutSuccess: (state) => {
      state.user = undefined;
    },
  },
});

export const { loginSuccess, logoutSuccess } = authSlice.actions;

export const loginAsync = (): AppThunk => async (dispatch) => {
  await authService.loginAsync();
github pipe-cd / pipe / pkg / app / web / src / modules / application-filter-options.ts View on Github external
enabled?: { value: boolean };
  kindsList: ApplicationKind[];
  envIdsList: string[];
  syncStatusesList: ApplicationSyncStatus[];
  name: string;
};

const initialState: ApplicationFilterOptions = {
  enabled: undefined,
  kindsList: [],
  envIdsList: [],
  syncStatusesList: [],
  name: "",
};

export const applicationFilterOptionsSlice = createSlice({
  name: "applicationFilterOptions",
  initialState,
  reducers: {
    updateApplicationFilter(
      state,
      action: PayloadAction>
    ) {
      return { ...state, ...action.payload };
    },
    clearApplicationFilter() {
      return initialState;
    },
  },
});

export const {
github mregni / EmbyStat / EmbyStat.Web / ClientApp / src / store / JobSlice.tsx View on Github external
import { createSlice, PayloadAction } from '@reduxjs/toolkit';

import { AppThunk } from '.';
import { JobsContainer, Job } from '../shared/models/jobs';
import { getAllJobs } from '../shared/services/JobService';

const initialState: JobsContainer = {
  jobs: [],
  isLoaded: false,
};

const jobSlice = createSlice({
  name: 'jobs',
  initialState,
  reducers: {
    receiveJobs(state, action: PayloadAction) {
      return {
        jobs: action.payload,
        isLoaded: true,
      };
    },
    alreadyLoaded(state, action: PayloadAction) {
      return state;
    },
    updateJob(state, action: PayloadAction) {
      const jobIndex = state.jobs.findIndex((x) => x.id === action.payload.id);
      if (jobIndex !== -1) {
        state.jobs[jobIndex] = action.payload;