From 9a6583069bef1542034b1bc4ef3c3489d735d293 Mon Sep 17 00:00:00 2001
From: Liam <liam@fascinated.cc>
Date: Wed, 2 Oct 2024 09:34:22 +0100
Subject: [PATCH] mini rankings breaking if the player is on page 1

---
 package.json                    |  2 +-
 src/components/ranking/mini.tsx | 18 +++++++++++++++---
 2 files changed, 16 insertions(+), 4 deletions(-)

diff --git a/package.json b/package.json
index 82d4cc8..62e860d 100644
--- a/package.json
+++ b/package.json
@@ -3,7 +3,7 @@
   "version": "0.1.0",
   "private": true,
   "scripts": {
-    "dev": "next dev",
+    "dev": "next dev --turbo",
     "build": "next build",
     "start": "next start",
     "lint": "next lint"
diff --git a/src/components/ranking/mini.tsx b/src/components/ranking/mini.tsx
index cd74bf3..7b228ca 100644
--- a/src/components/ranking/mini.tsx
+++ b/src/components/ranking/mini.tsx
@@ -82,7 +82,8 @@ export default function Mini({ type, player, shouldUpdate }: MiniProps) {
     queryFn: async () => {
       // Determine pages to search based on player's rank within the page
       const pagesToSearch = [page];
-      if (rankWithinPage < 5 && page > 0) {
+      if (rankWithinPage < 5 && page > 1) {
+        // Allow page 1 to be valid
         // Player is near the start of the page, so search the previous page too
         pagesToSearch.push(page - 1);
       }
@@ -109,9 +110,20 @@ export default function Mini({ type, player, shouldUpdate }: MiniProps) {
 
   let players = data; // So we can update it later
   if (players && (!isLoading || !isError)) {
-    // Find the player's position and show 3 players above and 1 below
+    // Find the player's position in the list
     const playerPosition = players.findIndex(p => p.id === player.id);
-    players = players.slice(playerPosition - 3, playerPosition + 2);
+
+    // Ensure we always show 5 players
+    const start = Math.max(0, playerPosition - 3); // Start showing 3 players above the player, but not less than index 0
+    const end = Math.min(players.length, start + 5); // Ensure there are 5 players shown
+
+    players = players.slice(start, end);
+
+    // If there are less than 5 players at the top, append more players from below
+    if (players.length < 5 && start === 0) {
+      const additionalPlayers = players.slice(playerPosition + 1, playerPosition + (5 - players.length + 1));
+      players = [...players, ...additionalPlayers];
+    }
   }
 
   if (isLoading) {