import type {Meta, StoryObj} from '@storybook/angular';
import {moduleMetadata} from '@storybook/angular';
import {WarningBugs} from './warning-bugs';
import {CommonModule} from '@angular/common';
import {AlertBox} from 'sae-lib/alert-box/alert-box';
import {Store} from '@ngrx/store';
// import { BrowserAnimationsModule } from '@angular/platform-browser/animations';

// Mock Store
const storeMock = {};

const meta: Meta<WarningBugs> = {
  title: 'Chatbot/Feedback/WarningBugs',
  component: WarningBugs,
  tags: ['autodocs'],
  decorators: [
    moduleMetadata({
      imports: [
        CommonModule,
        AlertBox,
        // BrowserAnimationsModule
      ],
      providers: [
        {
          provide: Store,
          useValue: storeMock
        }
      ]
    })
  ],
  parameters: {
    docs: {
      description: {
        component: 'The WarningBugs component displays either a warning or an error message based on the application state.'
      }
    }
  }
};

export default meta;
type Story = StoryObj<WarningBugs>;

// Default state: Warning about AI making mistakes
export const Warning: Story = {
  parameters: {
    docs: {
      description: {
        story: 'Default state showing a warning about AI potentially making mistakes.'
      }
    }
  },
  decorators: [
    moduleMetadata({
      providers: [
        {
          provide: Store,
          useValue: false
        }
      ]
    })
  ]
};

// Error state: System error message
export const ErrorState: Story = {
  parameters: {
    docs: {
      description: {
        story: 'Error state showing a system error message when the request cannot be processed.'
      }
    }
  },
  decorators: [
    moduleMetadata({
      providers: [
        {
          provide: Store,
          useValue: true
        }
      ]
    })
  ]
};
