fix: fixed mentions display and added MessageComponent

This commit is contained in:
Lukian 2025-04-06 14:50:19 +02:00
parent 6c8f354bf6
commit e38691c02a
4 changed files with 56 additions and 45 deletions

View file

@ -1,6 +1,7 @@
import { useParams, Link } from "react-router-dom";
import { useEffect, useState } from "react";
import { User, Messages } from "../types";
import MessageComponent from "../components/MessageComponent";
import axios from "axios";
export default function UserPage() {
@ -41,20 +42,13 @@ export default function UserPage() {
<h1>Last messages</h1>
<ul>
{messages?.map((message) => (
<li key={message.id}>
<Link to={`/u/${message.username}`}>{message.username}</Link>:{" "}
{message.content.split(" ").map((word, index) => {
if (word.startsWith("@")) {
const mention = message.mentions.find((mention) => `@${mention.username}` === word);
if (mention) {
return <Link key={index} to={`/u/${mention.username}`}>{word}</Link>;
}
}
return <span key={index}>{word} </span>;
})}
<p>In <Link to={`/c/${message.channel_name}`}>{message.channel_name}</Link></p>
<p>{new Date(message.date * 1000).toLocaleString()}</p>
</li>
<MessageComponent
key={message.id}
message={message}
user={user}
channel={undefined}
deleteMessage={undefined}
/>
))}
</ul>
</div>