import { APP_INITIALIZER, NgModule } from "@angular/core";
import { BrowserModule } from "@angular/platform-browser";
import { BrowserAnimationsModule } from "@angular/platform-browser/animations";

import { AppComponent } from "./app.component";
import { FormsModule } from "@angular/forms";
import { RecordKeyChord } from "./directives/record-key-chord.directive";
import { PlanDisplayModule } from "./plan-display/plan-display.module";
import { ConfigService } from "./_services/config.service";
import { MatButtonModule } from "@angular/material/button";
import { EditorComponent } from "./editor/editor.component";
import { AngularResizeEventModule } from "angular-resize-event";
import { OverlayModule } from "@angular/cdk/overlay";
import { SettingsComponent } from "./settings/settings.component";
import { MatTabsModule } from '@angular/material/tabs';
import { MAT_DIALOG_DEFAULT_OPTIONS } from "@angular/material/dialog";
import { TooltipComponent } from "./tooltip/tooltip.component";
import { HttpClientModule } from "@angular/common/http";
// import { GemFinderComponent } from "./gem-finder/gem-finder.component";

export function initializeApp(configService: ConfigService) {
  return (): Promise<any> => {
    return configService.init();
  };
}

@NgModule({
  declarations: [
    AppComponent,
  ],
  imports: [
    BrowserModule,
    FormsModule,
    PlanDisplayModule,
    MatButtonModule,
    BrowserAnimationsModule,
    EditorComponent,
    AngularResizeEventModule,
    OverlayModule,
    SettingsComponent,
    MatTabsModule,
    TooltipComponent,
    HttpClientModule
  ],
  providers: [
    {
      // Makes sure we can get the config initialized ASAP as we might need it in lots of places really early.
      provide: APP_INITIALIZER,
      useFactory: initializeApp,
      deps: [ConfigService],
      multi: true
    },
    { provide: MAT_DIALOG_DEFAULT_OPTIONS, useValue: { panelClass: 'mat-field-inside-dialog-workaround' } },
  ],
  bootstrap: [AppComponent],
})
export class AppModule { }