app/(main)/header.tsx

@@ -3,13 +3,12 @@
 import { LanguageSwitcher } from "@/components/LanguageSwitcher"
 import { ModeToggle } from "@/components/ThemeSwitcher"
 import { Separator } from "@/components/ui/separator"
-
+import { Skeleton } from "@/components/ui/skeleton"
 import getEnv from "@/lib/env-entry"
-import NumberFlow, { NumberFlowGroup } from "@number-flow/react"
 import { DateTime } from "luxon"
 import { useTranslations } from "next-intl"
 import { useRouter } from "next/navigation"
-import React from "react"
+import { useEffect, useState } from "react"
 
 function Header() {
   const t = useTranslations("Header")
@@ -100,51 +99,33 @@ function Links() {
 
 function Overview() {
   const t = useTranslations("Overview")
-  const [time, setTime] = React.useState({
+  const [mouted, setMounted] = useState(false)
-    hh: DateTime.now().setLocale("en-US").hour,
+  useEffect(() => {
-    mm: DateTime.now().setLocale("en-US").minute,
+    setMounted(true)
-    ss: DateTime.now().setLocale("en-US").second,
+  }, [])
-  })
+  const timeOption = DateTime.TIME_WITH_SECONDS
-
+  timeOption.hour12 = true
-  React.useEffect(() => {
+  const [timeString, setTimeString] = useState(
-    const timer = setInterval(() => {
+    DateTime.now().setLocale("en-US").toLocaleString(timeOption),
-      setTime({
+  )
-        hh: DateTime.now().setLocale("en-US").hour,
+  useEffect(() => {
-        mm: DateTime.now().setLocale("en-US").minute,
+    const updateTime = () => {
-        ss: DateTime.now().setLocale("en-US").second,
+      const now = DateTime.now().setLocale("en-US").toLocaleString(timeOption)
-      })
+      setTimeString(now)
-    }, 1000)
+      requestAnimationFrame(updateTime)
-
+    }
-    return () => clearInterval(timer)
+    requestAnimationFrame(updateTime)
   }, [])
-
   return (
     <section className={"mt-10 flex flex-col md:mt-16"}>
       <p className="text-base font-semibold">{t("p_2277-2331_Overview")}</p>
       <div className="flex items-center gap-1.5">
         <p className="text-sm font-medium opacity-50">{t("p_2390-2457_wherethetimeis")}</p>
-        <NumberFlowGroup>
+        {mouted ? (
-          <div
+          <p className="text-sm font-medium">{timeString}</p>
-            style={{ fontVariantNumeric: "tabular-nums" }}
+        ) : (
-            className="flex text-sm font-medium mt-0.5"
+          <Skeleton className="h-[20px] w-[50px] rounded-[5px] bg-muted-foreground/10 animate-none" />
-          >
+        )}
-            <NumberFlow trend={1} value={time.hh} format={{ minimumIntegerDigits: 2 }} />
-            <NumberFlow
-              prefix=":"
-              trend={1}
-              value={time.mm}
-              digits={{ 1: { max: 5 } }}
-              format={{ minimumIntegerDigits: 2 }}
-            />
-            <NumberFlow
-              prefix=":"
-              trend={1}
-              value={time.ss}
-              digits={{ 1: { max: 5 } }}
-              format={{ minimumIntegerDigits: 2 }}
-            />
-          </div>
-        </NumberFlowGroup>
       </div>
     </section>
   )

components/ServerCard.tsx

@@ -30,7 +30,7 @@ export default function ServerCard({
     <Link onClick={saveSession} href={`/server/${id}`} prefetch={true}>
       <Card
         className={cn(
-          "flex flex-col items-center justify-start gap-3 p-3 md:px-5 cursor-pointer hover:border-stone-300 dark:hover:border-stone-700 hover:shadow-md",
+          "flex flex-col items-center justify-start gap-3 p-3 md:px-5 cursor-pointer hover:bg-accent/50 transition-colors",
           {
             "flex-col": fixedTopServerName,
             "lg:flex-row": !fixedTopServerName,
@@ -137,7 +137,7 @@ export default function ServerCard({
     <Link onClick={saveSession} href={`/server/${id}`} prefetch={true}>
       <Card
         className={cn(
-          "flex flex-col items-center justify-start gap-3 p-3 md:px-5 cursor-pointer hover:border-stone-300 dark:hover:border-stone-700 hover:shadow-md",
+          "flex flex-col items-center justify-start gap-3 p-3 md:px-5 cursor-pointer hover:bg-accent/50 transition-colors",
           showNetTransfer ? "lg:min-h-[91px] min-h-[123px]" : "lg:min-h-[61px] min-h-[93px]",
           {
             "flex-col": fixedTopServerName,

components/ServerCardInline.tsx

@@ -29,7 +29,7 @@ export default function ServerCardInline({
     <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:border-stone-300 dark:hover:border-stone-700 hover:shadow-md  min-w-[900px] w-full",
+          "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
@@ -124,34 +124,27 @@ export default function ServerCardInline({
       </Card>
     </Link>
   ) : (
-    <Link onClick={saveSession} href={`/server/${id}`} prefetch={true}>
+    <Card
-      <Card
+      className={cn(
-        className={cn(
+        "flex items-center justify-start gap-3 p-3 md:px-5 min-h-[61px] min-w-[900px] flex-row",
-          "flex items-center justify-start gap-3 p-3 md:px-5 hover:border-stone-300 dark:hover:border-stone-700 hover:shadow-md min-h-[61px] min-w-[900px] flex-row",
+      )}
-        )}
+    >
+      <section
+        className={cn("grid items-center gap-2 lg:w-40")}
+        style={{ gridTemplateColumns: "auto auto 1fr" }}
       >
-        <section
+        <span className="h-2 w-2 shrink-0 rounded-full bg-red-500 self-center" />
-          className={cn("grid items-center gap-2 lg:w-40")}
+        <div
-          style={{ gridTemplateColumns: "auto auto 1fr" }}
+          className={cn("flex items-center justify-center", showFlag ? "min-w-[17px]" : "min-w-0")}
         >
-          <span className="h-2 w-2 shrink-0 rounded-full bg-red-500 self-center" />
+          {showFlag ? <ServerFlag country_code={country_code} /> : null}
-          <div
+        </div>
-            className={cn(
+        <div className="relative w-28">
-              "flex items-center justify-center",
+          <p className={cn("break-all font-bold tracking-tight", showFlag ? "text-xs" : "text-sm")}>
-              showFlag ? "min-w-[17px]" : "min-w-0",
+            {name}
-            )}
+          </p>
-          >
+        </div>
-            {showFlag ? <ServerFlag country_code={country_code} /> : null}
+      </section>
-          </div>
+    </Card>
-          <div className="relative w-28">
-            <p
-              className={cn("break-all font-bold tracking-tight", showFlag ? "text-xs" : "text-sm")}
-            >
-              {name}
-            </p>
-          </div>
-        </section>
-      </Card>
-    </Link>
   )
 }

lib/env-entry.ts

@@ -1,10 +1,8 @@
-import { getClientEnv, getServerEnv } from "./env"
+import { env } from "next-runtime-env"
-import type { EnvKey } from "./env"
 
-export default function getEnv(key: EnvKey): string | undefined {
+export default function getEnv(key: string) {
   if (key.startsWith("NEXT_PUBLIC_")) {
-    const clientKey = key.replace("NEXT_PUBLIC_", "") as any
+    return env(key)
-    return getClientEnv(clientKey)
   }
-  return getServerEnv(key as any)
+  return process.env[key]
 }

lib/env.ts

@@ -1,147 +0,0 @@
-import { env } from "next-runtime-env"
-
-/**
- * Server-side environment variables
- */
-export interface ServerEnvConfig {
-  /** Nezha API base URL */
-  NezhaBaseUrl: string
-  /** Nezha API authentication token */
-  NezhaAuth: string
-  /** Default locale for the application */
-  DefaultLocale: string
-  /** Force show all servers */
-  ForceShowAllServers: boolean
-  /** Site password */
-  SitePassword: string
-}
-
-/**
- * Client-side environment variables (NEXT_PUBLIC_*)
- */
-export interface ClientEnvConfig {
-  /** Nezha data fetch interval in milliseconds */
-  NezhaFetchInterval: number
-  /** Show country flags */
-  ShowFlag: boolean
-  /** Disable cartoon effects */
-  DisableCartoon: boolean
-  /** Show server tags */
-  ShowTag: boolean
-  /** Show network transfer information */
-  ShowNetTransfer: boolean
-  /** Force use SVG flags */
-  ForceUseSvgFlag: boolean
-  /** Fix server names at the top */
-  FixedTopServerName: boolean
-  /** Custom logo URL */
-  CustomLogo: string
-  /** Custom site title */
-  CustomTitle: string
-  /** Custom site description */
-  CustomDescription: string
-  /** Custom navigation links */
-  Links: string
-  /** Disable search engine indexing */
-  DisableIndex: boolean
-  /** Show tag count */
-  ShowTagCount: boolean
-  /** Show IP information */
-  ShowIpInfo: boolean
-}
-
-/**
- * 环境变量键的类型定义
- */
-export type EnvKey = ServerEnvKey | ClientEnvKey
-
-/**
- * 服务器端环境变量键
- */
-export type ServerEnvKey = keyof ServerEnvConfig
-
-/**
- * 客户端环境变量键
- */
-export type ClientEnvKey = `NEXT_PUBLIC_${keyof ClientEnvConfig}`
-
-/**
- * Get a server-side environment variable
- * @param key - Environment variable key
- * @returns Environment variable value
- */
-export function getServerEnv<K extends keyof ServerEnvConfig>(key: K): string | undefined {
-  const value = process.env[key]
-  if (!value) {
-    console.warn(`Environment variable ${key} is not set`)
-    return undefined
-  }
-  return value
-}
-
-/**
- * Get a client-side environment variable
- * @param key - Environment variable key
- * @returns Environment variable value
- */
-export function getClientEnv<K extends keyof ClientEnvConfig>(key: K): string | undefined {
-  const envKey = `NEXT_PUBLIC_${key}`
-  const value = env(envKey)
-  if (!value) {
-    console.warn(`Environment variable ${envKey} is not set`)
-    return undefined
-  }
-  return value
-}
-
-/**
- * Parse boolean environment variable
- * @param value - Environment variable value
- * @returns Parsed boolean value
- */
-export function parseBoolean(value: string | undefined): boolean {
-  return value?.toLowerCase() === "true"
-}
-
-/**
- * Parse number environment variable
- * @param value - Environment variable value
- * @param defaultValue - Default value if parsing fails
- * @returns Parsed number value
- */
-export function parseNumber(value: string | undefined, defaultValue: number): number {
-  if (!value) return defaultValue
-  const parsed = Number.parseInt(value, 10)
-  return Number.isNaN(parsed) ? defaultValue : parsed
-}
-
-/**
- * Get all environment variables with their current values
- */
-export function getAllEnvConfig(): { server: ServerEnvConfig; client: ClientEnvConfig } {
-  return {
-    server: {
-      NezhaBaseUrl: getServerEnv("NezhaBaseUrl") || "",
-      NezhaAuth: getServerEnv("NezhaAuth") || "",
-      DefaultLocale: getServerEnv("DefaultLocale") || "",
-      ForceShowAllServers: parseBoolean(getServerEnv("ForceShowAllServers")),
-      SitePassword: getServerEnv("SitePassword") || "",
-    },
-    client: {
-      NezhaFetchInterval: parseNumber(getClientEnv("NezhaFetchInterval"), 5000),
-      ShowFlag: parseBoolean(getClientEnv("ShowFlag")),
-      DisableCartoon: parseBoolean(getClientEnv("DisableCartoon")),
-      ShowTag: parseBoolean(getClientEnv("ShowTag")),
-      ShowNetTransfer: parseBoolean(getClientEnv("ShowNetTransfer")),
-      ForceUseSvgFlag: parseBoolean(getClientEnv("ForceUseSvgFlag")),
-      FixedTopServerName: parseBoolean(getClientEnv("FixedTopServerName")),
-      CustomLogo: getClientEnv("CustomLogo") || "",
-      CustomTitle: getClientEnv("CustomTitle") || "",
-      CustomDescription: getClientEnv("CustomDescription") || "",
-      Links: getClientEnv("Links") || "",
-      DisableIndex: parseBoolean(getClientEnv("DisableIndex")),
-      ShowTagCount: parseBoolean(getClientEnv("ShowTagCount")),
-      ShowIpInfo: parseBoolean(getClientEnv("ShowIpInfo")),
-    },
-  }
-}

messages/en.json

@@ -112,7 +112,7 @@
     "p_1079-1199_Simpleandbeautifuldashbo": "Simple and beautiful dashboard"
   },
   "Overview": {
-    "p_2277-2331_Overview": "Overview",
+    "p_2277-2331_Overview": "👋 Overview",
     "p_2390-2457_wherethetimeis": "where the time is"
   },
   "Global": {

messages/ja.json

@@ -112,7 +112,7 @@
     "p_1079-1199_Simpleandbeautifuldashbo": "シンプルで美しいダッシュボード"
   },
   "Overview": {
-    "p_2277-2331_Overview": "概要",
+    "p_2277-2331_Overview": "👋 概要",
     "p_2390-2457_wherethetimeis": "現在の時間"
   },
   "Global": {

messages/zh-t.json

@@ -112,7 +112,7 @@
     "p_1079-1199_Simpleandbeautifuldashbo": "簡單美觀的儀錶板"
   },
   "Overview": {
-    "p_2277-2331_Overview": "概覽",
+    "p_2277-2331_Overview": "👋 概覽",
     "p_2390-2457_wherethetimeis": "當前時間"
   },
   "Global": {

messages/zh.json

@@ -112,7 +112,7 @@
     "p_1079-1199_Simpleandbeautifuldashbo": "简单美观的仪表板"
   },
   "Overview": {
-    "p_2277-2331_Overview": "概览",
+    "p_2277-2331_Overview": "👋 概览",
     "p_2390-2457_wherethetimeis": "当前时间"
   },
   "Global": {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "nezha-dash",
-  "version": "2.6.0",
+  "version": "2.5.1",
   "private": true,
   "scripts": {
     "dev": "next dev -p 3040",
@@ -15,7 +15,6 @@
   "dependencies": {
     "@ducanh2912/next-pwa": "^10.2.9",
     "@heroicons/react": "^2.2.0",
-    "@number-flow/react": "^0.5.5",
     "@radix-ui/react-dialog": "^1.1.5",
     "@radix-ui/react-dropdown-menu": "^2.1.5",
     "@radix-ui/react-label": "^2.1.1",
@@ -26,19 +25,19 @@
     "@radix-ui/react-slot": "^1.1.1",
     "@radix-ui/react-switch": "^1.1.2",
     "@radix-ui/react-tooltip": "^1.1.7",
-    "@trivago/prettier-plugin-sort-imports": "^5.2.2",
+    "@trivago/prettier-plugin-sort-imports": "^5.2.1",
     "@types/d3-geo": "^3.1.0",
     "@types/luxon": "^3.4.2",
-    "caniuse-lite": "^1.0.30001696",
+    "caniuse-lite": "^1.0.30001695",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
-    "cmdk": "^1.0.4",
+    "cmdk": "1.0.0",
     "country-flag-icons": "^1.5.14",
     "d3-geo": "^3.1.1",
     "d3-selection": "^3.0.0",
     "flag-icons": "^7.3.2",
     "i18n-iso-countries": "^7.13.0",
-    "lucide-react": "^0.474.0",
+    "lucide-react": "^0.454.0",
     "luxon": "^3.5.0",
     "maxmind": "^4.3.24",
     "next": "^15.1.6",
@@ -67,7 +66,7 @@
     "postcss": "^8.5.1",
     "tailwindcss": "^4.0.0",
     "typescript": "^5.7.3",
-    "vercel": "^39.4.2"
+    "vercel": "^39.3.0"
   },
   "overrides": {
     "react-is": "^19.0.0-rc-69d4b800-20241021"