Merge branch 'main' into cloudflare

2025-04-24 21:10:45 +08:00 · 2024-11-14 16:55:29 +08:00 · 2024-11-14 16:55:29 +08:00 · b43ce6a4bf
commit b43ce6a4bf
parent af7f259f61 926d45b4be
7 changed files with 68 additions and 27 deletions
--- a/app/(main)/ClientComponents/ServerListClient.tsx
+++ b/app/(main)/ClientComponents/ServerListClient.tsx
@ -82,12 +82,20 @@ export default function ServerListClient() {
      ? sortedServers
      : sortedServers.filter((server) => server.tag === tag);

+  const tagCountMap: Record<string, number> = {};
+  sortedServers.forEach((server) => {
+    if (server.tag) {
+      tagCountMap[server.tag] = (tagCountMap[server.tag] || 0) + 1;
+    }
+  });
+
  return (
    <>
      {getEnv("NEXT_PUBLIC_ShowTag") === "true" && uniqueTags.length > 1 && (
        <Switch
          allTag={uniqueTags}
          nowTag={tag}
+          tagCountMap={tagCountMap}
          onTagChange={handleTagChange}
        />
      )}
--- a/bun.lockb
+++ b/bun.lockb
--- a/components/LanguageSwitcher.tsx
+++ b/components/LanguageSwitcher.tsx
@ -9,16 +9,17 @@ import {
 } from "@/components/ui/dropdown-menu";
 import { localeItems } from "@/i18n-metadata";
 import { setUserLocale } from "@/i18n/locale";
+import { CheckCircleIcon } from "@heroicons/react/20/solid";
 import { useLocale } from "next-intl";
 import * as React from "react";

 export function LanguageSwitcher() {
  const locale = useLocale();

-  function onChange(value: string) {
-    const locale = value;
-    setUserLocale(locale);
-  }
+  const handleSelect = (e: Event, newLocale: string) => {
+    e.preventDefault(); // 阻止默认的关闭行为
+    setUserLocale(newLocale);
+  };

  return (
    <DropdownMenu>
@ -32,10 +33,15 @@ export function LanguageSwitcher() {
          <span className="sr-only">Change language</span>
        </Button>
      </DropdownMenuTrigger>
-      <DropdownMenuContent align="end">
+      <DropdownMenuContent className="flex flex-col gap-0.5" align="end">
        {localeItems.map((item) => (
-          <DropdownMenuItem key={item.code} onClick={() => onChange(item.code)}>
-            {item.name}
+          <DropdownMenuItem
+            key={item.code}
+            onSelect={(e) => handleSelect(e, item.code)}
+            className={locale === item.code ? "bg-muted gap-3" : ""}
+          >
+            {item.name}{" "}
+            {locale === item.code && <CheckCircleIcon className="size-4" />}
          </DropdownMenuItem>
        ))}
      </DropdownMenuContent>
--- a/components/Switch.tsx
+++ b/components/Switch.tsx
@ -8,10 +8,12 @@ import React, { createRef, useEffect, useRef } from "react";
 export default function Switch({
  allTag,
  nowTag,
+  tagCountMap,
  onTagChange,
 }: {
  allTag: string[];
  nowTag: string;
+  tagCountMap: Record<string, number>;
  onTagChange: (tag: string) => void;
 }) {
  const scrollRef = useRef<HTMLDivElement>(null);
@ -84,9 +86,14 @@ export default function Switch({
              />
            )}
            <div className="relative z-20 flex items-center gap-1">
-              <p className="whitespace-nowrap">
-                {tag === "defaultTag" ? t("defaultTag") : tag}
-              </p>
+              <div className="whitespace-nowrap flex items-center gap-2">
+                {tag === "defaultTag" ? t("defaultTag") : tag}{" "}
+                {tag !== "defaultTag" && (
+                  <div className="w-fit px-1.5 rounded-full bg-muted">
+                    {tagCountMap[tag]}
+                  </div>
+                )}
+              </div>
            </div>
          </div>
        ))}
--- a/components/ThemeSwitcher.tsx
+++ b/components/ThemeSwitcher.tsx
@ -7,14 +7,21 @@ import {
  DropdownMenuItem,
  DropdownMenuTrigger,
 } from "@/components/ui/dropdown-menu";
+import { cn } from "@/lib/utils";
+import { CheckCircleIcon } from "@heroicons/react/20/solid";
 import { Moon, Sun } from "lucide-react";
 import { useTranslations } from "next-intl";
 import { useTheme } from "next-themes";
-import * as React from "react";

 export function ModeToggle() {
-  const { setTheme } = useTheme();
+  const { setTheme, theme } = useTheme();
  const t = useTranslations("ThemeSwitcher");
+
+  const handleSelect = (e: Event, newTheme: string) => {
+    e.preventDefault();
+    setTheme(newTheme);
+  };
+
  return (
    <DropdownMenu>
      <DropdownMenuTrigger asChild>
@ -28,15 +35,27 @@ export function ModeToggle() {
          <span className="sr-only">Toggle theme</span>
        </Button>
      </DropdownMenuTrigger>
-      <DropdownMenuContent align="end">
-        <DropdownMenuItem onClick={() => setTheme("light")}>
-          {t("Light")}
+      <DropdownMenuContent className="flex flex-col gap-0.5" align="end">
+        <DropdownMenuItem
+          className={cn({ "gap-3 bg-muted": theme === "light" })}
+          onSelect={(e) => handleSelect(e, "light")}
+        >
+          {t("Light")}{" "}
+          {theme === "light" && <CheckCircleIcon className="size-4" />}
        </DropdownMenuItem>
-        <DropdownMenuItem onClick={() => setTheme("dark")}>
-          {t("Dark")}
+        <DropdownMenuItem
+          className={cn({ "gap-3 bg-muted": theme === "dark" })}
+          onSelect={(e) => handleSelect(e, "dark")}
+        >
+          {t("Dark")}{" "}
+          {theme === "dark" && <CheckCircleIcon className="size-4" />}
        </DropdownMenuItem>
-        <DropdownMenuItem onClick={() => setTheme("system")}>
-          {t("System")}
+        <DropdownMenuItem
+          className={cn({ "gap-3 bg-muted": theme === "system" })}
+          onSelect={(e) => handleSelect(e, "system")}
+        >
+          {t("System")}{" "}
+          {theme === "system" && <CheckCircleIcon className="size-4" />}
        </DropdownMenuItem>
      </DropdownMenuContent>
    </DropdownMenu>
--- a/components/ui/dropdown-menu.tsx
+++ b/components/ui/dropdown-menu.tsx
@ -64,7 +64,7 @@ const DropdownMenuContent = React.forwardRef<
      ref={ref}
      sideOffset={sideOffset}
      className={cn(
-        "z-50 overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg shadow-neutral-200/50 dark:shadow-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+        "z-50 overflow-hidden rounded-md border bg-popover p-1.5 text-popover-foreground shadow-2xl dark:shadow-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
        className,
      )}
      {...props}
@ -82,7 +82,7 @@ const DropdownMenuItem = React.forwardRef<
  <DropdownMenuPrimitive.Item
    ref={ref}
    className={cn(
-      "relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-xs font-medium outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      "relative flex cursor-default select-none items-center rounded-[10px] px-2 py-1.5 text-xs font-medium outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
      inset && "pl-8",
      className,
    )}
--- a/package.json
+++ b/package.json
@ -1,6 +1,6 @@
 {
  "name": "nezha-dash",
-  "version": "1.2.8",
+  "version": "1.2.9",
  "private": true,
  "scripts": {
    "dev": "next dev -p 3020",
@ -12,6 +12,7 @@
  },
  "dependencies": {
    "@ducanh2912/next-pwa": "^10.2.9",
+    "@heroicons/react": "^2.1.5",
    "@radix-ui/react-dialog": "^1.1.2",
    "@radix-ui/react-dropdown-menu": "^2.1.2",
    "@radix-ui/react-navigation-menu": "^1.2.1",
@ -19,10 +20,10 @@
    "@radix-ui/react-progress": "^1.1.0",
    "@radix-ui/react-separator": "^1.1.0",
    "@radix-ui/react-slot": "^1.1.0",
-    "@radix-ui/react-tooltip": "^1.1.3",
+    "@radix-ui/react-tooltip": "^1.1.4",
    "@trivago/prettier-plugin-sort-imports": "^4.3.0",
    "@types/luxon": "^3.4.2",
-    "@typescript-eslint/eslint-plugin": "^8.13.0",
+    "@typescript-eslint/eslint-plugin": "^8.14.0",
    "caniuse-lite": "^1.0.30001680",
    "class-variance-authority": "^0.7.0",
    "clsx": "^2.1.1",
@ -34,7 +35,7 @@
    "luxon": "^3.5.0",
    "next": "^15.0.3",
    "next-auth": "^5.0.0-beta.25",
-    "next-intl": "^3.25.0",
+    "next-intl": "^3.25.1",
    "next-runtime-env": "^3.2.2",
    "next-themes": "^0.4.3",
    "react": "19.0.0-rc-02c0e824-20241028",
@ -47,7 +48,7 @@
    "swr": "^2.2.6-beta.4",
    "tailwind-merge": "^2.5.4",
    "tailwindcss-animate": "^1.0.7",
-    "typescript-eslint": "^8.13.0"
+    "typescript-eslint": "^8.14.0"
  },
  "devDependencies": {
    "eslint-plugin-turbo": "^2.2.3",
@ -59,7 +60,7 @@
    "autoprefixer": "^10.4.20",
    "eslint": "^9.14.0",
    "eslint-config-next": "^15.0.3",
-    "postcss": "^8.4.48",
+    "postcss": "^8.4.49",
    "prettier": "^3.3.3",
    "prettier-plugin-tailwindcss": "^0.6.8",
    "tailwindcss": "^3.4.14",