/*
Project: ChatGPT Web Interface
Developer: Molla Samser
Email: help@rskworld.in
Phone: +91 93305 39277
Address: Nutanhat, Mongolkote, Purba Burdwan, West Bengal, India, 713147
Website: https://rskworld.in/
Year: 2026
*/

import React, { useState, useRef, useEffect } from 'react';
import MessageList from './MessageList';
import InputArea from './InputArea';
import { sendMessage, sendMessageStream } from '../services/openaiService';

function ChatInterface({ conversation, onAddMessage, onUpdateMessage, onDeleteMessage, onToggleSidebar, settings, useStreaming = false }) {
  const [isLoading, setIsLoading] = useState(false);
  const [streamingMessage, setStreamingMessage] = useState(null);
  const messagesEndRef = useRef(null);

  const scrollToBottom = () => {
    messagesEndRef.current?.scrollIntoView({ behavior: 'smooth' });
  };

  useEffect(() => {
    scrollToBottom();
  }, [conversation?.messages, streamingMessage]);

  const handleSendMessage = async (content) => {
    if (!content.trim() || isLoading) return;

    const userMessage = {
      content: content.trim(),
      isUser: true
    };

    onAddMessage(userMessage, true);
    setIsLoading(true);
    setStreamingMessage(null);

    try {
      const messagesForAPI = [...(conversation.messages || []), userMessage];
      
      if (useStreaming) {
        // Calculate the index: after user message (length+1), then AI message will be at length+1
        // Since state updates are async, we calculate based on current length
        const baseLength = conversation.messages.length;
        const aiMessageIndex = baseLength + 1; // User message at baseLength, AI at baseLength+1
        const initialMessage = { content: '', isUser: false };
        onAddMessage(initialMessage, false);
        
        await sendMessageStream(
          messagesForAPI,
          (chunk) => {
            setStreamingMessage(chunk);
            onUpdateMessage(aiMessageIndex, { content: chunk, isUser: false });
          },
          settings
        );
        setStreamingMessage(null);
      } else {
        const aiResponse = await sendMessage(messagesForAPI, settings);
        onAddMessage(aiResponse, false);
      }
    } catch (error) {
      const errorMessage = {
        content: `Error: ${error.message}. Please check your API key and try again.`,
        isUser: false,
        isError: true
      };
      onAddMessage(errorMessage, false);
    } finally {
      setIsLoading(false);
      setStreamingMessage(null);
    }
  };

  const handleEditMessage = (index, newContent) => {
    if (onUpdateMessage && conversation.messages[index]) {
      const message = conversation.messages[index];
      onUpdateMessage(index, { ...message, content: newContent });
    }
  };

  const handleDeleteMessage = (index) => {
    if (onDeleteMessage) {
      onDeleteMessage(index);
    }
  };

  const handleRegenerateMessage = async (index) => {
    // Remove the AI response and regenerate
    const messagesUpToUser = conversation.messages.slice(0, index);
    const userMessage = conversation.messages[index - 1];
    
    if (!userMessage || !userMessage.isUser) return;

    setIsLoading(true);
    try {
      if (useStreaming) {
        // Remove old AI response
        onDeleteMessage(index);
        const initialMessage = { content: '', isUser: false };
        onAddMessage(initialMessage, false);
        const newIndex = index; // Index remains the same after deletion
        
        await sendMessageStream(
          messagesUpToUser,
          (chunk) => {
            setStreamingMessage(chunk);
            onUpdateMessage(newIndex, { content: chunk, isUser: false });
          },
          settings
        );
        setStreamingMessage(null);
      } else {
        // Remove old AI response
        onDeleteMessage(index);
        const aiResponse = await sendMessage(messagesUpToUser, settings);
        onAddMessage(aiResponse, false);
      }
    } catch (error) {
      const errorMessage = {
        content: `Error: ${error.message}. Please check your API key and try again.`,
        isUser: false,
        isError: true
      };
      onAddMessage(errorMessage, false);
    } finally {
      setIsLoading(false);
      setStreamingMessage(null);
    }
  };

  if (!conversation) {
    return (
      <div className="chat-interface empty">
        <div className="empty-state">
          <p>Select or create a conversation to start chatting.</p>
        </div>
      </div>
    );
  }

  return (
    <div className="chat-interface">
      <div className="chat-header">
        <button className="sidebar-toggle" onClick={onToggleSidebar}>
          <i className="fas fa-bars"></i>
        </button>
        <h2>{conversation.title}</h2>
      </div>
      <MessageList
        messages={conversation.messages || []}
        isLoading={isLoading}
        onEditMessage={handleEditMessage}
        onDeleteMessage={handleDeleteMessage}
        onRegenerateMessage={handleRegenerateMessage}
      />
      <div ref={messagesEndRef} />
      <InputArea onSendMessage={handleSendMessage} disabled={isLoading} />
    </div>
  );
}

export default ChatInterface;