[chandu] update state list-view form updated

Author: chandru415

src/app/grid-list/container/list-base/list-base.component.ts

@@ -4,7 +4,10 @@ import { Store, select } from '@ngrx/store';
 import { Subject, Observable } from 'rxjs';
 import { takeUntil, map } from 'rxjs/operators';
 import { getGridList } from '../../store/selectors/grid-list.selectors';
-import { loadGridLists } from '../../store/actions/grid-list.actions';
+import {
+  loadGridLists,
+  UpdateListObject,
+} from '../../store/actions/grid-list.actions';
 import { FormArray } from '@angular/forms';
 import { buildFormGroup } from 'src/app/models/periodic-element-work';
 import { Update } from '@ngrx/entity';
@@ -31,5 +34,7 @@ export class ListBaseComponent implements OnInit {
     this.store.dispatch(loadGridLists());
   }
 
-  onUpdatePeridoicElement(event: Update<PeriodicElement>) {}
+  onUpdatePeridoicElement(event: Update<PeriodicElement>) {
+    this.store.dispatch(UpdateListObject({ update: event }));
+  }
 }

src/app/grid-list/store/actions/grid-list.actions.ts

@@ -1,4 +1,6 @@
 import { createAction, props } from '@ngrx/store';
+import { Update } from '@ngrx/entity';
+import { PeriodicElement } from 'src/app/models/periodic-element';
 
 export const loadGridLists = createAction(
   '[GridList] Load GridLists'
@@ -13,3 +15,8 @@ export const loadGridListsFailure = createAction(
   '[GridList] Load GridLists Failure',
   props<{ error: any }>()
 );
+
+export const UpdateListObject = createAction(
+  '[GridList] Update List Object',
+  props<{ update: Update<PeriodicElement> }>()
+);

src/app/grid-list/store/reducers/grid-list.reducer.ts

@@ -1,5 +1,5 @@
 import { createReducer, on } from '@ngrx/store';
-import * as GridListActions from 'src/app/grid-list/store/actions/grid-list.actions'
+import * as GridListActions from 'src/app/grid-list/store/actions/grid-list.actions';
 import { EntityState, createEntityAdapter, EntityAdapter } from '@ngrx/entity';
 import * as fromRoot from 'src/app/store/reducers';
 
@@ -10,29 +10,32 @@ export interface State extends fromRoot.State {
 }
 
 export interface GridState extends EntityState<any> {
-  error: any,
-  isFecting: boolean,
+  error: any;
+  isFecting: boolean;
 }
 
+export const gridAdapter: EntityAdapter<any> = createEntityAdapter<any>();
 
-export const gridAdapter: EntityAdapter<
-any
-> = createEntityAdapter<any>();
-
-export const gridInitialState: GridState = gridAdapter.getInitialState(
-  {
-    error: null,
-    isFecting: false,
-  }
-);
-
+export const gridInitialState: GridState = gridAdapter.getInitialState({
+  error: null,
+  isFecting: false,
+});
 
 export const gridReducer = createReducer(
   gridInitialState,
+  on(GridListActions.loadGridLists, (state) => {
+    return { ...state, isFecting: true };
+  }),
 
-  on(GridListActions.loadGridLists, state => { return {...state, isFecting: true}}),
-  on(GridListActions.loadGridListsSuccess, (state, action) => gridAdapter.addMany(action.data, {...state, isFecting: false})),
-  on(GridListActions.loadGridListsFailure, (state, action) => { return {...state, error: action.error, isFecting: false}}),
+  on(GridListActions.loadGridListsSuccess, (state, action) =>
+    gridAdapter.addMany(action.data, { ...state, isFecting: false })
+  ),
 
-);
+  on(GridListActions.loadGridListsFailure, (state, action) => {
+    return { ...state, error: action.error, isFecting: false };
+  }),
 
+  on(GridListActions.UpdateListObject, (state, action) =>
+    gridAdapter.updateOne(action.update, { ...state })
+  )
+);