import React from 'react';
import { View, Text } from 'react-native';
import MessageBubble from './MessageBubble';
import { getMessageText } from "@/types/ask";

interface MessageRowProps {
  item: any;
  isUser: boolean;
  setModalVisible: React.Dispatch<React.SetStateAction<{ visible: boolean, data: any }>>;
  setCancel: React.Dispatch<React.SetStateAction<boolean>>;
  cancel: boolean;
  t: any;
  setSelectedImages: React.Dispatch<React.SetStateAction<string[]>>;
  setModalDetailsVisible: React.Dispatch<React.SetStateAction<{ visible: boolean, content: any }>>;
}

const MessageRow = ({ 
  item, 
  isUser, 
  setModalVisible, 
  setCancel, 
  cancel, 
  t, 
  setSelectedImages, 
  setModalDetailsVisible
}: MessageRowProps) => {
  return (
    <View className="w-full flex-row items-end">
      <MessageBubble 
        item={item}
        isUser={isUser}
        setModalVisible={setModalVisible}
        setCancel={setCancel}
        cancel={cancel}
        t={t}
        setSelectedImages={setSelectedImages}
        setModalDetailsVisible={setModalDetailsVisible}
      />
      {
        getMessageText(item) == "keepSearchIng"
        &&
        <Text className="text-[#d9d9d9]">
          {t("ask:ask.think")}
        </Text>
      }
    </View>
  );
};

export default React.memo(MessageRow);
