FelisMC/Felis
2
0 Fork 0
Code Issues Pull Requests 6 Actions Packages Projects Releases Wiki Activity

fix(panel): prevent page collapse and scroll shifts in players and bans management sections during reload

Browse Source
This commit is contained in:
Lemon-miaow committed 2026-07-04 00:32:38 +08:00
1 parent e60784b5b2
commit 439f19e209
2 files changed
+6 -4
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

panel/src/components/players/BansSection.tsx
+3 -2
View File
@@ -4,6 +4,7 @@ import { Ban, Loader2, RotateCw, Undo2 } from "lucide-react";
import { Button } from "@/components/ui/button"; import { Button } from "@/components/ui/button";
import { api, humanizeError } from "@/lib/api"; import { api, humanizeError } from "@/lib/api";
import { useAsync } from "@/lib/hooks"; import { useAsync } from "@/lib/hooks";
import { cn } from "@/lib/utils";
import { import {
CollapsibleSection, CollapsibleSection,
FeedbackLine, FeedbackLine,
@@ -180,7 +181,7 @@ export function BansSection({ name }: { name: string }) {
)} )}
</div> </div>
{loading ? ( {loading && !data ? (
<div className="flex items-center gap-2 py-2 text-xs text-muted-foreground"> <div className="flex items-center gap-2 py-2 text-xs text-muted-foreground">
<Loader2 className="h-3.5 w-3.5 animate-spin" /> {t("log_connecting")} <Loader2 className="h-3.5 w-3.5 animate-spin" /> {t("log_connecting")}
</div> </div>
@@ -192,7 +193,7 @@ export function BansSection({ name }: { name: string }) {
<p className="mt-1 text-xs text-muted-foreground/80">{t("access_ban_empty_hint")}</p> <p className="mt-1 text-xs text-muted-foreground/80">{t("access_ban_empty_hint")}</p>
</div> </div>
) : ( ) : (
<div className="space-y-2"> <div className={cn("space-y-2 transition-opacity", loading && "opacity-60 pointer-events-none")}>
{showSearch && <SearchBox value={query} onChange={onQuery} />} {showSearch && <SearchBox value={query} onChange={onQuery} />}
<div className="grid grid-cols-1 gap-2.5 sm:grid-cols-2 md:grid-cols-3 xl:grid-cols-4"> <div className="grid grid-cols-1 gap-2.5 sm:grid-cols-2 md:grid-cols-3 xl:grid-cols-4">
panel/src/components/players/WhitelistSection.tsx
+3 -2
View File
@@ -4,6 +4,7 @@ import { ListChecks, Loader2, Plus, RotateCw, X } from "lucide-react";
import { Button } from "@/components/ui/button"; import { Button } from "@/components/ui/button";
import { api, humanizeError } from "@/lib/api"; import { api, humanizeError } from "@/lib/api";
import { useAsync } from "@/lib/hooks"; import { useAsync } from "@/lib/hooks";
import { cn } from "@/lib/utils";
import { import {
CollapsibleSection, CollapsibleSection,
FeedbackLine, FeedbackLine,
@@ -131,7 +132,7 @@ export function WhitelistSection({ name, defaultOpen = false }: { name: string;
{invalid && <p className="text-xs text-destructive">{t("access_player_invalid")}</p>} {invalid && <p className="text-xs text-destructive">{t("access_player_invalid")}</p>}
</div> </div>
{loading ? ( {loading && !data ? (
<div className="flex items-center gap-2 py-2 text-xs text-muted-foreground"> <div className="flex items-center gap-2 py-2 text-xs text-muted-foreground">
<Loader2 className="h-3.5 w-3.5 animate-spin" /> {t("log_connecting")} <Loader2 className="h-3.5 w-3.5 animate-spin" /> {t("log_connecting")}
</div> </div>
@@ -145,7 +146,7 @@ export function WhitelistSection({ name, defaultOpen = false }: { name: string;
</p> </p>
</div> </div>
) : ( ) : (
<div className="space-y-2"> <div className={cn("space-y-2 transition-opacity", loading && "opacity-60 pointer-events-none")}>
{showSearch && <SearchBox value={query} onChange={onQuery} />} {showSearch && <SearchBox value={query} onChange={onQuery} />}
<div className="grid grid-cols-1 gap-2.5 sm:grid-cols-2 md:grid-cols-3 xl:grid-cols-4"> <div className="grid grid-cols-1 gap-2.5 sm:grid-cols-2 md:grid-cols-3 xl:grid-cols-4">