import type { Meta, StoryObj } from '@storybook/angular';
import { MessageBox } from './message-box';
import { moduleMetadata } from '@storybook/angular';
import { DomSanitizer, BrowserModule } from '@angular/platform-browser';
import { Copy } from 'sae-lib/buttons/copy/copy';
import { FeedbackButton } from '../feedback-button/feedback-button';
import { ChatbotMessage } from '../../services/chatbot.message.type';

const meta: Meta<MessageBox> = {
  title: 'Chatbot/Messages/MessageBox',
  component: MessageBox,
  tags: ['autodocs'],
  decorators: [
    moduleMetadata({
      imports: [Copy, FeedbackButton, BrowserModule],
      providers: []
    })
  ],
  argTypes: {
    kind: {
      control: 'select',
      options: ['user', 'llm'],
      description: "Type de message (utilisateur ou IA)"
    },
    content: {
      control: 'text',
      description: "Contenu du message"
    }
  }
};

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

export const UserMessage: Story = {
  args: {
    kind: 'user',
    content: 'Voici un message de l\'utilisateur pour tester l\'affichage.',
    message: new ChatbotMessage({
      kind: 'user',
      user: {},
      content: 'Voici un message de l\'utilisateur pour tester l\'affichage.',
      name: 'User'
    })
  }
};

export const AIMessage: Story = {
  args: {
    kind: 'llm',
    content: 'Je suis un assistant IA qui répond à vos questions. Voici une réponse détaillée qui peut contenir du <strong>HTML</strong> et des listes:<ul><li>Point 1</li><li>Point 2</li></ul>',
    message: new ChatbotMessage({
      kind: 'llm',
      user: {},
      content: 'Je suis un assistant IA qui répond à vos questions. Voici une réponse détaillée qui peut contenir du <strong>HTML</strong> et des listes:<ul><li>Point 1</li><li>Point 2</li></ul>',
      name: 'Assistant'
    })
  }
};
export const AIMessageExpanded: Story = {
  args: {
    kind: 'llm',
    content: 'Je suis un assistant IA qui répond à vos questions. Voici une réponse détaillée qui peut contenir du <strong>HTML</strong> et des listes:<ul><li>Point 1</li><li>Point 2</li></ul>',
    message: new ChatbotMessage({
      kind: 'llm',
      user: {},
      content: 'Je suis un assistant IA qui répond à vos questions. Voici une réponse détaillée qui peut contenir du <strong>HTML</strong> et des listes:<ul><li>Point 1</li><li>Point 2</li></ul>',
      name: 'Assistant'
    }),
    expanded: true,
  }
};
export const LongAIMessage: Story = {
  args: {
    kind: 'llm',
    content: `<p>Voici une réponse longue avec beaucoup de contenu pour tester comment le composant gère les grands blocs de texte.</p>
    <p>Les documents mettent également en évidence diverses mesures de sécurité post-incident mises en œuvre, notamment des procédures de formation améliorées, des protocoles de maintenance renforcés et des modifications de la conception des aéronefs. Des organismes de réglementation tels que le NTSB, le BEA, l'AAIB et d'autres ont participé à l'enquête sur ces incidents et ont formulé des recommandations de sécurité.</p>
    <p>Ce résumé donne un aperçu des incidents aéronautiques importants, de leurs causes et de leurs conséquences, ce qui peut être utile pour comprendre les schémas d'accidents d'aéronefs et les domaines à améliorer en matière de sécurité aérienne.</p>
    <br/>
    <p>Pas de recherche Internet activée.<br/>
    Aucune recherche Internet n'a été activée pour cette requête</p>
    <br/>
    <p>Résultats de recherche.</p>`,
    message: new ChatbotMessage({
      kind: 'llm',
      user: {},
      content: 'Contenu long...',
      name: 'Assistant'
    })
  }
};
