@verisoft/store 20.0.0 → 20.1.1

package/src/lib/detail-state/detail.actions.ts

@@ -0,0 +1,89 @@
+import { createAction, props } from '@ngrx/store';
+import { FormState } from './detail.models';
+
+export function createInitDetailAction(detailsRepository: string) {
+  return createAction(
+    `[${detailsRepository} Page] Init`,
+    props<{ obj: string | null | number | undefined | any }>()
+  );
+}
+
+export function createInitNewDetailAction(detailsRepository: string) {
+  return createAction(`[${detailsRepository} Page] Init New`);
+}
+
+export function createLoadDetailSuccessAction<T>(detailsRepository: string) {
+  return createAction(
+    `[${detailsRepository}/API] Load ${detailsRepository} Success`,
+    props<{ item: T }>()
+  );
+}
+
+export function createLoadDetailFailureAction(detailsRepository: string) {
+  return createAction(
+    `[${detailsRepository}/API] Load ${detailsRepository} Failure`,
+    props<{ error: any }>()
+  );
+}
+
+export function createUpdateDetailAction<T>(detailsRepository: string) {
+  return createAction(
+    `[${detailsRepository}/API] Update ${detailsRepository}`,
+    props<{ item: T }>()
+  );
+}
+
+export function createUpdateDetailSetErrorsAction(detailsRepository: string) {
+  return createAction(
+    `[${detailsRepository}/API] Update Validation Errors ${detailsRepository}`,
+    props<{ error: any }>()
+  )
+}
+
+export function createUpdateFormStateAction(detailsRepository: string) {
+  return createAction(
+    `[${detailsRepository}/API] Update Form State`,
+    props<{ formState: FormState }>()
+  );
+}
+
+export function createSaveDetailAction(detailsRepository: string) {
+  return createAction(`[${detailsRepository}/API] Save Detail `);
+}
+
+export function createSaveDetailSuccessAction<T>(detailsRepository: string) {
+  return createAction(
+    `[${detailsRepository}/API] Save Detail Success`,
+    props<{ item: T }>()
+  );
+}
+
+export function createSaveDetailFailureAction(detailsRepository: string) {
+  return createAction(
+    `[${detailsRepository}/API] Save Detail Failure`,
+    props<{ error: any }>()
+  );
+}
+
+export function createUpdateSaveDetailAction(detailsRepository: string) {
+  return createAction(`[${detailsRepository}/API] Update Detail `);
+}
+
+export function createResetStateAction(detailsRepository: string) {
+  return createAction(`[${detailsRepository}/API] Reset State`);
+}
+
+export function createDeleteDetailAction(detailsRepository: string) {
+  return createAction(`[${detailsRepository}/API] Delete Detail`);
+}
+
+export function createDeleteDetailSuccessAction(detailsRepository: string) {
+  return createAction(`[${detailsRepository}/API] Delete Detail Success`);
+}
+
+export function createDeleteDetailFailureAction(detailsRepository: string) {
+  return createAction(
+    `[${detailsRepository}/API] Delete Detail Failure`,
+    props<{ error: any }>()
+  );
+}

package/src/lib/detail-state/detail.effects.ts

