feat: titles page

modules/frontend/src/components/UserPage/UserPage.tsx

@@ -1,64 +0,0 @@
-import React, { useEffect, useState } from "react";
-import { useParams } from "react-router-dom"; // <-- import
-import { DefaultService } from "../../api/services/DefaultService";
-import type { User } from "../../api/models/User";
-import styles from "./UserPage.module.css";
-
-const UserPage: React.FC = () => {
-  const { id } = useParams<{ id: string }>(); // <-- get user id from URL
-  const [user, setUser] = useState<User | null>(null);
-  const [loading, setLoading] = useState(true);
-  const [error, setError] = useState<string | null>(null);
-
-  useEffect(() => {
-    if (!id) return;
-
-    const getUserInfo = async () => {
-      try {
-        const userInfo = await DefaultService.getUsers(id, "all"); // <-- use dynamic id
-        setUser(userInfo);
-      } catch (err) {
-        console.error(err);
-        setError("Failed to fetch user info.");
-      } finally {
-        setLoading(false);
-      }
-    };
-    getUserInfo();
-  }, [id]);
-
-  if (loading) return <div className={styles.loader}>Loading...</div>;
-  if (error) return <div className={styles.error}>{error}</div>;
-  if (!user) return <div className={styles.error}>User not found.</div>;
-
-  return (
-    <div className={styles.container}>
-      <div className={styles.card}>
-        <div className={styles.avatar}>
-          {user.avatar_id ? (
-            <img
-              src={`/images/${user.avatar_id}.png`}
-              alt="User Avatar"
-              className={styles.avatarImg}
-            />
-          ) : (
-            <div className={styles.avatarPlaceholder}>
-              {user.disp_name?.[0] || "U"}
-            </div>
-          )}
-        </div>
-
-        <div className={styles.info}>
-          <h1 className={styles.name}>{user.disp_name || user.nickname}</h1>
-          <p className={styles.nickname}>@{user.nickname}</p>
-          {user.user_desc && <p className={styles.desc}>{user.user_desc}</p>}
-          <p className={styles.created}>
-            Joined: {new Date(user.creation_date).toLocaleDateString()}
-          </p>
-        </div>
-      </div>
-    </div>
-  );
-};
-
-export default UserPage;