From 231a66931b4a91f13b78672d0636ff4c2a55e238 Mon Sep 17 00:00:00 2001
From: hamster1963 <1410514192@qq.com>
Date: Fri, 13 Dec 2024 10:11:00 +0800
Subject: [PATCH] fix: ip info error

---
 app/(main)/ClientComponents/ServerIPInfo.tsx | 166 +++++++++++--------
 1 file changed, 94 insertions(+), 72 deletions(-)

diff --git a/app/(main)/ClientComponents/ServerIPInfo.tsx b/app/(main)/ClientComponents/ServerIPInfo.tsx
index eb430d8..ad7a91b 100644
--- a/app/(main)/ClientComponents/ServerIPInfo.tsx
+++ b/app/(main)/ClientComponents/ServerIPInfo.tsx
@@ -26,78 +26,100 @@ export default function ServerIPInfo({ server_id }: { server_id: number }) {
   return (
     <>
       <section className="flex flex-wrap gap-2 mb-4">
-        <Card className="rounded-[10px] bg-transparent border-none shadow-none">
-          <CardContent className="px-1.5 py-1">
-            <section className="flex flex-col items-start gap-0.5">
-              <p className="text-xs text-muted-foreground">{"ASN"}</p>
-              <div className="text-xs">
-                {data.asn.autonomous_system_organization}
-              </div>
-            </section>
-          </CardContent>
-        </Card>
-        <Card className="rounded-[10px] bg-transparent border-none shadow-none">
-          <CardContent className="px-1.5 py-1">
-            <section className="flex flex-col items-start gap-0.5">
-              <p className="text-xs text-muted-foreground">{t("asn_number")}</p>
-              <div className="text-xs">
-                AS{data.asn.autonomous_system_number}
-              </div>
-            </section>
-          </CardContent>
-        </Card>
-        <Card className="rounded-[10px] bg-transparent border-none shadow-none">
-          <CardContent className="px-1.5 py-1">
-            <section className="flex flex-col items-start gap-0.5">
-              <p className="text-xs text-muted-foreground">
-                {t("registered_country")}
-              </p>
-              <div className="text-xs">
-                {data.city.registered_country?.names.en}
-              </div>
-            </section>
-          </CardContent>
-        </Card>
-        <Card className="rounded-[10px] bg-transparent border-none shadow-none">
-          <CardContent className="px-1.5 py-1">
-            <section className="flex flex-col items-start gap-0.5">
-              <p className="text-xs text-muted-foreground">{"ISO"}</p>
-              <div className="text-xs">{data.city.country?.iso_code}</div>
-            </section>
-          </CardContent>
-        </Card>
-        <Card className="rounded-[10px] bg-transparent border-none shadow-none">
-          <CardContent className="px-1.5 py-1">
-            <section className="flex flex-col items-start gap-0.5">
-              <p className="text-xs text-muted-foreground">{t("city")}</p>
-              <div className="text-xs">{data.city.city?.names.en}</div>
-            </section>
-          </CardContent>
-        </Card>
-        <Card className="rounded-[10px] bg-transparent border-none shadow-none">
-          <CardContent className="px-1.5 py-1">
-            <section className="flex flex-col items-start gap-0.5">
-              <p className="text-xs text-muted-foreground">{t("longitude")}</p>
-              <div className="text-xs">{data.city.location?.longitude}</div>
-            </section>
-          </CardContent>
-        </Card>
-        <Card className="rounded-[10px] bg-transparent border-none shadow-none">
-          <CardContent className="px-1.5 py-1">
-            <section className="flex flex-col items-start gap-0.5">
-              <p className="text-xs text-muted-foreground">{t("latitude")}</p>
-              <div className="text-xs">{data.city.location?.latitude}</div>
-            </section>
-          </CardContent>
-        </Card>
-        <Card className="rounded-[10px] bg-transparent border-none shadow-none">
-          <CardContent className="px-1.5 py-1">
-            <section className="flex flex-col items-start gap-0.5">
-              <p className="text-xs text-muted-foreground">{t("time_zone")}</p>
-              <div className="text-xs">{data.city.location?.time_zone}</div>
-            </section>
-          </CardContent>
-        </Card>
+        {data.asn.autonomous_system_organization && (
+          <Card className="rounded-[10px] bg-transparent border-none shadow-none">
+            <CardContent className="px-1.5 py-1">
+              <section className="flex flex-col items-start gap-0.5">
+                <p className="text-xs text-muted-foreground">{"ASN"}</p>
+                <div className="text-xs">
+                  {data.asn.autonomous_system_organization}
+                </div>
+              </section>
+            </CardContent>
+          </Card>
+        )}
+        {data.asn.autonomous_system_number && (
+          <Card className="rounded-[10px] bg-transparent border-none shadow-none">
+            <CardContent className="px-1.5 py-1">
+              <section className="flex flex-col items-start gap-0.5">
+                <p className="text-xs text-muted-foreground">
+                  {t("asn_number")}
+                </p>
+                <div className="text-xs">
+                  AS{data.asn.autonomous_system_number}
+                </div>
+              </section>
+            </CardContent>
+          </Card>
+        )}
+        {data.city.registered_country?.names.en && (
+          <Card className="rounded-[10px] bg-transparent border-none shadow-none">
+            <CardContent className="px-1.5 py-1">
+              <section className="flex flex-col items-start gap-0.5">
+                <p className="text-xs text-muted-foreground">
+                  {t("registered_country")}
+                </p>
+                <div className="text-xs">
+                  {data.city.registered_country?.names.en}
+                </div>
+              </section>
+            </CardContent>
+          </Card>
+        )}
+        {data.city.country?.iso_code && (
+          <Card className="rounded-[10px] bg-transparent border-none shadow-none">
+            <CardContent className="px-1.5 py-1">
+              <section className="flex flex-col items-start gap-0.5">
+                <p className="text-xs text-muted-foreground">{"ISO"}</p>
+                <div className="text-xs">{data.city.country?.iso_code}</div>
+              </section>
+            </CardContent>
+          </Card>
+        )}
+        {data.city.city?.names.en && (
+          <Card className="rounded-[10px] bg-transparent border-none shadow-none">
+            <CardContent className="px-1.5 py-1">
+              <section className="flex flex-col items-start gap-0.5">
+                <p className="text-xs text-muted-foreground">{t("city")}</p>
+                <div className="text-xs">{data.city.city?.names.en}</div>
+              </section>
+            </CardContent>
+          </Card>
+        )}
+        {data.city.location?.longitude && (
+          <Card className="rounded-[10px] bg-transparent border-none shadow-none">
+            <CardContent className="px-1.5 py-1">
+              <section className="flex flex-col items-start gap-0.5">
+                <p className="text-xs text-muted-foreground">
+                  {t("longitude")}
+                </p>
+                <div className="text-xs">{data.city.location?.longitude}</div>
+              </section>
+            </CardContent>
+          </Card>
+        )}
+        {data.city.location?.latitude && (
+          <Card className="rounded-[10px] bg-transparent border-none shadow-none">
+            <CardContent className="px-1.5 py-1">
+              <section className="flex flex-col items-start gap-0.5">
+                <p className="text-xs text-muted-foreground">{t("latitude")}</p>
+                <div className="text-xs">{data.city.location?.latitude}</div>
+              </section>
+            </CardContent>
+          </Card>
+        )}
+        {data.city.location?.time_zone && (
+          <Card className="rounded-[10px] bg-transparent border-none shadow-none">
+            <CardContent className="px-1.5 py-1">
+              <section className="flex flex-col items-start gap-0.5">
+                <p className="text-xs text-muted-foreground">
+                  {t("time_zone")}
+                </p>
+                <div className="text-xs">{data.city.location?.time_zone}</div>
+              </section>
+            </CardContent>
+          </Card>
+        )}
         {data.city.postal && (
           <Card className="rounded-[10px] bg-transparent border-none shadow-none">
             <CardContent className="px-1.5 py-1">