@@ -0,0 +1,283 @@
+import { Router } from '@angular/router';
+import { Actions, createEffect, ofType } from '@ngrx/effects';
+import { BaseHttpService } from '@verisoft/core';
+import {
+  catchError,
+  EMPTY,
+  map,
+  Observable,
+  of,
+  switchMap,
+  tap,
+  withLatestFrom,
+} from 'rxjs';
+import {
+  createDeleteDetailAction,
+  createDeleteDetailFailureAction,
+  createDeleteDetailSuccessAction,
+  createInitDetailAction,
+  createInitNewDetailAction,
+  createLoadDetailFailureAction,
+  createLoadDetailSuccessAction,
+  createSaveDetailAction,
+  createSaveDetailFailureAction,
+  createSaveDetailSuccessAction,
+} from './detail.actions';
+
+export interface CreateInitFormConfig<T> {
+  service?: BaseHttpService<T>;
+  get?: (obj: any) => Observable<T>;
+  snackbar?: any;
+  errorMessage?: string;
+  notFoundMessage?: string;
+  successMessge?: string;
+}
+
+export interface DetailEffectConfig<T> {
+  detail$: Observable<T | undefined>;
+  snackbar?: any;
+  router?: Router;
+  redirectPath?: string;
+  useItemId?: boolean;
+  navigationMap?: Map<keyof T, string>;
+}
+
+export function createInitDetailEffect<T>(
+  detailsRepository: string,
+  actions$: Actions,
+  config: CreateInitFormConfig<T>
+) {
+  return createEffect(() => {
+    return actions$.pipe(
+      ofType(createInitDetailAction(detailsRepository)),
+      switchMap(({ obj }) => {
+        const get$: Observable<any> = (config?.service?.get(obj as any) ??
+          config?.get?.(obj)) as Observable<any>;
+        if (!get$) return EMPTY;
+        return get$?.pipe(
+          map((item) => {
+            return createLoadDetailSuccessAction(detailsRepository)({ item });
+          }),
+          catchError((error) => {
+            if (error.status === 404) {
+              config?.snackbar?.showError(config?.notFoundMessage ?? error);
+            } else {
+              config?.snackbar?.showError(config?.errorMessage ?? error);
+            }
+
+            console.error('Error', error);
+            return of(
+              createLoadDetailFailureAction(detailsRepository)({ error })
+            );
+          })
+        );
+      })
+    );
+  });
+}
+
+export function createInitNewDetailEffect(
+  detailsRepository: string,
+  actions$: Actions
+) {
+  return createEffect(() =>
+    actions$.pipe(
+      ofType(createInitNewDetailAction(detailsRepository)),
+      map(() => {
+        return createLoadDetailSuccessAction(detailsRepository)({ item: null });
+      })
+    )
+  );
+}
+
+export function createSaveDetailEffect<
+  T extends { id: number | string },
+  SERVICE extends BaseHttpService<T>
+>(
+  detailsRepository: string,
+  actions$: Actions,
+  service: SERVICE,
+  config: DetailEffectConfig<T>
+) {
+  return createEffect(() =>
+    actions$.pipe(
+      ofType(createSaveDetailAction(detailsRepository)),
+      withLatestFrom(config.detail$),
+      switchMap(([, savedItem]) => {
+        const isNew = !savedItem?.id;
+        const saveAction = isNew
+          ? service.post(savedItem as T)
+          : service.put(savedItem.id, savedItem);
+        return saveAction.pipe(
+          map((item) => {
+            if (isNew && config?.router && config?.redirectPath) {
+              const suffix = config?.useItemId ? '/' + item.id : '';
+              config.router.navigateByUrl(config.redirectPath + suffix);
+            }
+
+            if (isNew && config?.router && config?.navigationMap) {
+              const url = constructUrlFromNavigationMap(item, config.navigationMap)
+              config.router.navigateByUrl(url);
+            }
+
+            return createSaveDetailSuccessAction(detailsRepository)({
+              item: item,
+            });
+          }),
+          catchError((error) => {
+            console.error('Error', error);
+            return of(
+              createSaveDetailFailureAction(detailsRepository)({ error })
+            );
+          })
+        );
+      })
+    )
+  );
+}
+
+export function createSaveDetailSuccessEffect(
+  detailsRepository: string,
+  actions$: Actions,
+  config?: CreateInitFormConfig<unknown>
+) {
+  return createEffect(
+    () =>
+      actions$.pipe(
+        ofType(createSaveDetailSuccessAction(detailsRepository)),
+        map((data: any) => {
+          config?.snackbar?.showSuccess(
+            config?.successMessge ?? `Item successfully saved.`
+          );
+          return createInitDetailAction(detailsRepository)({ obj: data.item.id });
+        })
+      )
+  );
+}
+
+export function createSaveDetailFailureEffect(
+  detailsRepository: string,
+  actions$: Actions,
+  config?: CreateInitFormConfig<unknown>
+) {
+  return createEffect(
+    () =>
+      actions$.pipe(
+        ofType(createSaveDetailFailureAction(detailsRepository)),
+        tap(({ error }) => {
+          config?.snackbar?.showError(
+            config.errorMessage ?? `Error saving item. ${error.message}`
+          );
+        })
+      ),
+    {
+      dispatch: false,
+    }
+  );
+}
+
+export function createDeleteDetailEffect<
+  T extends { id: number | string },
+  SERVICE extends BaseHttpService<T>
+>(
+  detailsRepository: string,
+  actions$: Actions,
+  service: SERVICE,
+  config: DetailEffectConfig<T>,
+) {
+  return createEffect(() =>
+    actions$.pipe(
+      ofType(createDeleteDetailAction(detailsRepository)),
+      withLatestFrom(config.detail$),
+      switchMap(([, savedItem]) => {
+        const id = savedItem?.id;
+        if (!id) {
+          return of(
+            createSaveDetailFailureAction(detailsRepository)({
+              error: 'Item has no id',
+            })
+          );
+        }
+
+        return service.delete(id).pipe(
+          map(() => {
+            if (config?.router && config?.redirectPath) {
+              config.router.navigateByUrl(`${config.redirectPath}`);
+            }
+
+            if (config?.router && config?.navigationMap) {
+              const url = constructUrlFromNavigationMap(savedItem, config.navigationMap)
+              config.router.navigateByUrl(url);
+            }
+
+            return createDeleteDetailSuccessAction(detailsRepository)();
+          }),
+          catchError((error) => {
+            console.error('Error', error);
+            config.snackbar?.showError('Failed to delete item.');
+            return of(
+              createDeleteDetailFailureAction(detailsRepository)({ error })
+            );
+          })
+        );
+      })
+    )
+  );
+}
+
+export function createDeleteDetailSuccessEffect(
+  detailsRepository: string,
+  actions$: Actions,
+  config?: CreateInitFormConfig<unknown>
+) {
+  return createEffect(
+    () =>
+      actions$.pipe(
+        ofType(createDeleteDetailSuccessAction(detailsRepository)),
+        tap(() => {
+          config?.snackbar?.showSuccess(
+            config.successMessge ?? `Item successfully deleted.`
+          );
+        })
+      ),
+    {
+      dispatch: false,
+    }
+  );
+}
+
+export function createDeleteDetailFailureEffect(
+  detailsRepository: string,
+  actions$: Actions,
+  config?: CreateInitFormConfig<unknown>
+) {
+  return createEffect(
+    () =>
+      actions$.pipe(
+        ofType(createDeleteDetailFailureAction(detailsRepository)),
+        tap(({ error }) => {
+          config?.snackbar?.showError(
+            config.errorMessage ?? `Error deleting item. ${error.message}`
+          );
+        })
+      ),
+    {
+      dispatch: false,
+    }
+  );
+}
+
+function constructUrlFromNavigationMap<T extends object>(
+  item: T,
+  navigationMap: Map<keyof T, string>)
+  : string {
+  let url = '';
+  navigationMap.forEach((urlPartValue, suffixPropertyKey) => {
+    const suffix = item[suffixPropertyKey];
+    if (suffix) {
+      url += `${urlPartValue}/${suffix}`;
+    }
+  });
+
+  return url;
+}

