Chat

import { Chat } from '@peppermint-design/devreadykit-custom';

export default function App() {
  const [messages, setMessages] = useState([]);

  return (
    <Chat
      messages={messages}
      onSendMessage={(message) => {
        setMessages(prev => [...prev, message]);
      }}
    />
  );
}

const messages = [
  {
    id: 1,
    type: 'text',
    content: 'Hello! How are you?',
    sender: 'user',
    timestamp: new Date()
  },
  {
    id: 2,
    type: 'text',
    content: 'I\'m doing great, thanks for asking!',
    sender: 'bot',
    timestamp: new Date()
  }
];

const messages = [
  {
    id: 1,
    type: 'file',
    content: {
      name: 'document.pdf',
      size: '2.5 MB',
      url: 'https://example.com/document.pdf'
    },
    sender: 'user',
    timestamp: new Date()
  }
];

function SimpleChat() {
  const [messages, setMessages] = useState([
    {
      id: 1,
      type: 'text',
      content: 'Welcome to the chat!',
      sender: 'bot',
      timestamp: new Date()
    }
  ]);

  const handleSendMessage = (message) => {
    const newMessage = {
      id: Date.now(),
      ...message,
      timestamp: new Date()
    };
    setMessages(prev => [...prev, newMessage]);
  };

  return (
    <div className="h-96 border rounded">
      <Chat
        messages={messages}
        onSendMessage={handleSendMessage}
        placeholder="Type your message..."
      />
    </div>
  );
}