add: added user pages, and last messages to the home page

front/src/pages/UserPage.tsx

@@ -0,0 +1,42 @@
+import { useParams, Link } from "react-router-dom";
+import { useEffect, useState } from "react";
+import { User, Messages } from "../types";
+import axios from "axios";
+
+export default function UserPage() {
+    const { username } = useParams();
+    const [user, setUser] = useState<User>();
+    const [messages, setMessages] = useState<Messages>();
+
+    useEffect(() => {
+        axios.get(`/api/users/${username}`).then((res) => {
+            setUser(res.data);
+        });
+
+        axios.get(`/api/users/${username}/lastmessages`).then((res) => {
+            setMessages(res.data);
+        });
+    }, [username]);
+
+    if (!user) {
+        return <div>Loading...</div>;
+    }
+
+    return (
+        <div>
+            <Link to="/">Home</Link>
+            <h1>{user.username}</h1>
+            {user.admin ? <p>Admin</p> : <p>User</p>}
+            <h1>Last messages</h1>
+            <ul>
+                {messages?.map((message) => (
+                    <li key={message.id}>
+                        <p><Link to={`/u/${message.username}`}>{message.username}</Link>: {message.content}</p>
+                        <p>In <Link to={`/c/${message.channel_name}`}>{message.channel_name}</Link></p>
+                        <p>{new Date(message.date * 1000).toLocaleString()}</p>
+                    </li>
+                ))}
+            </ul>
+        </div>
+    );
+}