import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { HttpClientModule } from '@angular/common/http';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import {
StoreModule,
ActionReducerMap,
ActionReducer,
MetaReducer
} from '@ngrx/store';
import { EffectsModule } from '@ngrx/effects';
import { StoreRouterConnectingModule } from '@ngrx/router-store';
import { StoreDevtoolsModule } from '@ngrx/store-devtools';
import { localStorageSync } from 'ngrx-store-localstorage';
import { SharedModule } from './shared/shared.module';
import { AppComponent } from './app.component';
import { HeaderComponent } from './shared/layout/header/header.component';
import { HomeComponent } from './home/home.component';
import { AppRoutingModule } from './app-routing.module';
import { reducers } from './store/reducers';
import { environment } from '../environments/environment';
import { FilmsEffects } from './store/effects/films';
// const reducers: ActionReducerMap<IState> = {todos, visibilityFilter};
export function localStorageSyncReducer(
reducer: ActionReducer<any>
): ActionReducer<any> {
return localStorageSync({
keys: ['rootState'],
rehydrate: true
})(reducer);
}
const metaReducers: Array<MetaReducer<any, any>> = [localStorageSyncReducer];
@NgModule({
declarations: [AppComponent, HeaderComponent, HomeComponent],
imports: [
BrowserModule,
HttpClientModule,
BrowserAnimationsModule,
FormsModule,
ReactiveFormsModule,
SharedModule,
AppRoutingModule,
StoreModule.forRoot(reducers),
EffectsModule.forRoot([FilmsEffects]),
StoreRouterConnectingModule,
!environment.production ? StoreDevtoolsModule.instrument() : [],
StoreModule.forRoot(reducers, { metaReducers })
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule {}