Unverified Commit 439f19e2 authored by Lemon-miaow's avatar Lemon-miaow
Browse files

fix(panel): prevent page collapse and scroll shifts in players and bans... 

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

panel/src/components/players/BansSection.tsx

+3 −2
Changes for panel/src/components/players/BansSection.tsx: 3 added lines, 2 removed lines.
Original line number Diff line number Diff line
@@ -4,6 +4,7 @@ import { Ban, Loader2, RotateCw, Undo2 } from "lucide-react"; 
import { Button } from "@/components/ui/button";

import { api, humanizeError } from "@/lib/api";

import { useAsync } from "@/lib/hooks";

import { cn } from "@/lib/utils";

import {

  CollapsibleSection,

  FeedbackLine,
@@ -180,7 +181,7 @@ export function BansSection({ name }: { name: string }) { 
          )}

        </div>



        {loading ? (

        {loading && !data ? (

          <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")}

          </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>

          </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} />}



            <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
Changes for panel/src/components/players/WhitelistSection.tsx: 3 added lines, 2 removed lines.
Original line number Diff line number Diff line
@@ -4,6 +4,7 @@ import { ListChecks, Loader2, Plus, RotateCw, X } from "lucide-react"; 
import { Button } from "@/components/ui/button";

import { api, humanizeError } from "@/lib/api";

import { useAsync } from "@/lib/hooks";

import { cn } from "@/lib/utils";

import {

  CollapsibleSection,

  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>}

        </div>



        {loading ? (

        {loading && !data ? (

          <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")}

          </div>
@@ -145,7 +146,7 @@ export function WhitelistSection({ name, defaultOpen = false }: { name: string; 
            </p>

          </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} />}



            <div className="grid grid-cols-1 gap-2.5 sm:grid-cols-2 md:grid-cols-3 xl:grid-cols-4">