2025-04-24 21:10:45 +08:00
9 changed files with 39 additions and 329 deletions
--- a/app/(main)/ClientComponents/ServerDetailChartClient.tsx
+++ b/app/(main)/ClientComponents/ServerDetailChartClient.tsx
@ -6,12 +6,7 @@ import AnimatedCircularProgressBar from "@/components/ui/animated-circular-progr
 import { Card, CardContent } from "@/components/ui/card";
 import { ChartConfig, ChartContainer } from "@/components/ui/chart";
 import getEnv from "@/lib/env-entry";
-import {
-  formatBytes,
-  formatNezhaInfo,
-  formatRelativeTime,
-  nezhaFetcher,
-} from "@/lib/utils";
+import { formatNezhaInfo, formatRelativeTime, nezhaFetcher } from "@/lib/utils";
 import { useTranslations } from "next-intl";
 import { useEffect, useState } from "react";
 import {
@ -344,7 +339,7 @@ function MemChart({ data }: { data: NezhaAPISafe }) {
    <Card>
      <CardContent className="px-6 py-3">
        <section className="flex flex-col gap-1">
-          <div className="flex items-center justify-between">
+          <div className="flex items-center">
            <section className="flex items-center gap-4">
              <div className="flex flex-col">
                <p className=" text-xs text-muted-foreground">{t("Mem")}</p>
@ -373,15 +368,6 @@ function MemChart({ data }: { data: NezhaAPISafe }) {
                </div>
              </div>
            </section>
-            <section className="flex flex-col items-end gap-0.5">
-              <div className="flex text-[11px] font-medium items-center gap-2">
-                {formatBytes(data.status.MemUsed)} /{" "}
-                {formatBytes(data.host.MemTotal)}
-              </div>
-              <div className="flex text-[11px] font-medium items-center gap-2">
-                swap: {formatBytes(data.status.SwapUsed)}
-              </div>
-            </section>
          </div>
          <ChartContainer
            config={chartConfig}
@ -476,23 +462,17 @@ function DiskChart({ data }: { data: NezhaAPISafe }) {
        <section className="flex flex-col gap-1">
          <div className="flex items-center justify-between">
            <p className="text-md font-medium">{t("Disk")}</p>
-            <section className="flex flex-col items-end gap-0.5">
-              <section className="flex items-center gap-2">
-                <p className="text-xs text-end w-10 font-medium">
-                  {disk.toFixed(0)}%
-                </p>
-                <AnimatedCircularProgressBar
-                  className="size-3 text-[0px]"
-                  max={100}
-                  min={0}
-                  value={disk}
-                  primaryColor="hsl(var(--chart-5))"
-                />
-              </section>
-              <div className="flex text-[11px] font-medium items-center gap-2">
-                {formatBytes(data.status.DiskUsed)} /{" "}
-                {formatBytes(data.host.DiskTotal)}
-              </div>
+            <section className="flex items-center gap-2">
+              <p className="text-xs text-end w-10 font-medium">
+                {disk.toFixed(0)}%
+              </p>
+              <AnimatedCircularProgressBar
+                className="size-3 text-[0px]"
+                max={100}
+                min={0}
+                value={disk}
+                primaryColor="hsl(var(--chart-5))"
+              />
            </section>
          </div>
          <ChartContainer
--- a/app/(main)/ClientComponents/ServerDetailClient.tsx
+++ b/app/(main)/ClientComponents/ServerDetailClient.tsx
@ -200,21 +200,6 @@ export default function ServerDetailClient({
        </Card>
      </section>
      <section className="flex flex-wrap gap-2 mt-1">
-        <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("Load")}</p>
-              {data.status.NetInTransfer ? (
-                <div className="text-xs">
-                  {data.status.Load1} / {data.status.Load5} /{" "}
-                  {data.status.Load15}
-                </div>
-              ) : (
-                <div className="text-xs">Unknown</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">
@ -224,9 +209,7 @@ export default function ServerDetailClient({
                  {" "}
                  {formatBytes(data.status.NetOutTransfer)}{" "}
                </div>
-              ) : (
-                <div className="text-xs">Unknown</div>
-              )}
+              ) : null}
            </section>
          </CardContent>
        </Card>
@ -239,9 +222,7 @@ export default function ServerDetailClient({
                  {" "}
                  {formatBytes(data.status.NetInTransfer)}{" "}
                </div>
-              ) : (
-                <div className="text-xs">Unknown</div>
-              )}
+              ) : null}
            </section>
          </CardContent>
        </Card>
--- a/app/(main)/ClientComponents/ServerListClient.tsx
+++ b/app/(main)/ClientComponents/ServerListClient.tsx
@ -2,13 +2,12 @@

 import { ServerApi } from "@/app/types/nezha-api";
 import ServerCard from "@/components/ServerCard";
-import ServerCardInline from "@/components/ServerCardInline";
 import Switch from "@/components/Switch";
 import getEnv from "@/lib/env-entry";
 import { useFilter } from "@/lib/network-filter-context";
 import { useStatus } from "@/lib/status-context";
-import { cn, nezhaFetcher } from "@/lib/utils";
-import { MapIcon, ViewColumnsIcon } from "@heroicons/react/20/solid";
+import { nezhaFetcher } from "@/lib/utils";
+import { GlobeAsiaAustraliaIcon } from "@heroicons/react/20/solid";
 import { useTranslations } from "next-intl";
 import { useRouter } from "next/navigation";
 import { useEffect, useRef, useState } from "react";
@ -23,15 +22,6 @@ export default function ServerListClient() {
  const router = useRouter();

  const [tag, setTag] = useState<string>(defaultTag);
-  const [inline, setInline] = useState<string>("0");
-
-  useEffect(() => {
-    const inlineState = localStorage.getItem("inline");
-    if (inlineState !== null) {
-      console.log("inlineState", inlineState);
-      setInline(inlineState);
-    }
-  }, []);

  useEffect(() => {
    const savedTag = sessionStorage.getItem("selectedTag") || defaultTag;
@ -133,22 +123,7 @@ export default function ServerListClient() {
          }}
          className="rounded-[50px] text-white cursor-pointer [text-shadow:_0_1px_0_rgb(0_0_0_/_20%)] bg-blue-600 hover:bg-blue-500 p-[10px] transition-all shadow-[inset_0_1px_0_rgba(255,255,255,0.2)] hover:shadow-[inset_0_1px_0_rgba(0,0,0,0.2)] "
        >
-          <MapIcon className="size-[13px]" />
-        </button>
-        <button
-          onClick={() => {
-            setInline(inline === "0" ? "1" : "0");
-            localStorage.setItem("inline", inline === "0" ? "1" : "0");
-          }}
-          className={cn(
-            "rounded-[50px] text-white cursor-pointer [text-shadow:_0_1px_0_rgb(0_0_0_/_20%)] bg-blue-600  p-[10px] transition-all shadow-[inset_0_1px_0_rgba(255,255,255,0.2)]  ",
-            {
-              "shadow-[inset_0_1px_0_rgba(0,0,0,0.2)] bg-blue-500":
-                inline === "1",
-            },
-          )}
-        >
-          <ViewColumnsIcon className="size-[13px]" />
+          <GlobeAsiaAustraliaIcon className="size-[13px]" />
        </button>
        {getEnv("NEXT_PUBLIC_ShowTag") === "true" && (
          <Switch
@ -159,27 +134,14 @@ export default function ServerListClient() {
          />
        )}
      </section>
-      {inline === "1" && (
-        <section
-          ref={containerRef}
-          className="flex flex-col gap-2 overflow-x-scroll scrollbar-hidden"
-        >
-          {filteredServers.map((serverInfo) => (
-            <ServerCardInline key={serverInfo.id} serverInfo={serverInfo} />
-          ))}
-        </section>
-      )}
-
-      {inline === "0" && (
-        <section
-          ref={containerRef}
-          className="grid grid-cols-1 gap-2 md:grid-cols-2"
-        >
-          {filteredServers.map((serverInfo) => (
-            <ServerCard key={serverInfo.id} serverInfo={serverInfo} />
-          ))}
-        </section>
-      )}
+      <section
+        ref={containerRef}
+        className="grid grid-cols-1 gap-2 md:grid-cols-2"
+      >
+        {filteredServers.map((serverInfo) => (
+          <ServerCard key={serverInfo.id} serverInfo={serverInfo} />
+        ))}
+      </section>
    </>
  );
 }
--- a/components/ServerCardInline.tsx
+++ b/components/ServerCardInline.tsx
@ -1,177 +0,0 @@
-import { NezhaAPISafe } from "@/app/types/nezha-api";
-import ServerFlag from "@/components/ServerFlag";
-import ServerUsageBar from "@/components/ServerUsageBar";
-import { Card } from "@/components/ui/card";
-import getEnv from "@/lib/env-entry";
-import {
-  GetFontLogoClass,
-  GetOsName,
-  MageMicrosoftWindows,
-} from "@/lib/logo-class";
-import { cn, formatBytes, formatNezhaInfo } from "@/lib/utils";
-import { useTranslations } from "next-intl";
-import Link from "next/link";
-
-export default function ServerCardInline({
-  serverInfo,
-}: {
-  serverInfo: NezhaAPISafe;
-}) {
-  const t = useTranslations("ServerCard");
-  const { id, name, country_code, online, cpu, up, down, mem, stg, host } =
-    formatNezhaInfo(serverInfo);
-
-  const showFlag = getEnv("NEXT_PUBLIC_ShowFlag") === "true";
-
-  const saveSession = () => {
-    sessionStorage.setItem("fromMainPage", "true");
-  };
-
-  return online ? (
-    <Link onClick={saveSession} href={`/server/${id}`} prefetch={true}>
-      <Card
-        className={cn(
-          "flex items-center lg:flex-row justify-start gap-3 p-3 md:px-5 cursor-pointer hover:bg-accent/50 transition-colors min-w-[900px] w-full",
-        )}
-      >
-        <section
-          className={cn("grid items-center gap-2 w-40")}
-          style={{ gridTemplateColumns: "auto auto 1fr" }}
-        >
-          <span className="h-2 w-2 shrink-0 rounded-full bg-green-500 self-center"></span>
-          <div
-            className={cn(
-              "flex items-center justify-center",
-              showFlag ? "min-w-[17px]" : "min-w-0",
-            )}
-          >
-            {showFlag ? <ServerFlag country_code={country_code} /> : null}
-          </div>
-          <div className="relative">
-            <p
-              className={cn(
-                "break-all font-bold tracking-tight",
-                showFlag ? "text-xs " : "text-sm",
-              )}
-            >
-              {name}
-            </p>
-          </div>
-        </section>
-        <div className="flex flex-col gap-2">
-          <section className={cn("grid grid-cols-9 items-center gap-3 flex-1")}>
-            <div
-              className={"items-center flex flex-row gap-2 whitespace-nowrap"}
-            >
-              <div className="text-xs font-semibold">
-                {host.Platform.includes("Windows") ? (
-                  <MageMicrosoftWindows className="size-[10px]" />
-                ) : (
-                  <p className={`fl-${GetFontLogoClass(host.Platform)}`} />
-                )}
-              </div>
-              <div className={"flex w-14 flex-col"}>
-                <p className="text-xs text-muted-foreground">{t("System")}</p>
-                <div className="flex items-center text-[10.5px] font-semibold">
-                  {host.Platform.includes("Windows")
-                    ? "Windows"
-                    : GetOsName(host.Platform)}
-                </div>
-              </div>
-            </div>
-            <div className={"flex w-20 flex-col"}>
-              <p className="text-xs text-muted-foreground">{t("Uptime")}</p>
-              <div className="flex items-center text-xs font-semibold">
-                {(serverInfo?.status.Uptime / 86400).toFixed(0)} {"Days"}
-              </div>
-            </div>
-            <div className={"flex w-14 flex-col"}>
-              <p className="text-xs text-muted-foreground">{t("CPU")}</p>
-              <div className="flex items-center text-xs font-semibold">
-                {cpu.toFixed(2)}%
-              </div>
-              <ServerUsageBar value={cpu} />
-            </div>
-            <div className={"flex w-14 flex-col"}>
-              <p className="text-xs text-muted-foreground">{t("Mem")}</p>
-              <div className="flex items-center text-xs font-semibold">
-                {mem.toFixed(2)}%
-              </div>
-              <ServerUsageBar value={mem} />
-            </div>
-            <div className={"flex w-14 flex-col"}>
-              <p className="text-xs text-muted-foreground">{t("STG")}</p>
-              <div className="flex items-center text-xs font-semibold">
-                {stg.toFixed(2)}%
-              </div>
-              <ServerUsageBar value={stg} />
-            </div>
-            <div className={"flex w-16 flex-col"}>
-              <p className="text-xs text-muted-foreground">{t("Upload")}</p>
-              <div className="flex items-center text-xs font-semibold">
-                {up >= 1024
-                  ? `${(up / 1024).toFixed(2)}G/s`
-                  : `${up.toFixed(2)}M/s`}
-              </div>
-            </div>
-            <div className={"flex w-16 flex-col"}>
-              <p className="text-xs text-muted-foreground">{t("Download")}</p>
-              <div className="flex items-center text-xs font-semibold">
-                {down >= 1024
-                  ? `${(down / 1024).toFixed(2)}G/s`
-                  : `${down.toFixed(2)}M/s`}
-              </div>
-            </div>
-            <div className={"flex w-20 flex-col"}>
-              <p className="text-xs text-muted-foreground">
-                {t("TotalUpload")}
-              </p>
-              <div className="flex items-center text-xs font-semibold">
-                {formatBytes(serverInfo.status.NetOutTransfer)}
-              </div>
-            </div>
-            <div className={"flex w-20 flex-col"}>
-              <p className="text-xs text-muted-foreground">
-                {t("TotalDownload")}
-              </p>
-              <div className="flex items-center text-xs font-semibold">
-                {formatBytes(serverInfo.status.NetInTransfer)}
-              </div>
-            </div>
-          </section>
-        </div>
-      </Card>
-    </Link>
-  ) : (
-    <Card
-      className={cn(
-        "flex items-center justify-start gap-3 p-3 md:px-5 min-h-[61px] min-w-[900px] flex-row",
-      )}
-    >
-      <section
-        className={cn("grid items-center gap-2 lg:w-40")}
-        style={{ gridTemplateColumns: "auto auto 1fr" }}
-      >
-        <span className="h-2 w-2 shrink-0 rounded-full bg-red-500 self-center"></span>
-        <div
-          className={cn(
-            "flex items-center justify-center",
-            showFlag ? "min-w-[17px]" : "min-w-0",
-          )}
-        >
-          {showFlag ? <ServerFlag country_code={country_code} /> : null}
-        </div>
-        <div className="relative">
-          <p
-            className={cn(
-              "break-all font-bold tracking-tight",
-              showFlag ? "text-xs" : "text-sm",
-            )}
-          >
-            {name}
-          </p>
-        </div>
-      </section>
-    </Card>
-  );
-}
--- a/messages/en.json
+++ b/messages/en.json
@ -18,11 +18,7 @@
    "STG": "STG",
    "Upload": "Upload",
    "Download": "Download",
-    "Offline": "Offline",
-    "Uptime": "Uptime",
-    "TotalUpload": "Upload",
-    "TotalDownload": "Download",
-    "Region": "Region"
+    "Offline": "Offline"
  },
  "TabSwitch": {
    "Detail": "Detail",
@ -43,11 +39,7 @@
    "Network": "Network",
    "Load": "Load",
    "Online": "Online",
-    "Offline": "Offline",
-    "Uptime": "Uptime",
-    "Upload": "Upload",
-    "Download": "Download",
-    "Region": "Region"
+    "Offline": "Offline"
  },
  "NetworkChartClient": {
    "avg_delay": "Latency",
@ -71,8 +63,7 @@
    "System": "System",
    "CPU": "CPU",
    "Upload": "Upload",
-    "Download": "Download",
-    "Load": "Load"
+    "Download": "Download"
  },
  "ServerDetailChartClient": {
    "chart_fetch_error_message": "Please check your environment variables and review the server console",
--- a/messages/ja.json
+++ b/messages/ja.json
@ -18,11 +18,7 @@
    "STG": "STG",
    "Upload": "Upload",
    "Download": "Download",
-    "Offline": "Offline",
-    "Uptime": "Uptime",
-    "TotalUpload": "Upload",
-    "TotalDownload": "Download",
-    "Region": "Region"
+    "Offline": "Offline"
  },
  "TabSwitch": {
    "Detail": "詳細",
@ -43,11 +39,7 @@
    "Network": "ネットワーク",
    "Load": "負荷",
    "Online": "オンライン時間",
-    "Offline": "オフライン",
-    "Uptime": "アップタイム",
-    "Upload": "アップロード",
-    "Download": "ダウンロード",
-    "Region": "地域"
+    "Offline": "オフライン"
  },
  "NetworkChartClient": {
    "avg_delay": "遅延",
@ -70,7 +62,6 @@
    "Region": "地域",
    "System": "システム",
    "CPU": "CPU",
-    "Load": "負荷",
    "Upload": "Upload",
    "Download": "Download"
  },
--- a/messages/zh-t.json
+++ b/messages/zh-t.json
@ -18,11 +18,7 @@
    "STG": "儲存",
    "Upload": "上傳",
    "Download": "下載",
-    "Offline": "離線",
-    "Uptime": "稼働時間",
-    "TotalUpload": "总上傳",
-    "TotalDownload": "总下載",
-    "Region": "地區"
+    "Offline": "離線"
  },
  "TabSwitch": {
    "Detail": "詳細",
@ -43,11 +39,7 @@
    "Network": "網路",
    "Load": "負載",
    "Online": "在線時間",
-    "Offline": "離線",
-    "Uptime": "稼働時間",
-    "Upload": "上傳",
-    "Download": "下載",
-    "Region": "地域"
+    "Offline": "離線"
  },
  "NetworkChartClient": {
    "avg_delay": "延遲",
@ -71,8 +63,7 @@
    "System": "系統",
    "CPU": "CPU",
    "Upload": "上傳",
-    "Download": "下載",
-    "Load": "負載"
+    "Download": "下載"
  },
  "ServerDetailChartClient": {
    "chart_fetch_error_message": "獲取伺服器詳情失敗,請檢查您的環境變數並檢查伺服器控制台",
--- a/messages/zh.json
+++ b/messages/zh.json
@ -18,11 +18,7 @@
    "STG": "存储",
    "Upload": "上传",
    "Download": "下载",
-    "Offline": "离线",
-    "Uptime": "运行时间",
-    "TotalUpload": "总上传",
-    "TotalDownload": "总下载",
-    "Region": "地区"
+    "Offline": "离线"
  },
  "TabSwitch": {
    "Detail": "详情",
@ -43,11 +39,7 @@
    "Network": "网络",
    "Load": "负载",
    "Online": "在线时间",
-    "Offline": "离线",
-    "Uptime": "运行时间",
-    "Upload": "上传",
-    "Download": "下载",
-    "Region": "地区"
+    "Offline": "离线"
  },
  "NetworkChartClient": {
    "avg_delay": "延迟",
@ -71,11 +63,10 @@
    "System": "系统",
    "CPU": "CPU",
    "Upload": "上传",
-    "Download": "下载",
-    "Load": "负载"
+    "Download": "下载"
  },
  "ServerDetailChartClient": {
-    "chart_fetch_error_message": "获取服务器详情失败，请检查您的环境变量并检查服务器控制台",
+    "chart_fetch_error_message": "获取服务器详情失败,请检查您的环境变量并检查服务器控制台",
    "Process": "进程",
    "Disk": "磁盘",
    "Mem": "内存",
--- a/package.json
+++ b/package.json
@ -1,6 +1,6 @@
 {
  "name": "nezha-dash",
-  "version": "1.6.2",
+  "version": "1.5.7",
  "private": true,
  "scripts": {
    "dev": "next dev -p 3040",