package/src/lib/detail-state/detail.models.ts

@@ -0,0 +1,42 @@
+export interface DetailState<T> {
+  loaded: boolean;
+  item?: T;
+  formState?: FormState;
+  error?: string | null;
+  saveItemState: SaveItemState;
+  backendValidationErrors: BackendValidationError[];
+}
+
+export interface BackendValidationError {
+  code: string;
+  message: string;
+  parameters: string;
+}
+
+export interface ChosenRowsState<T> { 
+  rows: Array<T>;
+}
+
+export interface SaveItemState {
+  saveInProgress: boolean;
+  error?: string | null;
+}
+
+export const INITIAL_SAVE_ITEM_STATE: SaveItemState = {
+  saveInProgress: false,
+};
+
+export const INITIAL_CHOSEN_ROW_STATE: ChosenRowsState<any> = {
+  rows: []
+}
+
+export const INITIAL_DETAIL_STATE: DetailState<any> = {
+  loaded: false,
+  saveItemState: INITIAL_SAVE_ITEM_STATE,
+  backendValidationErrors: [],
+};
+
+export interface FormState {
+  dirty: boolean;
+  valid: boolean;
+}

package/src/lib/detail-state/detail.reducer.ts

@@ -0,0 +1,147 @@
+import { ActionCreator, createReducer, on, ReducerTypes } from '@ngrx/store';
+import {
+  createInitDetailAction,
+  createInitNewDetailAction,
+  createLoadDetailFailureAction,
+  createLoadDetailSuccessAction,
+  createResetStateAction,
+  createSaveDetailAction,
+  createSaveDetailFailureAction,
+  createSaveDetailSuccessAction,
+  createUpdateDetailAction,
+  createUpdateDetailSetErrorsAction,
+  createUpdateFormStateAction,
+} from './detail.actions';
+import {
+  DetailState,
+  INITIAL_DETAIL_STATE,
+  INITIAL_SAVE_ITEM_STATE,
+} from './detail.models';
+
+export function createDetailReducers<
+  T = any,
+  TState extends DetailState<T> = DetailState<T>
+>(
+  detailRepository: string,
+  initialState: TState = INITIAL_DETAIL_STATE as unknown as TState,
+  ...ons: ReducerTypes<TState, readonly ActionCreator[]>[]
+) {
+  return createReducer(
+    initialState,
+    on(createInitDetailAction(detailRepository), (state) => {
+      return {
+        ...state,
+        loaded: false,
+        error: null,
+      };
+    }),
+
+    on(createInitNewDetailAction(detailRepository), (state) => {
+      return {
+        ...state,
+        loaded: false,
+        error: null,
+      };
+    }),
+
+    on(createLoadDetailSuccessAction(detailRepository), (state, { item }) => {
+      return {
+        ...state,
+        loaded: true,
+        item,
+      };
+    }),
+
+    on(createLoadDetailFailureAction(detailRepository), (state, { error }) => {
+      return {
+        ...state,
+        loaded: true,
+        error,
+      };
+    }),
+
+    on(createUpdateDetailAction(detailRepository), (state, { item }) => {
+      return {
+        ...state,
+        item,
+        formState: {
+          dirty: true,
+          valid: state.formState?.valid ?? true,
+        },
+      };
+    }),
+
+    on(createUpdateDetailSetErrorsAction(detailRepository), (state, { error }) => {
+      return {
+        ...state,
+        backendValidationErrors: error
+      }
+    }),
+
+    on(
+      createUpdateFormStateAction(detailRepository),
+      (state, { formState }) => {
+        return {
+          ...state,
+          formState,
+        };
+      }
+    ),
+
+    on(createSaveDetailSuccessAction(detailRepository), (state) => {
+      return {
+        ...state,
+        formState: {
+          dirty: false,
+          valid: state.formState?.valid ?? true,
+        },
+      };
+    }),
+    
+    on(createResetStateAction(detailRepository), () => {
+      return {
+        ...(initialState as any),
+      };
+    }),
+    
+    on(createSaveDetailFailureAction(detailRepository), (state, { error }) => {
+      return {
+        ...state,
+        backendValidationErrors: error.error
+      }
+    }),
+    ...ons
+  );
+}
+
+export function createSaveDetailReducers(
+  detailRepository: string,
+  initialState = INITIAL_SAVE_ITEM_STATE
+) {
+  return createReducer(
+    initialState,
+
+    on(createSaveDetailAction(detailRepository), (state) => {
+      return {
+        ...state,
+        saveInProgress: true,
+      };
+    }),
+
+    on(createSaveDetailSuccessAction(detailRepository), (state, { item }) => {
+      return {
+        ...state,
+        item,
+        saveInProgress: false,
+      };
+    }),
+
+    on(createSaveDetailFailureAction(detailRepository), (state, { error }) => {
+      return {
+        ...state,
+        error,
+        saveInProgress: false,
+      };
+    })
+  );
+}

