import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';

import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import {LoginComponent} from "./auth/login/login.component";
import {FormsModule, ReactiveFormsModule} from "@angular/forms";
import {HttpClient, HttpClientModule, HttpHandler} from "@angular/common/http";
import {ApiModule, Configuration} from "../api";
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import {MatToolbarModule} from "@angular/material/toolbar";
import {MatIconModule} from "@angular/material/icon";
import {MatDialogModule as MatDialogModule} from "@angular/material/dialog";
import {MatFormFieldModule as MatFormFieldModule} from "@angular/material/form-field";
import {MatInputModule as MatInputModule} from "@angular/material/input";
import {MatProgressSpinnerModule as MatProgressSpinnerModule} from "@angular/material/progress-spinner";
import {MatSnackBar as MatSnackBar, MatSnackBarModule as MatSnackBarModule} from "@angular/material/snack-bar";
import { AdminDashboardComponent } from './admin-dashboard/admin-dashboard.component';
import { MainComponent } from './main/main.component';
import { UsermanagementComponent } from './admin-dashboard/usermanagement/usermanagement.component';

import {AuthService} from "./auth.service";
import {environment} from "../environments/environment";

import { DeleteConfirmationComponent } from './admin-dashboard/usermanagement/delete-confirmation/delete-confirmation.component';
import { EditComponent } from './admin-dashboard/usermanagement/edit/edit.component';

import {UserSettingsComponent} from "./user-settings/user-settings.component";
import {AccountSettingsComponent} from "./user-settings/account-settings/account-settings.component";
import { ChangePasswordComponent } from './user-settings/account-settings/change-password/change-password.component';
import { ManageEmailComponent } from './user-settings/account-settings/manage-email/manage-email.component';
import { DeleteAccountComponent } from './user-settings/account-settings/delete-account/delete-account.component';
import { RegistrationComponent } from './auth/registration/registration.component';
import { SettingsComponent } from './admin-dashboard/settings/settings.component';

import { TaskgroupDashboardComponent } from './taskgroups/taskgroup-dashboard/taskgroup-dashboard.component';
import { TaskgroupCreationComponent } from './taskgroups/taskgroup-creation/taskgroup-creation.component';
import { TaskgroupDeletionComponent } from './taskgroups/taskgroup-deletion/taskgroup-deletion.component';
import { TaskEditorComponent } from './tasks/task-editor/task-editor.component';
import {MatDatepickerModule} from "@angular/material/datepicker";
import {MatButtonModule} from "@angular/material/button";
import {MatMenuModule} from "@angular/material/menu";
import {MatTabsModule} from "@angular/material/tabs";
import {MatTableModule} from "@angular/material/table";
import {MatCheckboxModule} from "@angular/material/checkbox";
import {MatCardModule} from "@angular/material/card";
import {MatListModule} from "@angular/material/list";
import {DateAdapter, MAT_DATE_FORMATS, MAT_DATE_LOCALE, MatNativeDateModule} from "@angular/material/core";
import {MatMomentDateModule, MomentDateModule} from "@angular/material-moment-adapter";
import { TaskDashboardComponent } from './tasks/task-dashboard/task-dashboard.component';
import {MatSlideToggleModule} from "@angular/material/slide-toggle";
import {MatSortModule} from "@angular/material/sort";
import {MatPaginatorModule} from "@angular/material/paginator";

@NgModule({
  declarations: [
    AppComponent,
    LoginComponent,
    AdminDashboardComponent,
    MainComponent,
    UsermanagementComponent,
    DeleteConfirmationComponent,
    EditComponent,
    UserSettingsComponent,
    AccountSettingsComponent,
    ChangePasswordComponent,
    ManageEmailComponent,
    DeleteAccountComponent,
    RegistrationComponent,
    SettingsComponent,
    TaskgroupDashboardComponent,
    TaskgroupCreationComponent,
    TaskgroupDeletionComponent,
    TaskEditorComponent,
    TaskDashboardComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    FormsModule,
    ApiModule,
    HttpClientModule,
    BrowserAnimationsModule,
    MatToolbarModule,
    MatButtonModule,
    MatIconModule,
    MatDialogModule,
    MatFormFieldModule,
    MatInputModule,
    MatProgressSpinnerModule,
    MatSnackBarModule,
    MatMenuModule,
    MatTabsModule,
    MatTableModule,
    MatCheckboxModule,
    MatCardModule,
    ReactiveFormsModule,
    MatListModule,
    MatDatepickerModule,
    MatInputModule,
    MatDatepickerModule,
    MatMomentDateModule,
    FormsModule,
    MatSlideToggleModule,
    MatSortModule,
    MatPaginatorModule
  ],
  providers: [
    HttpClientModule,
    /*
     This is the configuration for the code generated by OpenApiGenerator.
     It specifies that the API code should use our `AuthService` to get the currently stored
     JWT token.

     It also specifies where the base path (e.g. https://example.com/api/) for the api is.
    */
    {
      provide: Configuration,
      useFactory: (authService: AuthService) => new Configuration(
        {
          credentials: {
            // We bind the `getAccessToken` function. This means that
            // the `this` instance in the `getAccessToken` function is bound to the singleton instance
            // Angular injected. Else, the function would be called without context and would lose its
            // context
            "API_TOKEN": authService.getAccessToken.bind(authService)
          },
          //basePath: environment.api
        }
      ),
      deps: [AuthService],
      multi: false
    },
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }