import ChatBot from '#amidala/wcs/shared/chat-bot/chat-bot.js'

const { h, preactHooks, register } = globalThis.ami
const { useState } = preactHooks

const DELAY = 1000 // Simulate lag.

function ChatbotTest () {
  const [state, setState] = useState({ messages: [], isBusy: true })

  return h(ChatBot, {
    buttonText: 'Ask us',
    headerText: 'Test chatbot',
    closeText: 'Close window',
    attachText: 'Attach file',
    inputText: 'Type your message here',
    sendText: 'Send message',
    icon: null,
    isBusy: state.isBusy,
    forceOpen: false,
    messages: state.messages,
    onInit () {
      setTimeout(() => {
        setState(prevState => ({ ...prevState, messages: [...prevState.messages, { isBot: true, children: ['Hello!'], timestamp: new Date() }], isBusy: false }))
      }, DELAY)
    },
    onSend (userMessage) {
      setState(prevState => ({ ...prevState, messages: [...prevState.messages, { children: [userMessage], timestamp: new Date() }], isBusy: true }))

      setTimeout(() => {
        setState(prevState => ({ ...prevState, messages: [...prevState.messages, { isBot: true, children: [`You sent: ${userMessage}`], timestamp: new Date() }], isBusy: false }))
      }, DELAY)
    },
    onAttach (file) {
      setState(prevState => ({ ...prevState, messages: [...prevState.messages, { children: [`Attaching ${file.name}`], timestamp: new Date() }], isBusy: true }))

      setTimeout(() => {
        setState(prevState => ({ ...prevState, messages: [...prevState.messages, { isBot: true, children: [`You attached: ${file.name}`], timestamp: new Date() }], isBusy: false }))
      }, DELAY)
    }
  })
}

register(ChatbotTest, 'chatbot-test')
