Dive into secure and efficient coding practices with our curated list of the top 10 examples showcasing 'typesafe-actions' in functional components in JavaScript. Our advanced machine learning engine meticulously scans each line of code, cross-referencing millions of open source libraries to ensure your implementation is not just functional, but also robust and secure. Elevate your React applications to new heights by mastering the art of handling side effects, API calls, and asynchronous operations with confidence and precision.
notifications: (state = { results: [], refreshing: false }, action) => {
switch (action.type) {
case getType(actions.refreshNotificationsStart):
return { ...state, refreshing: true }
case getType(actions.refreshNotificationsSuccess): {
// Add it to our list for display
const { results } = action.payload
return { ...state, results, refreshing: false }
}
case getType(actions.refreshNotificationsFailure):
return { ...state, refreshing: false }
case getType(actions.newNotificationRequest): {
// Useful so that new notifications you receive while staring at the Feed will just pop in
const results = state.results.slice(0, 99)
results.unshift(action.payload.notification)
return { ...state, results }
}
default:
return state
}
},
import { createAction } from 'typesafe-actions';
import { GraphNode, Label, UpdateLabel, UpdateGraphNode } from './types';
// Add Node
export const requestAddNode = createAction('GRAPH_REQUEST_ADD_NODE');
export const successAddNode = createAction('GRAPH_ADD_NODE', (node: GraphNode) => ({
type: 'GRAPH_ADD_NODE',
payload: node,
}));
export const failureAddNode = createAction('GRAPH_FAILURE_ADD_NODE', (error: string) => ({
type: 'GRAPH_FAILURE_ADD_NODE',
payload: error,
}));
export const requestRemoveNode = createAction('GRAPH_REQUEST_REMOVE_NODE', (node: GraphNode) => ({
type: 'GRAPH_REQUEST_REMOVE_NODE',
payload: node
}));
export const successRemoveNode = createAction('GRAPH_REMOVE_NODE', (node: GraphNode) => ({
type: 'GRAPH_REMOVE_NODE',
payload: node,
}));
export const failureRemoveNode = createAction('GRAPH_FAILURE_REMOVE_NODE', (error: string) => ({
type: 'GRAPH_FAILURE_REMOVE_NODE',
payload: error,
}));
import { RootState } from './Types'
const actions = {
onboardingSuccess: createAction('ONBOARDING_SUCCESS', resolve => {
return () => resolve()
}),
toggleVerboseUi: createAction('TOGGLE_VERBOSE_UI', resolve => {
return () => resolve()
}),
completeTourSuccess: createAction('COMPLETE_TOUR_SUCCESS', resolve => {
return (tourKey: TourScreens) => resolve({ tourKey })
}),
toggleServicesRequest: createAction('TOGGLE_SERVICES_REQUEST', resolve => {
return (name: ServiceType, status?: boolean) => resolve({ name, status })
}),
toggleStorageRequest: createAction('TOGGLE_STORAGE_REQUEST', resolve => {
return (name: StorageType, status?: boolean) => resolve({ name, status })
}),
updateViewSetting: createAction('TOGGLE_VIEW_SETTING', resolve => {
return (name: string, value: string) => resolve({ name, value })
}),
// Verbose UI options
toggleNodeStateNotifications: createAction(
'TOGGLE_NODE_STATE_NOTIFICATIONS',
resolve => {
return () => resolve()
}
),
toggleNodeStateOverlay: createAction('TOGGLE_NODE_STATE_OVERLAY', resolve => {
return () => resolve()
}),
toggleNodeErrorNotifications: createAction(
"app/TOGGLE_SHOW_HIDDEN_BOOKMARK"
)(),
setQuery: createStandardAction("app/SET_QUERY")(),
// Bookmark actions
retrieveBookmarks: createStandardAction("bookmark/RETRIEVE_BOOKMARK")(),
retrieveBookmarksSuccess: createStandardAction(
"bookmark/RETRIEVE_BOOKMARK_SUCCESS"
)<{
foldersById: { [id: string]: ChromeBookmark };
bookmarksById: { [id: string]: ChromeBookmark };
}>(),
hideBookmark: createStandardAction("bookmarks/HIDE_BOOKMARK")(),
showBookmark: createStandardAction("bookmarks/SHOW_BOOKMARK")(),
hideFolder: createStandardAction("bookmarks/HIDE_FOLDER")(),
showFolder: createStandardAction("bookmarks/SHOW_FOLDER")(),
// Theme actions
goToNextTheme: createStandardAction("theme/GO_TO_NEXT_THEME")(),
// Other
rehydrate: createStandardAction("other/REHYDRATE_REQUEST")(),
rehydrateSuccess: createStandardAction("other/REHYDRATE_SUCCESS")<
ReduxPersistedState
>()
};
export const update = createStandardAction('inventory/UPDATE')<{
stores: DimStore[];
buckets?: InventoryBuckets;
newItems?: Set;
profileResponse?: DestinyProfileResponse;
}>();
/**
* Set the bucket info.
*/
export const setBuckets = createStandardAction('inventory/SET_BUCKETS')();
/**
* Move an item from one store to another.
*/
export const moveItem = createStandardAction('inventory/MOVE_ITEM')<{
item: DimItem;
source: DimStore;
target: DimStore;
equip: boolean;
amount: number;
}>();
// TODO: tags/notes should probably be their own part of state
export const setTag = createStandardAction('inventory/SET_TAG')<{
itemId: string;
tag: string;
}>();
/** Update the set of new items. */
export const setNewItems = createStandardAction('new_items/SET')>();
import { ReduxPersistedState } from "./../types/ReduxPersistedState";
import { createStandardAction } from "typesafe-actions";
export const actions = {
// Game actions
startGame: createStandardAction("game/START_GAME")(),
startNewRound: createStandardAction("game/START_NEW_ROUND")(),
play: createStandardAction("game/PLAY")(),
showInterlude: createStandardAction("game/SHOW_INTERLUDE")(),
endGame: createStandardAction("game/END_GAME")<{ score: number }>(),
showResult: createStandardAction("game/SHOW_RESULT")(),
tap: createStandardAction("game/TAP")(),
timerTick: createStandardAction("game/TIMER_TICK")(),
// Router actions
navigateToPlayground: createStandardAction("router/NAVIGATE_TO_PLAYGROUND")(),
navigateToMenu: createStandardAction("router/NAVIGATE_TO_MENU")(),
// Other generic actions
rehydrate: createStandardAction("app/REHYDRATE_REQUEST")(),
rehydrateSuccess: createStandardAction("app/REHYDRATE_SUCCESS")<
ReduxPersistedState
>()
};
import { DestinyProfileResponse } from 'bungie-api-ts/destiny2';
/**
* Reflect the old stores service data into the Redux store as a migration aid.
*/
export const update = createStandardAction('inventory/UPDATE')<{
stores: DimStore[];
buckets?: InventoryBuckets;
newItems?: Set;
profileResponse?: DestinyProfileResponse;
}>();
/**
* Set the bucket info.
*/
export const setBuckets = createStandardAction('inventory/SET_BUCKETS')();
/**
* Move an item from one store to another.
*/
export const moveItem = createStandardAction('inventory/MOVE_ITEM')<{
item: DimItem;
source: DimStore;
target: DimStore;
equip: boolean;
amount: number;
}>();
// TODO: tags/notes should probably be their own part of state
export const setTag = createStandardAction('inventory/SET_TAG')<{
itemId: string;
tag: string;
createAsyncAction,
getType,
createStandardAction
} from "typesafe-actions";
import * as firebase from "firebase";
import { withPrefix } from "store/utils";
import { eventChannel } from "redux-saga";
import { call, take, put, fork } from "redux-saga/effects";
export const loadUsers = createAsyncAction(
withPrefix("LOAD_USERS_REQUEST"),
withPrefix("LOAD_USERS_SUCCESS"),
withPrefix("LOAD_USERS_FAILURE")
)();
export const updateCurrentUser = createStandardAction(
withPrefix("UPDATE_CURRENT_USER")
)();
/**
* state = {
* me // currentUser
* users // other users -> 50 of them will be stored
* }
*/
export const reducer = (state = {}, action) => {
switch (action.type) {
case getType(updateCurrentUser): {
return {
...state,
me: action.payload
};
// Action Creators allow us to create typesafe utilities for dispatching actions
import { ActionType, createAction, createStandardAction } from 'typesafe-actions';
import { GraphType } from '../types/Graph';
import { EdgeLabelMode } from '../types/GraphFilter';
import { ActionKeys } from './ActionKeys';
export const GraphFilterActions = {
setEdgelLabelMode: createStandardAction(ActionKeys.GRAPH_FILTER_SET_EDGE_LABEL_MODE)(),
setFindValue: createStandardAction(ActionKeys.GRAPH_FILTER_SET_FIND_VALUE)(),
setGraphType: createStandardAction(ActionKeys.GRAPH_FILTER_SET_GRAPH_TYPE)(),
setHideValue: createStandardAction(ActionKeys.GRAPH_FILTER_SET_HIDE_VALUE)(),
setShowUnusedNodes: createStandardAction(ActionKeys.GRAPH_FILTER_SET_SHOW_UNUSED_NODES)(),
// Toggle actions
showGraphFilters: createStandardAction(ActionKeys.ENABLE_GRAPH_FILTERS)(),
toggleCompressOnHide: createAction(ActionKeys.GRAPH_FILTER_TOGGLE_COMPRESS_ON_HIDE),
toggleGraphNodeLabel: createAction(ActionKeys.GRAPH_FILTER_TOGGLE_GRAPH_NODE_LABEL),
toggleLegend: createAction(ActionKeys.GRAPH_FILTER_TOGGLE_LEGEND),
toggleGraphVirtualServices: createAction(ActionKeys.GRAPH_FILTER_TOGGLE_GRAPH_VIRTUAL_SERVICES),
toggleGraphCircuitBreakers: createAction(ActionKeys.GRAPH_FILTER_TOGGLE_GRAPH_CIRCUIT_BREAKERS),
toggleGraphMissingSidecars: createAction(ActionKeys.GRAPH_FILTER_TOGGLE_GRAPH_MISSING_SIDECARS),
toggleGraphSecurity: createAction(ActionKeys.GRAPH_FILTER_TOGGLE_GRAPH_SECURITY),
toggleFindHelp: createAction(ActionKeys.GRAPH_FILTER_TOGGLE_FIND_HELP),
toggleServiceNodes: createAction(ActionKeys.GRAPH_FILTER_TOGGLE_SERVICE_NODES),
toggleTrafficAnimation: createAction(ActionKeys.GRAPH_FILTER_TOGGLE_TRAFFIC_ANIMATION),
toggleUnusedNodes: createAction(ActionKeys.GRAPH_FILTER_TOGGLE_UNUSED_NODES)
};
import { createStandardAction as action, createAsyncAction as asyncAction } from 'typesafe-actions'
import { Perspective, Item, Route } from './types'
import { Dispatch } from 'redux';
// TODO export every action separatelly and then import all
const setEntriesOrdering = action('editor/SET_ENTRIES_ORDERING')()
const setEntriesLevels = action('editor/SET_ENTRIES_LEVELS')()
const addItem = action('editor/ADD_ITEM')()
const deleteItems = action('editor/DELETE_ITEMS')()
const changeItems = action('editor/CHANGE_ITEMS')()
const focusItem = action('editor/FOCUS_ITEM')<{ entryId: string }>()
const repeatLastAction = action('editor/REPEAT_LAST_ACTION')()
const scheduleNextUpdate = action('editor/SCHEDULE_NEXT_UPDATE')()
const addActionToQueue = action('editor/ADD_ACTION_TO_QUEUE')()
const openItem = action('editor/OPEN_ITEM')()
const onIndexChange = action('editor/ON_INDEX_CHANGE')()
const activateNextRoute = action('editor/ACTIVATE_NEXT_ROUTE')()
const onFocusedItemChange = action('editor/ON_FOCUSED_ITEM_CHANGE')<{ route: Route, position: number, item: Item}>()
export default {
onFocusedItemChange,
activateNextRoute,
onIndexChange,
openItem,
addActionToQueue,
scheduleNextUpdate,
focusItem,
changeItems,