108 lines
3.1 KiB
TypeScript
108 lines
3.1 KiB
TypeScript
import React from 'react';
|
|
import { useLanguage } from '../../../providers/language/LanguageContext';
|
|
import { MessagesProps } from './MessagesTypes';
|
|
import { ChatMessage } from './ChatMessages/ChatMessage';
|
|
import { LogMessage } from '../Log/LogMessage/LogMessage';
|
|
import { AutoScroll } from '../AutoScroll';
|
|
import styles from './Messages.module.css';
|
|
|
|
|
|
const Messages: React.FC<MessagesProps> = ({
|
|
messages,
|
|
className = '',
|
|
variant = 'chat',
|
|
showDocuments = true,
|
|
showMetadata = true,
|
|
showProgress = true,
|
|
renderMessage,
|
|
renderDocument,
|
|
emptyMessage,
|
|
onFileDelete,
|
|
onFileRemove,
|
|
onFileView,
|
|
onFileDownload,
|
|
deletingFiles,
|
|
previewingFiles,
|
|
removingFiles,
|
|
downloadingFiles,
|
|
workflowId,
|
|
onMessageDelete,
|
|
deletingMessages
|
|
}) => {
|
|
const { t } = useLanguage();
|
|
const resolvedEmptyMessage = emptyMessage || t('Noch keine Nachrichten');
|
|
if (!messages || messages.length === 0) {
|
|
return (
|
|
<div className={`${styles.messagesContainer} ${styles.emptyContainer} ${className}`}>
|
|
<div className={styles.emptyState}>{resolvedEmptyMessage}</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<AutoScroll
|
|
className={className}
|
|
scrollDependency={messages.length}
|
|
>
|
|
<div className={styles.messagesContainer}>
|
|
{messages.map((message, index) => {
|
|
// Use custom render function if provided
|
|
if (renderMessage) {
|
|
return (
|
|
<div key={message.id || index} className={styles.messageWrapper}>
|
|
{renderMessage(message, index)}
|
|
</div>
|
|
);
|
|
}
|
|
|
|
// Render based on variant
|
|
if (variant === 'log') {
|
|
return (
|
|
<LogMessage
|
|
key={message.id || index}
|
|
message={message}
|
|
showDocuments={showDocuments}
|
|
showMetadata={showMetadata}
|
|
showProgress={showProgress}
|
|
renderDocument={renderDocument}
|
|
onFileDelete={onFileDelete}
|
|
onFileRemove={onFileRemove}
|
|
onFileView={onFileView}
|
|
onFileDownload={onFileDownload}
|
|
deletingFiles={deletingFiles}
|
|
previewingFiles={previewingFiles}
|
|
removingFiles={removingFiles}
|
|
downloadingFiles={downloadingFiles}
|
|
workflowId={workflowId}
|
|
/>
|
|
);
|
|
}
|
|
|
|
// Default to chat variant
|
|
return (
|
|
<ChatMessage
|
|
key={message.id || index}
|
|
message={message}
|
|
showDocuments={showDocuments}
|
|
renderDocument={renderDocument}
|
|
onFileDelete={onFileDelete}
|
|
onFileRemove={onFileRemove}
|
|
onFileView={onFileView}
|
|
onFileDownload={onFileDownload}
|
|
deletingFiles={deletingFiles}
|
|
previewingFiles={previewingFiles}
|
|
removingFiles={removingFiles}
|
|
downloadingFiles={downloadingFiles}
|
|
workflowId={workflowId}
|
|
onMessageDelete={onMessageDelete}
|
|
deletingMessages={deletingMessages}
|
|
/>
|
|
);
|
|
})}
|
|
</div>
|
|
</AutoScroll>
|
|
);
|
|
};
|
|
|
|
export default Messages;
|
|
|