Skip to content

Instantly share code, notes, and snippets.

@alanxone
Last active June 11, 2018 09:04
Show Gist options
  • Save alanxone/01ea1277aa851cd0fefeb4f1982ba349 to your computer and use it in GitHub Desktop.
Save alanxone/01ea1277aa851cd0fefeb4f1982ba349 to your computer and use it in GitHub Desktop.
NGRX Tutorial - Index Reducer
// NGRX Complete Tutorial Without Pain (Angular6 / RxJS6)
// https://medium.com/@andrew.kao/ngrx-complete-tutorial-without-pain-angular6-rxjs6-5511b8cb8dac
import {
createSelector,
createFeatureSelector,
ActionReducerMap,
} from '@ngrx/store';
import * as fromAuth from '(auth reducer)';
import * as fromPermission from '(permission reducer)';
export interface TeamState {
auth: fromAuth.State;
permission: fromPermission.State;
// More "States" relates to Auth workflow can be added here
}
export const reducers: ActionReducerMap<TeamState> = {
auth: fromAuth.reducer,
permission: fromPermission.reducer
};
// Here is the best part for using NGRX in production
// By defining the "Selector", app can call and get exactly combined data it required
// `createFeatureSelector` is for selecting a "Type" (TeamState)
// When reuqesting whole "Team State", the app can call this const directly
export const selectTeamState = createFeatureSelector<TeamState>('team');
// Auth and Permission selectors are created for using individually needs.
export const selectAuthState = createSelector(
selectTeamState,
(state: TeamState) => state.auth,
)
export const selectPermissionState = createSelector(
selectTeamState,
(state: TeamState) => state.permission,
)
// Declaring useful function utlizing with the selector.
// Can be regarded as the API
// Sorry for not providing the "Permission" demo code, but I think you can understand what it should do.
export const getUserPermission = createSelector(
selectPermissionState,
fromPermission.getPermissions
);
export const getAccessibility = createSelector(
selectPermissionState,
fromPermission.isAccessible
);
export const getUserAuthStatus = createSelector(
selectAuthState,
fromAuth.isAuthenticated
)
export const getUserName = createSelector(
selectAuthState,
fromAuth.getUserName
)
export const getAuthRisk = createSelector(
selectAuthState,
fromAuth.isRisky
)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment