import {
  StoryObj,
  Meta,
  moduleMetadata,
  applicationConfig,
} from '@storybook/angular';
import { importProvidersFrom } from '@angular/core';

// modules
import { AngularSvgIconModule, SvgIconRegistryService } from 'angular-svg-icon';
import { NgxMaskModule } from 'ngx-mask';
import { HttpClientModule } from '@angular/common/http';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';

// utils
import { TelematicMapListConstants } from './utils/constants/telematic-map-list.constants';

// enums
import { CaTelematicMapListEnum } from './enums/ca-telematic-map-list.enum';

// components
import { CaTelematicMapListComponent } from './ca-telematic-map-list.component';

export default {
  title: 'Example/TelematicMapList',
  component: CaTelematicMapListComponent,
  argTypes: {
    isListActive: { control: CaTelematicMapListEnum.BOOLEAN },
    newTruckData: { action: CaTelematicMapListEnum.NEW_TRUCK_DATA },
  },
  decorators: [
    applicationConfig({
      providers: [importProvidersFrom(BrowserAnimationsModule)],
    }),
    moduleMetadata({
      imports: [
        // modules
        AngularSvgIconModule.forRoot(),
        NgxMaskModule.forRoot(),
        HttpClientModule,
      ],
      providers: [SvgIconRegistryService],
    }),
  ],
} as Meta;

type Story = StoryObj<CaTelematicMapListComponent>;

export const Default: Story = {
  args: {
    isListActive: false,
    trucks: TelematicMapListConstants.TELEMATIC_MAP_ARRAY,
  },
};