From 6e29418ba961758a1f24daca62af1f88b4a14ee1 Mon Sep 17 00:00:00 2001
From: Fishandchips321 <foxhawk42@gmail.com>
Date: Mon, 23 Feb 2026 15:06:58 +0000
Subject: [PATCH] added loading spinner and error message

---
 .../src/Components/ServerList/ServerList.tsx     | 16 ++++++++++++----
 1 file changed, 12 insertions(+), 4 deletions(-)

diff --git a/frontend/src/Components/ServerList/ServerList.tsx b/frontend/src/Components/ServerList/ServerList.tsx
index 2b61520..4d46f88 100644
--- a/frontend/src/Components/ServerList/ServerList.tsx
+++ b/frontend/src/Components/ServerList/ServerList.tsx
@@ -1,9 +1,10 @@
 import { useEffect, useState } from "react";
 import ServerCard from "./ServerCard/ServerCard";
 import { getServerList, type Server } from "../../Lib/Servers";
+import { Spinner } from "react-bootstrap";
 
 const ServerList = () => {
-  const [servers, setServers] = useState<Array<Server>>([]);
+  const [servers, setServers] = useState<Array<Server> | undefined>();
 
   useEffect(() => {
     getServerList().then(serverList => {
@@ -13,9 +14,16 @@ const ServerList = () => {
 
   return (
     <div style={{ display: "flex", flexDirection: "row", flexWrap: "wrap" }}>
-      {servers.map(server => {
-        return (<ServerCard name={server.owner} online={true} linkTo={server.url} key={server.name} />)
-      })}
+      {servers ?
+        servers.length > 0 ?
+          servers.map(server => {
+            return (<ServerCard name={server.owner} online={true} linkTo={server.url} key={server.name} />)
+          })
+          :
+          <h1>No servers found</h1>
+        :
+        <Spinner />
+      }
     </div>
   )
 }