From 4e827f67934edce31f8312c8e4855d8c415a6adc Mon Sep 17 00:00:00 2001
From: Mathias Wagner <germannewsmaker@gmail.com>
Date: Sat, 5 Aug 2023 22:13:56 +0200
Subject: [PATCH] Created the ServerChooser.jsx

---
 .../ServerChooser/ServerChooser.jsx           | 21 +++++++++++++++++++
 1 file changed, 21 insertions(+)
 create mode 100644 client/src/common/components/Header/components/ServerDialog/components/ServerChooser/ServerChooser.jsx

diff --git a/client/src/common/components/Header/components/ServerDialog/components/ServerChooser/ServerChooser.jsx b/client/src/common/components/Header/components/ServerDialog/components/ServerChooser/ServerChooser.jsx
new file mode 100644
index 0000000..3acbc19
--- /dev/null
+++ b/client/src/common/components/Header/components/ServerDialog/components/ServerChooser/ServerChooser.jsx
@@ -0,0 +1,21 @@
+import {FontAwesomeIcon} from "@fortawesome/react-fontawesome";
+import {faLocationDot, faPencil} from "@fortawesome/free-solid-svg-icons";
+import "./styles.sass";
+
+export const ServerChooser = ({servers, setMenuOpen, updateCurrentServer, setCustomEdit}) => {
+    return (
+        <div className="selection-menu" onClick={() => setMenuOpen(false)}>
+            {servers.map((server) => (
+                <div className="selection-item" key={server.url} onClick={() => updateCurrentServer(server)}>
+                    {server.img && <img src={server.img} alt="server-icon" className="server-icon"/>}
+                    {!server.img && <FontAwesomeIcon icon={faLocationDot} />}
+                    <h4 className="dialog-text">{server.name}</h4>
+                </div>
+            ))}
+            <div className="selection-item" onClick={() => setCustomEdit(true)}>
+                <FontAwesomeIcon icon={faPencil} />
+                <h4 className="dialog-text">Eigener Server</h4>
+            </div>
+        </div>
+    )
+}
\ No newline at end of file