47 lines
1.5 KiB
TypeScript

import { getMessageText, isMessageContainMedia } from "@/types/ask";
import React from 'react';
import { View } from 'react-native';
import MessageContent from "./MessageContent";
interface MessageBubbleProps {
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 MessageBubble = ({
item,
isUser,
setModalVisible,
setCancel,
cancel,
t,
setSelectedImages,
setModalDetailsVisible
}: MessageBubbleProps) => {
return (
<View
className={`${isUser ? '!bg-bgPrimary ml-10 rounded-full' : '!bg-aiBubble rounded-2xl'} border-0 ${!isUser && isMessageContainMedia(item) ? '!rounded-t-3xl !rounded-b-2xl' : '!rounded-3xl'} px-3`}
style={{ marginRight: getMessageText(item) == "keepSearchIng" ? 0 : isUser ? 0 : 10 }}
>
<MessageContent
item={item}
isUser={isUser}
setModalVisible={setModalVisible}
setCancel={setCancel}
cancel={cancel}
t={t}
setSelectedImages={setSelectedImages}
setModalDetailsVisible={setModalDetailsVisible}
/>
</View>
);
};
export default React.memo(MessageBubble);