import {
  APP_INITIALIZER,
  ApplicationConfig,
  isDevMode,
  provideExperimentalZonelessChangeDetection,
} from '@angular/core';
import { provideRouter } from '@angular/router';

import {
  MAT_ICON_DEFAULT_OPTIONS,
  MatIconRegistry,
} from '@angular/material/icon';
import { provideAnimationsAsync } from '@angular/platform-browser/animations/async';
import { provideServiceWorker } from '@angular/service-worker';
import hljs from 'highlight.js/lib/core';
import json from 'highlight.js/lib/languages/json';
import { provideMonacoEditor } from 'ngx-monaco-editor-v2';
import { routes } from './app.routes';

export const appConfig: ApplicationConfig = {
  providers: [
    provideExperimentalZonelessChangeDetection(),
    provideRouter(routes),
    provideAnimationsAsync(),
    {
      provide: APP_INITIALIZER,
      useValue: () => {
        hljs.registerLanguage('json', json);
      },
      multi: true,
    },
    {
      provide: APP_INITIALIZER,
      useFactory: (iconRegistry: MatIconRegistry) => () => {
        iconRegistry.registerFontClassAlias(
          'material-symbols-rounded',
          'material-symbols-rounded'
        );
      },
      deps: [MatIconRegistry],
      multi: true,
    },
    {
      provide: MAT_ICON_DEFAULT_OPTIONS,
      useValue: { fontSet: 'material-symbols-rounded' },
    },
    provideMonacoEditor(),
    provideServiceWorker('ngsw-worker.js', {
      enabled: !isDevMode(),
      registrationStrategy: 'registerWhenStable:30000',
    }),
  ],
};