import { AppComponent } from './app.component';
import { BrowserModule } from '@angular/platform-browser';

/* Routing */
import { AppRoutingModule } from './app-routing.module';

/* Angular Material */
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { AngularMaterialModule } from '@app_core/components/angular-material.module';
import { APPICON4LIVE_TOKEN, APPICON4NAVBAR_TOKEN, APPICON4TEST_TOKEN, ENVIRONMENT_TOKEN, IENVIRONMENT, SUPPORTED_CULTURES_TOKEN, SUPPORTED_LANGUAGES_TOKEN } from '@app_core/injection-tokens';
import { NgModule, CUSTOM_ELEMENTS_SCHEMA, Injectable } from '@angular/core';

/* FormsModule */
import { FormsModule, ReactiveFormsModule } from '@angular/forms';

/* Components */
import { LayoutModule } from '@app_core/components/layout/layout.module';
import { NgxSpinnerModule } from 'ngx-spinner';

/*  data acess */
import { HttpInterceptorService } from '@app_core/services/http/http-interceptor.service';
import { HttpClientModule, HTTP_INTERCEPTORS } from '@angular/common/http';

/* Globals */
import { ErrorStateMatcher, ShowOnDirtyErrorStateMatcher } from '@angular/material/core';
import { DxFormModule, DxButtonModule, DxTemplateHost, DxTemplateModule, DxChartModule, DxDataGridModule } from 'devextreme-angular';
import { NgxMaskDirective, NgxMaskPipe, optionsConfig, provideNgxMask } from 'ngx-mask';
import { Router } from '@angular/router';
import { ServiceWorkerModule } from '@angular/service-worker';
import { MessageBoxModule } from '@app_core/components/message-box/message-box.module';
import { ClipboardModule } from 'ngx-clipboard';

/* Localisaton */
import { TranslateModule, TranslateService } from '@ngx-translate/core';
import { LocaleProvider } from '@app_core/services/localization/locale.provider';
import { HenselTranslateService } from '@app_core/services/localization/hensel-translate.service';
import { registerLocaleData } from '@angular/common';
import { loadMessages } from 'devextreme/localization';

import localeDe from '@angular/common/locales/de';
import localeUs from '@angular/common/locales/en';
import localeFr from '@angular/common/locales/fr';
import localeGb from '@angular/common/locales/en-GB';

export const SUPPORTED_CULTURES = ['de-DE', 'en-GB', 'en-US', 'fr-FR'];
registerLocaleData(localeDe, 'de-DE');
registerLocaleData(localeUs, 'en-US');
registerLocaleData(localeFr, 'fr-FR');
registerLocaleData(localeGb, 'en-GB');

import * as deMessages from 'devextreme/localization/messages/de.json';
loadMessages(deMessages);

// import { HammerGestureConfig, HAMMER_GESTURE_CONFIG, HammerModule } from '@angular/platform-browser';
// AoT requires an exported function for factories
// export class MyHammerConfig extends HammerGestureConfig {
//   // tslint:disable-next-line:no-angle-bracket-type-assertion
//   overrides = <any>{
//     swipe: { direction: Hammer.DIRECTION_ALL },
//   };
// }

/* Sentry */
import { APP_INITIALIZER, ErrorHandler } from '@angular/core';
import * as Sentry from '@sentry/angular';
import { SUPPORTED_LANGUAGES } from '@app_consts';
import { TranslateLoaderProvider } from '@app_core/services/localization/translation-loader.provider';
import { MAT_FORM_FIELD_DEFAULT_OPTIONS } from '@app_core/components/angular-material-index';

/* important to use mask functionality */
const maskConfig: optionsConfig = {
  validation: false,
};


declare const environment: IENVIRONMENT;
declare const appVersion: string;
declare const appBuild: string;
environment['appVersion'] = appVersion;
environment['appBuild'] = appBuild;

@Injectable()
export class SentryErrorHandler implements ErrorHandler {
  handleError(error) {
    Sentry.captureException(error.originalError || error);
  }
}

@NgModule({
  declarations: [
    AppComponent,
  ],
  imports: [
    HttpClientModule,
    BrowserModule,
    BrowserAnimationsModule,
    AngularMaterialModule,
    ReactiveFormsModule,
    FormsModule,
    DxFormModule,
    DxTemplateModule,
    DxDataGridModule,
    DxChartModule,
    DxButtonModule,
    MessageBoxModule,
    ClipboardModule,
    NgxSpinnerModule,
    NgxMaskDirective,
    NgxMaskPipe,
    TranslateModule.forRoot({loader: TranslateLoaderProvider}),
    ServiceWorkerModule.register('ngsw-worker.js', {
      enabled: true, //environment.production,
      // Register the ServiceWorker as soon as the application is stable
      // or after 30 seconds (whichever comes first).
      registrationStrategy: 'registerWhenStable:30000'
    }),
    LayoutModule,
    AppRoutingModule, // must be the last!!!
  ],
  providers: [
    DxTemplateHost,
    LocaleProvider,
    { provide: ENVIRONMENT_TOKEN, useValue: environment },
    { provide: SUPPORTED_LANGUAGES_TOKEN, useValue: SUPPORTED_LANGUAGES},
    { provide: SUPPORTED_CULTURES_TOKEN, useValue: SUPPORTED_CULTURES},
    { provide: APPICON4TEST_TOKEN, useValue: 'assets/icons/develop/dhr-icon-48x48.png'},
    { provide: APPICON4LIVE_TOKEN, useValue: 'assets/icons/production/dhr-icon-48x48.png'},
    { provide: APPICON4NAVBAR_TOKEN, useValue: 'assets/icons/main_48x48.png'},
    { provide: TranslateService, useClass: HenselTranslateService },
    { provide: HTTP_INTERCEPTORS, useClass: HttpInterceptorService, multi: true },
    { provide: MAT_FORM_FIELD_DEFAULT_OPTIONS, useValue: { floatLabel: 'auto' } },
    { provide: ErrorStateMatcher, useClass: ShowOnDirtyErrorStateMatcher },
    /* Sentry */
    { provide: ErrorHandler, useClass: SentryErrorHandler/*, useValue: Sentry.createErrorHandler({showDialog: false, })*/ },
    { provide: Sentry.TraceService, deps: [Router] },
    { provide: APP_INITIALIZER, useFactory: () => () => {}, deps: [Sentry.TraceService], multi: true },
    provideNgxMask(maskConfig)
  ],
  bootstrap: [AppComponent],
  schemas: [CUSTOM_ELEMENTS_SCHEMA],
})


export class AppModule { }