fix: removed word logging on message component

back/api/users.js

@@ -1,5 +1,5 @@
 const express = require('express');
-const { getConnection, getUsers, getUserByUsername, getUserLastMessages, getMentions, deleteUser, deleteUserMessages, deleteUserMentions } = require('../libs/mysql');
+const { getConnection, getUsers, getUserByUsername, getUserLastMessages, getMentions, deleteUser, deleteUserMessages, deleteUserMentions, setUserPfp } = require('../libs/mysql');
 const { checkAuth } = require("../libs/middlewares")
 const path = require('path');
 const fs = require('node:fs');
@@ -98,4 +98,35 @@ router.post('/:username/delete', checkAuth, async (req, res) => {
     res.send({ message: 'User deleted' });
 });
 
+router.post('/:username/deletepfp', checkAuth, async (req, res) => {
+    const username = req.params.username;
+    const user = req.user;
+
+    const connection = await getConnection();
+
+    const userToDelete = await getUserByUsername(connection, username);
+
+    if (!userToDelete[0]) {
+        connection.end();
+        return res.status(400).send({ error: 'No user found' });
+    }
+
+    if (user.admin !== 1) {
+        connection.end();
+        return res.status(401).send({ error: 'Unauthorized' });
+    }
+
+    if (userToDelete[0].pfp) {
+        await setUserPfp(connection, userToDelete[0].id, null);
+    }
+
+    if (fs.existsSync(path.join(__dirname, `../data/pfps/${userToDelete[0].pfp}`))) {
+        fs.unlinkSync(path.join(__dirname, `../data/pfps/${userToDelete[0].pfp}`));
+    }
+
+    connection.end();
+
+    res.send({ message: 'User pfp deleted' });
+});
+
 module.exports = router;

front/src/components/MessageComponent.tsx

@@ -14,7 +14,6 @@ export default function MessageComponent({ message, user, channel, deleteMessage
         const array = []
         var string = ''
         message.content.split(" ").forEach((word) => {
-            console.log(word)
             if (word.startsWith("@")) {
                 const mention = message.mentions.find((mention) => `@${mention.username}` === word);
                 if (mention) {

front/src/pages/ChannelPage.tsx

@@ -42,6 +42,9 @@ export default function ChannelPage({socket}: {socket: WebSocket}) {
     }
 
     function purgeChannel() {
+        if (!window.confirm(`Are you sure you want to purge ${channel?.name}?`)) {
+            return;
+        }
         axios
             .post(`/api/channels/${name}/purge`, { token })
             .catch((err) => {
@@ -51,6 +54,9 @@ export default function ChannelPage({socket}: {socket: WebSocket}) {
     }
 
     function deleteChannel() {
+        if (!window.confirm(`Are you sure you want to delete ${channel?.name}?`)) {
+            return;
+        }
         axios
             .post(`/api/channels/${name}/delete`, { token })
             .then(() => {

front/src/pages/ChannelsPage.tsx

@@ -13,6 +13,9 @@ export default function ChannelsPage({socket}: {socket: WebSocket}) {
     const [user, setUser] = useState<User>();
 
     function deleteChannel(name: string) {
+        if (!window.confirm(`Are you sure you want to delete ${name}?`)) {
+            return;
+        }
         axios
             .post(`/api/channels/${name}/delete`, { token })
             .catch((err) => {

front/src/pages/UserPage.tsx

@@ -1,4 +1,4 @@
-import { Link, useParams } from "react-router-dom";
+import { Link, useParams, useNavigate } from "react-router-dom";
 import { useEffect, useState } from "react";
 import { User, Messages } from "../types";
 import TopBar from "../components/TopBar";
@@ -8,16 +8,47 @@ import axios from "axios";
 import "../styles/UserPage.css";
 
 export default function UserPage({socket}: {socket: WebSocket}) {
+    const navigate = useNavigate();
     const { username } = useParams();
     const [pageUser, setPageUser] = useState<User>();
     const [messages, setMessages] = useState<Messages>();
     const [user, setUser] = useState<User>();
     const [noUser, setNoUser] = useState<boolean>(false);
+    const [token, setToken] = useState<string>("");
+
+    function deleteUser() {
+        if (!window.confirm(`Are you sure you want to delete ${pageUser?.username}?`)) {
+            return;
+        }
+        axios
+            .post(`/api/users/${pageUser?.username}/delete`, { token })
+            .then(() => {
+                navigate("/");
+            })
+            .catch((err) => {
+                console.error(err.response.data);
+            });
+    }
+
+    function deleteUserPfp() {
+        if (!window.confirm(`Are you sure you want to delete ${pageUser?.username}'s profile picture?`)) {
+            return;
+        }
+        axios
+            .post(`/api/users/${pageUser?.username}/deletepfp`, { token })
+            .then(() => {
+                window.location.reload();
+            })
+            .catch((err) => {
+                console.error(err.response.data);
+            });
+    }
 
     useEffect(() => {
         const localToken = localStorage.getItem("token");
 
         if (localToken) {
+            setToken(localToken);
             axios
                 .post("/api/auth/me", { token: localToken }).then((res) => {
                     setUser(res.data);
@@ -100,6 +131,16 @@ export default function UserPage({socket}: {socket: WebSocket}) {
                 {pageUser.id === user?.id && (
                     <Link to="/edit-profile">Edit profile</Link>
                 )}
+                {user?.admin == 1 && (
+                    <div>
+                        <button onClick={deleteUser}>    
+                            Delete user
+                        </button>
+                        <button onClick={deleteUserPfp}>
+                            Delete profile picture
+                        </button>
+                    </div>
+                )}
             </div>
             <div className="user-messages">
                 <h2>Last messages</h2>

front/src/pages/UsersPage.tsx

@@ -13,6 +13,9 @@ export default function UsersPage({socket}: {socket: WebSocket}) {
     const [thisUser, setThisUser] = useState<User>();
 
     function deleteUser(username: string) {
+        if (!window.confirm(`Are you sure you want to delete ${username}?`)) {
+            return;
+        }
         axios
             .post(`/api/users/${username}/delete`, { token })
             .catch((err) => {

front/src/styles/UserPage.css

@@ -13,6 +13,7 @@
     padding: 10px;
     display: flex;
     flex-direction: column;
+    align-items: start;
     background-color: #fff6fd;
 }