From 2bbad82f212041ed68c252c9739c5b5290a7bb33 Mon Sep 17 00:00:00 2001
From: iiTzArcur <zefanjaj@gmail.com>
Date: Thu, 28 Nov 2024 23:21:23 +0100
Subject: [PATCH] encode the servername if prefix is not available

---
 .../routes/Servers/Detailed/Main.tsx          | 102 +++++++++---------
 1 file changed, 48 insertions(+), 54 deletions(-)

diff --git a/src/components/routes/Servers/Detailed/Main.tsx b/src/components/routes/Servers/Detailed/Main.tsx
index d754dc4..53f816f 100644
--- a/src/components/routes/Servers/Detailed/Main.tsx
+++ b/src/components/routes/Servers/Detailed/Main.tsx
@@ -117,7 +117,7 @@ export function Results(props: Views): React.ReactElement {
     .reduce((acc, key) => ((acc[key] = modCategories[key]), acc), {});
   let widgetReturn =
     props.getter === "name"
-      ? props.serverName
+      ? encodeURIComponent(props.serverName)
       : encodeURIComponent(stats?.prefix);
   let widgetItem = "name";
 
@@ -249,9 +249,8 @@ export function Results(props: Views): React.ReactElement {
         <p className={Mainstyles.description} style={{ marginTop: "6px" }}>
           {t("servers.permLink")}{" "}
           <CopyToClipboard
-            message={`https://gametools.network/servers/${
-              props.game
-            }/name/${encodeURIComponent(stats?.prefix)}/pc`}
+            message={`https://gametools.network/servers/${props.game
+              }/name/${encodeURIComponent(stats?.prefix)}/pc`}
             stateTranslation={"states"}
           />
         </p>
@@ -296,27 +295,27 @@ export function Results(props: Views): React.ReactElement {
             <div className="align">
               {loading
                 ? [...Array(4)].map((key, index) => (
-                    <MapRotationItem
-                      key={key}
-                      stats={{
-                        image: "",
-                        mapname: t("loading"),
-                        mode: t("notApplicable"),
-                        index: index,
-                      }}
-                      index={index}
-                    />
-                  ))
+                  <MapRotationItem
+                    key={key}
+                    stats={{
+                      image: "",
+                      mapname: t("loading"),
+                      mode: t("notApplicable"),
+                      index: index,
+                    }}
+                    index={index}
+                  />
+                ))
                 : stats?.rotation?.map(
-                    (key: ServerRotation, index: number) =>
-                      key && (
-                        <MapRotationItem
-                          key={index}
-                          stats={key}
-                          index={index}
-                        />
-                      ),
-                  )}
+                  (key: ServerRotation, index: number) =>
+                    key && (
+                      <MapRotationItem
+                        key={index}
+                        stats={key}
+                        index={index}
+                      />
+                    ),
+                )}
             </div>
           </>
         )}
@@ -371,24 +370,24 @@ export function Results(props: Views): React.ReactElement {
                   isError={props.error}
                 />
               ) : // older titles
-              stats?.ip && stats?.port ? (
-                <BfListServerPlayerList
-                  game={props.game}
-                  serverIp={stats?.ip}
-                  serverPort={stats?.hostport || stats?.port}
-                />
-              ) : (
-                props.game.includes("marne") && (
-                  <MarnePlayerList
-                    stats={stats}
-                    game={props?.game}
-                    gameId={stats?.gameId}
-                    isLoading={props.loading}
-                    isError={props.error}
+                stats?.ip && stats?.port ? (
+                  <BfListServerPlayerList
+                    game={props.game}
+                    serverIp={stats?.ip}
+                    serverPort={stats?.hostport || stats?.port}
                   />
-                  // <Bf3ServerPlayerlist players={stats?.players} game="bf1" />
-                )
-              )}
+                ) : (
+                  props.game.includes("marne") && (
+                    <MarnePlayerList
+                      stats={stats}
+                      game={props?.game}
+                      gameId={stats?.gameId}
+                      isLoading={props.loading}
+                      isError={props.error}
+                    />
+                    // <Bf3ServerPlayerlist players={stats?.players} game="bf1" />
+                  )
+                )}
             </>
           )}
           {/* bf4 */}
@@ -438,7 +437,7 @@ export function Results(props: Views): React.ReactElement {
                           value.values[0].readableSettingName,
                         )}
                       </b>
-                      : {}
+                      : { }
                       {value.values[1].readableSettingName}
                     </p>
                   </div>
@@ -549,13 +548,10 @@ export function Results(props: Views): React.ReactElement {
               >
                 {t(`servers.iframe.${element}`)}{" "}
                 <CopyToClipboard
-                  message={`<iframe title="Server playercount" src="https://widgets.gametools.network/servers/${element}/${
-                    props.game
-                  }/${widgetItem}/${widgetReturn}/${
-                    props.platform
-                  }?lng=${getLanguage()}" height="${
-                    widgetSize[index]
-                  }px" width="700px" frameborder="0" allowtransparency="true"></iframe>`}
+                  message={`<iframe title="Server playercount" src="https://widgets.gametools.network/servers/${element}/${props.game
+                    }/${widgetItem}/${widgetReturn}/${props.platform
+                    }?lng=${getLanguage()}" height="${widgetSize[index]
+                    }px" width="700px" frameborder="0" allowtransparency="true"></iframe>`}
                   stateTranslation={"servers.iframe.states"}
                 />
               </p>
@@ -564,11 +560,9 @@ export function Results(props: Views): React.ReactElement {
               ) : (
                 <iframe
                   title="Server playercount"
-                  src={`https://widgets.gametools.network/servers/${element}/${
-                    props.game
-                  }/${widgetItem}/${widgetReturn}/${
-                    props.platform
-                  }?lng=${getLanguage()}`}
+                  src={`https://widgets.gametools.network/servers/${element}/${props.game
+                    }/${widgetItem}/${widgetReturn}/${props.platform
+                    }?lng=${getLanguage()}`}
                   style={{
                     maxWidth: "700px",
                     backgroundColor: "transparent",