feat(0.0.5): added new data

Author: GalvinPython

api/index.ts

@@ -1,7 +1,6 @@
 import express from 'express';
 import cors from 'cors';
 import mysql from 'mysql2';
-import ejs from 'ejs';
 import path from 'path';
 
 const app = express();
@@ -102,6 +101,9 @@ async function ensureGuildTableExists(guild, callback) {
 			user_pfp TINYTEXT,
 			user_name TINYTEXT,
 			user_nickname TINYTEXT,
+			user_level INT DEFAULT 0,
+			user_xp_needed_next_level INT,
+			user_progress_next_level DECIMAL(6, 2),
             PRIMARY KEY (user_id)
         )
     `;
@@ -166,23 +168,45 @@ app.post('/post/:guild/:user/:auth', (req, res) => {
 			return res.status(500).json({ message: 'Internal server error' });
 		}
 
-		const insertOrUpdateQuery = `
-			INSERT INTO \`${guild}\` (user_id, xp, user_pfp, user_name, user_nickname)
-			VALUES (?, ?, ?, ?, ?)
-			ON DUPLICATE KEY UPDATE
-			xp = xp + VALUES(xp),
-			user_pfp = VALUES(user_pfp),
-			user_name = VALUES(user_name),
-			user_nickname = VALUES(user_nickname)
-		`;
-		pool.query(insertOrUpdateQuery, [user, xpValue, pfp, name, nickname], (err, results) => {
+		const getXpQuery = `SELECT xp FROM \`${guild}\` WHERE user_id = ?`;
+
+		pool.query(getXpQuery, [user], (err, results) => {
 			if (err) {
-				console.error('Error updating XP:', err);
-				res.status(500).json({ message: 'Internal server error' });
-			}
-			else {
-				res.status(200).json(results);
+				console.error('Error fetching XP:', err);
+				return res.status(500).json({ message: 'Internal server error' });
 			}
+
+			const currentXp = results.length ? results[0].xp : 0;
+			const newXp = currentXp + xpValue;
+
+			const currentLevel = Math.floor(Math.sqrt(newXp / 100));
+			const nextLevel = currentLevel + 1;
+			const nextLevelXp = Math.pow(nextLevel, 2) * 100;
+			const xpNeededForNextLevel = nextLevelXp - newXp;
+			const currentLevelXp = Math.pow(currentLevel, 2) * 100;
+			const progressToNextLevel = ((newXp - currentLevelXp) / (nextLevelXp - currentLevelXp)) * 100;
+
+			const updateQuery = `
+                INSERT INTO \`${guild}\` (user_id, xp, user_pfp, user_name, user_nickname, user_level, user_xp_needed_next_level, user_progress_next_level)
+                VALUES (?, ?, ?, ?, ?, ?, ?, ?)
+                ON DUPLICATE KEY UPDATE
+                    xp = VALUES(xp),
+                    user_pfp = VALUES(user_pfp),
+                    user_name = VALUES(user_name),
+                    user_nickname = VALUES(user_nickname),
+                    user_level = VALUES(user_level),
+                    user_xp_needed_next_level = VALUES(user_xp_needed_next_level),
+                    user_progress_next_level = VALUES(user_progress_next_level)
+            `;
+
+			pool.query(updateQuery, [user, newXp, pfp, name, nickname, currentLevel, xpNeededForNextLevel, progressToNextLevel.toFixed(2)], (err, results) => {
+				if (err) {
+					console.error('Error updating XP:', err);
+					return res.status(500).json({ message: 'Internal server error' });
+				} else {
+					res.status(200).json(results);
+				}
+			});
 		});
 	});
 });
