Skip to content

Instantly share code, notes, and snippets.

Avatar

Alex Okrushko alex-okrushko

View GitHub Profile
View create-reducer.ts
export const initialState: State = adapter.getInitialState({
selectedBookId: null,
});
export const reducer = createReducer(
initialState,
on(
BooksApiActions.searchSuccess,
CollectionApiActions.loadBooksSuccess,
(state, { books }) => adapter.addMany(books, state)
View action-creator-v2-with-payload.ts
/** Action to log in the User from the Login Page */
export const login = createAction(
'[Login Page] Login',
// notice 👇 payload wrapping
props<{payload: {username: string; password: string;}}>(),
)
View oftype-with-action-creator.ts
export class MyEffects {
constructor(private readonly actions$: Actions) {}
@Effect
login$ = this.actions$.pipe(
ofType(login), // provide type safety *without* ActionsUnion
...
)
}
View oftype-with-string.ts
export class MyEffects {
constructor(private readonly actions$: Actions<ActionsUnion>) {}
@Effect
login$ = this.actions$.pipe(
// ensures type safety only when ActionsUnion is provided
ofType(login.type),
...
)
View action-creator-v2-with-creator-fn.ts
/**
* Action to log in the User from the Login Page.
* Uses the most secure password by default.
*/
export const login = createAction(
'[Login Page] Login',
(username: string, password = 'p@ssw0rdLol') => ({username, password}),
);
View action-creator-v2-reducer-effect.ts
function reducer(state, action) {
switch(action.type) {
case login.type: { // <----- usage in reducer
...
}
}
}
@Effect
View action-creator-v2.ts
/** Action to log in the User from the Login Page */
export const login = createAction(
'[Login Page] Login',
props<{username: string; password: string;}>(),
)
View google-ac-example.ts
/** see below - comment is required for all exported symbols */
export const LOGIN = '[Login Page] Login',
interface LoginPayload {
username: string;
password: string;
}
/** Action to log in the User from the Login Page */
export class Login implements Action {
View ngrx-io-example.ts
export enum ActionTypes {
Login = '[Login Page] Login',
}
export class Login implements Action {
readonly type = ActionTypes.Login;
constructor(public payload: { username: string; password: string }) {}
}
You can’t perform that action at this time.