package/src/lib/table-state/actions.ts

@@ -0,0 +1,93 @@
+import { createAction, props } from '@ngrx/store';
+import { Page, Sort } from '@verisoft/core';
+
+enum TablePageAction {
+  GET_PAGE = 'Get page',
+  CREATE_STATIC_FILTER = 'Create static filter',
+  DATA_LOAD_SUCCESS = 'Data load success',
+  DATA_LOAD_ERROR = 'Data load error',
+  REFRESH_PAGE = 'Refresh page',
+  FILTER_PAGE = 'Filter page',
+  CHANGE_PAGE_SIZE = 'Change page size',
+  SORT_PAGE = 'Sort page',
+  DESTROY = 'Destroy',
+  SELECT_ITEMS = 'Select items',
+  REMOVE_RANGE = 'Remove range',
+}
+
+export function createGetPageTableAction<T = any>(tableRepository: string) {
+  return createAction(
+    `${tableRepository} ${TablePageAction.GET_PAGE}`,
+    props<{
+      page: number;
+      size: number;
+      id?: string | null;
+      filter?: Partial<T>;
+      sort?: Sort[];
+    }>()
+  );
+}
+
+export function createStaticFilterTableAction<T = any>(
+  tableRepository: string
+) {
+  return createAction(
+    `${tableRepository} ${TablePageAction.CREATE_STATIC_FILTER}`,
+    props<{
+      filter?: Partial<T>;
+    }>()
+  );
+}
+
+export function createDataLoadSuccessTableAction<T>(tableRepository: string) {
+  return createAction(
+    `${tableRepository} ${TablePageAction.DATA_LOAD_SUCCESS}`,
+    props<{ gPage: Page<T> }>()
+  );
+}
+
+export function createDataLoadErrorTableAction(tableRepository: string) {
+  return createAction(
+    `${tableRepository} ${TablePageAction.DATA_LOAD_ERROR}`,
+    props<{ error: any }>()
+  );
+}
+
+export function createChangePageSizeTableAction(tableRepository: string) {
+  return createAction(
+    `${tableRepository} ${TablePageAction.CHANGE_PAGE_SIZE}`,
+    props<{ size: number }>()
+  );
+}
+
+// TODO: use action in delete item effect
+export function createRefreshPageTableAction(tableRepository: string) {
+  return createAction(`${tableRepository} ${TablePageAction.REFRESH_PAGE}`);
+}
+
+export function createFilterPageTableAction<T>(tableRepository: string) {
+  return createAction(
+    `${tableRepository} ${TablePageAction.REFRESH_PAGE}`,
+    props<{ filter: Partial<T> }>()
+  );
+}
+
+export function createResetTableFilterAction(tableRepository: string) {
+  return createAction(`${tableRepository} ${TablePageAction.REFRESH_PAGE}`);
+}
+
+export function createDestroyTableAction(tableRepository: string) {
+  return createAction(`${tableRepository} ${TablePageAction.DESTROY}`);
+}
+
+export function createSelectItemsTableAction<T>(tableRepository: string) {
+  return createAction(
+    `${tableRepository} ${TablePageAction.SELECT_ITEMS}`,
+    props<{ selectedItems: T[] }>()
+  );
+}
+
+export function createRemoveRangeTableAction(tableRepository: string) {
+  return createAction(`${tableRepository} ${TablePageAction.REMOVE_RANGE}`
+  );
+}