@@ -276,7 +300,7 @@ app.get('/leaderboard/:guild', async (req, res) => {
 		return res.status(404).json({ message: 'No guild was found with this ID' });
 	}
 	const data = await response.json();
-	res.render('leaderboard', { guild: data.guild, leaderboard: data.leaderboard});
+	res.render('leaderboard', { guild: data.guild, leaderboard: data.leaderboard });
 });
 
 app.listen(PORT, () => {

api/public/styles.css

@@ -84,4 +84,5 @@ body {
 
 .userXP {
 	margin: 0;
+	font-size: large;
 }

api/views/leaderboard.ejs

@@ -6,6 +6,7 @@
 	<meta name="viewport" content="width=device-width, initial-scale=1.0">
 	<title>Leaderboard for <%= guild.guild_name %>
 	</title>
+	<meta name="description" content="Leaderboard for <%= guild.guild_name %>">
 	<link rel="stylesheet" href="/styles.css">
 </head>
 
@@ -20,16 +21,22 @@
 			</div>
 		</div>
 		<div class="leaderboard">
-			<% leaderboard.forEach((user, index) => { %>
+			<% leaderboard.forEach((user, index)=> { %>
 				<div class="user">
-					<p class="userPosition">#<%= index + 1 %></p>
-					<img class="userImage" src="<%= user.user_pfp %>" alt="User Image">
+					<h1 class="userPosition">#<%= index + 1 %>
+					</h1>
+					<img class="userImage" src="<%= user.user_pfp %>" alt="User image for <%= user.user_name %>">
 					<div class="userInfo">
-						<h2 class="userName"><%= user.user_nickname %> (@<%= user.user_name %>)</h2>
-						<p class="userXP">XP: <%= user.xp %></p>
+						<h2 class="userName">
+							<%= user.user_nickname %> (@<%= user.user_name %>)
+						</h2>
+						<p class="userXP">XP: <%= user.xp %>
+						</p>
+						<p class="userXP">Level <%= user.user_level %> | <%= user.xp %>/<%= user.xp + user.user_xp_needed_next_level %> points to next level (<%= user.user_progress_next_level %>%)
+						</p>
 					</div>
 				</div>
-			<% }) %>
+				<% }) %>
 		</div>
 	</main>
 </body>

bot/commands.ts

@@ -133,11 +133,38 @@ const commands: Record<string, Command> = {
 				const guild = interaction.guild?.id
 				const user = interaction.user.id
 				const xp = await makeGETRequest(guild as string, user)
+				const progress = xp.user_progress_next_level;
+				const progressBar = createProgressBar(progress);
+
 				await interaction.reply({
 					embeds: [
-						quickEmbed({color: 'Blurple', title: 'XP', description: `<@${user}> you have ${xp.xp} XP! (Level ${convertToLevels(xp.xp)})`}, interaction)
-					]
-				})
+						quickEmbed(
+							{
+								color: 'Blurple',
+								title: 'XP',
+								description: `<@${user}> you have ${xp.xp} XP! (Level ${convertToLevels(xp.xp)})`,
+							},
+							interaction
+						).addFields([
+							{
+								name: 'Progress To Next Level',
+								value: `${progressBar} ${progress}%`,
+								inline: true,
+							},
+							{
+								name: 'XP Required',
+								value: `${xp.user_xp_needed_next_level} XP`,
+								inline: true,
+							},
+						]),
+					],
+				});
+
+				function createProgressBar(progress: number): string {
+					const filled = Math.floor(progress / 10);
+					const empty = 10 - filled;
+					return '▰'.repeat(filled) + '▱'.repeat(empty);
+				}
 			}
 		}
 	},
@@ -169,7 +196,7 @@ const commands: Record<string, Command> = {
 					}, interaction);
 
 					// Add a field for each user with a mention
-					leaderboard.forEach((entry: { user_id: any; xp: any; }, index: number) => {
+					leaderboard.leaderboard.forEach((entry: { user_id: any; xp: any; }, index: number) => {
 						leaderboardEmbed.addFields([
 							{
 								name: `${index + 1}.`,

package-lock.json

@@ -1,7 +1,7 @@
 {
 	"name": "xpbot",
 	"type": "module",
-	"version": "0.0.4",
+	"version": "0.0.5",
 	"scripts": {
 		"api": "bun --watch api/index.ts",
 		"bot": "bun --watch bot/index.ts"