feat: ip info i18n

app/(main)/ClientComponents/ServerIPInfo.tsx

@@ -4,9 +4,12 @@ import { IPInfo } from "@/app/api/server-ip/route";
 import { Loader } from "@/components/loading/Loader";
 import { Card, CardContent } from "@/components/ui/card";
 import { nezhaFetcher } from "@/lib/utils";
+import { useTranslations } from "next-intl";
 import useSWRImmutable from "swr/immutable";
 
 export default function ServerIPInfo({ server_id }: { server_id: number }) {
+  const t = useTranslations("IPInfo");
+
   const { data } = useSWRImmutable<IPInfo>(
     `/api/server-ip?server_id=${server_id}`,
     nezhaFetcher,
@@ -36,7 +39,7 @@ export default function ServerIPInfo({ server_id }: { server_id: 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">{"Origin ASN"}</p>
+              <p className="text-xs text-muted-foreground">{t("asn_number")}</p>
               <div className="text-xs">
                 AS{data.asn.autonomous_system_number}
               </div>
@@ -47,7 +50,7 @@ export default function ServerIPInfo({ server_id }: { server_id: number }) {
           <CardContent className="px-1.5 py-1">
             <section className="flex flex-col items-start gap-0.5">
               <p className="text-xs text-muted-foreground">
-                {"Registered Country"}
+                {t("registered_country")}
               </p>
               <div className="text-xs">
                 {data.city.registered_country?.names.en}
@@ -55,24 +58,6 @@ export default function ServerIPInfo({ server_id }: { server_id: number }) {
             </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">{"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">
-              <section className="flex flex-col items-start gap-0.5">
-                <p className="text-xs text-muted-foreground">{"Postal"}</p>
-                <div className="text-xs">{data.city.postal?.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">
@@ -84,7 +69,7 @@ export default function ServerIPInfo({ server_id }: { server_id: 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">{"City"}</p>
+              <p className="text-xs text-muted-foreground">{t("city")}</p>
               <div className="text-xs">{data.city.city?.names.en}</div>
             </section>
           </CardContent>
@@ -92,7 +77,7 @@ export default function ServerIPInfo({ server_id }: { server_id: 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">{"Longitude"}</p>
+              <p className="text-xs text-muted-foreground">{t("longitude")}</p>
               <div className="text-xs">{data.city.location?.longitude}</div>
             </section>
           </CardContent>
@@ -100,11 +85,31 @@ export default function ServerIPInfo({ server_id }: { server_id: 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">{"Latitude"}</p>
+              <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.city.postal && (
+          <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("postal_code")}
+                </p>
+                <div className="text-xs">{data.city.postal?.code}</div>
+              </section>
+            </CardContent>
+          </Card>
+        )}
       </section>
     </>
   );

messages/en.json

@@ -55,6 +55,15 @@
     "avg_delay": "Latency",
     "chart_fetch_error_message": "Failed to fetch network data, please check if the server monitoring is enabled"
   },
+  "IPInfo": {
+    "asn_number": "Origin ASN",
+    "registered_country": "Registered Country",
+    "time_zone": "Time Zone",
+    "postal_code": "Postal Code",
+    "city": "City",
+    "longitude": "Longitude",
+    "latitude": "Latitude"
+  },
   "NetworkChart": {
     "ServerMonitorCount": "Services"
   },

messages/ja.json

@@ -55,6 +55,15 @@
     "avg_delay": "遅延",
     "chart_fetch_error_message": "ネットワークデータの取得に失敗しました。サーバーの監視が有効になっているかどうかを確認してください"
   },
+  "IPInfo": {
+    "asn_number": "ASN",
+    "registered_country": "Registered Country",
+    "time_zone": "時刻",
+    "postal_code": "郵便番号",
+    "city": "都市",
+    "longitude": "経度",
+    "latitude": "緯度"
+  },
   "NetworkChart": {
     "ServerMonitorCount": "サービス"
   },

messages/zh-t.json

@@ -55,6 +55,15 @@
     "avg_delay": "延遲",
     "chart_fetch_error_message": "獲取網絡數據失敗，請檢查是否開啟服務端監控"
   },
+  "IPInfo": {
+    "asn_number": "ASN Number",
+    "registered_country": "注册地區",
+    "time_zone": "時區",
+    "postal_code": "郵遞區號",
+    "city": "城市",
+    "longitude": "經度",
+    "latitude": "緯度"
+  },
   "NetworkChart": {
     "ServerMonitorCount": "個監測服務"
   },

messages/zh.json

@@ -58,6 +58,15 @@
   "NetworkChart": {
     "ServerMonitorCount": "个监控服务"
   },
+  "IPInfo": {
+    "asn_number": "ASN 编号",
+    "registered_country": "注册地",
+    "time_zone": "时区",
+    "postal_code": "邮政编码",
+    "city": "城市",
+    "longitude": "经度",
+    "latitude": "纬度"
+  },
   "ServerDetailClient": {
     "detail_fetch_error_message": "获取服务器详情失败,请检查您的环境变量并检查服务器控制台",
     "status": "状态",