import { HttpClient, HttpClientModule } from '@angular/common/http';
import { APP_INITIALIZER, NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { BrowserModule } from '@angular/platform-browser';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { TranslateLoader, TranslateModule, TranslateService } from '@ngx-translate/core';
import { TranslateHttpLoader } from '@ngx-translate/http-loader';
import { ButtonModule } from 'primeng/button';
import { DialogService, DynamicDialogModule } from 'primeng/dynamicdialog';
import { InputSwitchModule } from 'primeng/inputswitch';
import { MenubarModule } from 'primeng/menubar';
import { firstValueFrom } from 'rxjs';

import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { ConnectWalletModule } from './components/connect-wallet/connect-wallet.module';
import { metaReducers, reducers } from './core';
import { CoreEffects } from './core/effects';
import { RouterParamsSerializer } from './core/router-params.serializer';
import { WalletService } from './core/services/wallet.service';
import { StoreModule } from '@ngrx/store';
import { StoreDevtoolsModule } from '@ngrx/store-devtools';
import { environment } from '../environments/environment';
import { EffectsModule } from '@ngrx/effects';
import { StoreRouterConnectingModule } from '@ngrx/router-store';

export function translateHttpLoaderFactory(http: HttpClient): TranslateHttpLoader {
  return new TranslateHttpLoader(http, 'assets/i18n/', '.json');
}

export function initializeFactory(
  walletService: WalletService,
  translateService: TranslateService,
): () => Promise<void> {
  return () => {
    return walletService.initialize()
      .then(() => firstValueFrom(translateService.use('en')))
      .then(() => {
        const loader = document.querySelector('div.loader');

        loader && document.body.removeChild(loader);
      });
  };
}

@NgModule({
  declarations: [
    AppComponent,
  ],
  imports: [
    BrowserAnimationsModule,
    BrowserModule,
    HttpClientModule,
    AppRoutingModule,
    MenubarModule,
    TranslateModule.forRoot({
      defaultLanguage: 'en',
      loader: {
        provide: TranslateLoader,
        useFactory: translateHttpLoaderFactory,
        deps: [HttpClient],
      },
      isolate: true,
    }),
    DynamicDialogModule,
    ButtonModule,
    InputSwitchModule,
    FormsModule,
    StoreModule.forRoot(reducers, {
      metaReducers,
      runtimeChecks: {
        strictStateImmutability: true,
        strictActionImmutability: true,
      },
    }),
    StoreDevtoolsModule.instrument({
      maxAge: 25,
      logOnly: environment.production,
    }),
    EffectsModule.forRoot([
      CoreEffects,
    ]),
    StoreRouterConnectingModule.forRoot({
      stateKey: 'router',
    }),
    ConnectWalletModule,
  ],
  bootstrap: [
    AppComponent,
  ],
  providers: [
    {
      provide: APP_INITIALIZER,
      useFactory: initializeFactory,
      deps: [WalletService, TranslateService],
      multi: true,
    },
    DialogService,
    RouterParamsSerializer,
  ],
})
export class AppModule {
}