This commit is contained in:
Matthias Hochmeister
2026-03-16 16:26:56 +01:00
parent 177dd1395b
commit 69c508a5d8
2 changed files with 34 additions and 9 deletions

View File

@@ -1,4 +1,5 @@
import React, { useRef, useState } from 'react';
import Avatar from '@mui/material/Avatar';
import Box from '@mui/material/Box';
import Typography from '@mui/material/Typography';
import Paper from '@mui/material/Paper';
@@ -11,6 +12,18 @@ import RichMessageText from './RichMessageText';
import PollMessageContent from './PollMessageContent';
import MessageReactions from './MessageReactions';
const SENDER_COLORS = [
'#E53935', '#D81B60', '#8E24AA', '#5E35B1',
'#3949AB', '#1E88E5', '#00ACC1', '#00897B',
'#43A047', '#F4511E',
];
function getSenderColor(actorId: string): string {
let hash = 0;
for (let i = 0; i < actorId.length; i++) hash = ((hash << 5) - hash + actorId.charCodeAt(i)) | 0;
return SENDER_COLORS[Math.abs(hash) % SENDER_COLORS.length];
}
interface ChatMessageProps {
message: NextcloudMessage;
isOwnMessage: boolean;
@@ -126,9 +139,14 @@ const ChatMessage: React.FC<ChatMessageProps> = ({ message, isOwnMessage, isOneT
}}
>
{!isOwnMessage && !isOneToOne && (
<Typography variant="caption" sx={{ fontWeight: 600, display: 'block' }}>
{message.actorDisplayName}
</Typography>
<Box sx={{ display: 'flex', alignItems: 'center', gap: 0.5, mb: 0.25 }}>
<Avatar sx={{ width: 20, height: 20, fontSize: '0.7rem', bgcolor: getSenderColor(message.actorId) }}>
{message.actorDisplayName.charAt(0).toUpperCase()}
</Avatar>
<Typography variant="body2" sx={{ fontWeight: 700, fontSize: '0.8rem', color: getSenderColor(message.actorId) }}>
{message.actorDisplayName}
</Typography>
</Box>
)}
{/* Quoted parent message */}
@@ -143,7 +161,7 @@ const ChatMessage: React.FC<ChatMessageProps> = ({ message, isOwnMessage, isOneT
py: 0.25,
bgcolor: isOwnMessage ? 'rgba(0,0,0,0.1)' : 'rgba(0,0,0,0.04)',
}}>
<Typography variant="caption" sx={{ display: 'block', fontWeight: 600, lineHeight: 1.4 }}>
<Typography variant="caption" sx={{ display: 'block', fontWeight: 600, lineHeight: 1.4, color: !isOwnMessage ? getSenderColor(message.parent.actorId) : undefined }}>
{message.parent.actorDisplayName}
</Typography>
<Typography variant="caption" noWrap sx={{ display: 'block', lineHeight: 1.4 }}>