Got index server list working

frontend/src/Components/ServerList/ServerCard/ServerCard.tsx

@@ -10,7 +10,7 @@ interface ServerCardProps {
 
 const ServerCard = ({ name, online, linkTo }: ServerCardProps) => {
   return (
-    <Link to={linkTo} className={styles.serverCard}>
+    <Link to={linkTo} className={styles.serverCard} target="_blank" rel="noopener noreferrer">
       <Card>
         <Card.Header>
           <Card.Title>{name}</Card.Title>

frontend/src/Components/ServerList/ServerList.tsx

@@ -1,20 +1,20 @@
+import { useEffect, useState } from "react";
 import ServerCard from "./ServerCard/ServerCard";
+import { getServerList, type Server } from "../../Lib/Servers";
 
-interface ServerListProps {
-  servers: Array<Server>;
-}
+const ServerList = () => {
+  const [servers, setServers] = useState<Array<Server>>([]);
 
-interface Server {
-  name: string;
-  online: boolean;
-  linkTo: string;
-}
+  useEffect(() => {
+    getServerList().then(serverList => {
+      setServers(serverList);
+    })
+  })
 
-const ServerList = ({ servers }: ServerListProps) => {
   return (
     <div style={{ display: "flex", flexDirection: "row", flexWrap: "wrap" }}>
       {servers.map(server => {
-        return (<ServerCard name={server.name} online={server.online} linkTo={server.linkTo} key={server.name} />)
+        return (<ServerCard name={server.owner} online={false} linkTo={server.url} key={server.name} />)
       })}
     </div>
   )

frontend/src/Components/ServerSearch/ServerSearchResult/ServerSearchResult.tsx

@@ -11,7 +11,7 @@ const ServerSearchResult = ({ searchResult, server }: ServerSearchResultProps) =
   const resultUrl = getUrlForSearchResult(searchResult, server);
 
   return (
-    <Link to={resultUrl}>
+    <Link to={resultUrl} target="_blank" rel="noopener noreferrer">
       <h3>{searchResult.name}</h3>
     </Link>
   )