perf: use biome

src/components/loading/Loader.tsx

@@ -1,32 +1,32 @@
-const bars = Array(8).fill(0)
+const bars = Array(8).fill(0);
 
 export const Loader = ({ visible }: { visible: boolean }) => {
-  return (
-    <div className="hamster-loading-wrapper" data-visible={visible}>
-      <div className="hamster-spinner">
-        {bars.map((_, i) => (
-          <div className="hamster-loading-bar" key={`hamster-bar-${i}`} />
-        ))}
-      </div>
-    </div>
-  )
-}
+	return (
+		<div className="hamster-loading-wrapper" data-visible={visible}>
+			<div className="hamster-spinner">
+				{bars.map((_, i) => (
+					<div className="hamster-loading-bar" key={`hamster-bar-${i}`} />
+				))}
+			</div>
+		</div>
+	);
+};
 
 export const LoadingSpinner = () => {
-  return (
-    <svg
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      stroke="currentColor"
-      strokeWidth="2"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-      className={"size-4 animate-spin"}
-    >
-      <path d="M21 12a9 9 0 1 1-6.219-8.56" />
-    </svg>
-  )
-}
+	return (
+		<svg
+			xmlns="http://www.w3.org/2000/svg"
+			width="24"
+			height="24"
+			viewBox="0 0 24 24"
+			fill="none"
+			stroke="currentColor"
+			strokeWidth="2"
+			strokeLinecap="round"
+			strokeLinejoin="round"
+			className={"size-4 animate-spin"}
+		>
+			<path d="M21 12a9 9 0 1 1-6.219-8.56" />
+		</svg>
+	);
+};

src/components/loading/ServerDetailLoading.tsx

@@ -1,38 +1,38 @@
-import { Skeleton } from "@/components/ui/skeleton"
-import { useNavigate } from "react-router-dom"
+import { useNavigate } from "react-router-dom";
+import { Skeleton } from "@/components/ui/skeleton";
 
-import { BackIcon } from "../Icon"
+import { BackIcon } from "../Icon";
 
 export function ServerDetailChartLoading() {
-  return (
-    <div>
-      <section className="grid md:grid-cols-2 lg:grid-cols-3 grid-cols-1 gap-3">
-        <Skeleton className="h-[182px] w-full rounded-[5px] bg-muted-foreground/10 animate-none"></Skeleton>
-        <Skeleton className="h-[182px] w-full rounded-[5px] bg-muted-foreground/10 animate-none"></Skeleton>
-        <Skeleton className="h-[182px] w-full rounded-[5px] bg-muted-foreground/10 animate-none"></Skeleton>
-        <Skeleton className="h-[182px] w-full rounded-[5px] bg-muted-foreground/10 animate-none"></Skeleton>
-        <Skeleton className="h-[182px] w-full rounded-[5px] bg-muted-foreground/10 animate-none"></Skeleton>
-        <Skeleton className="h-[182px] w-full rounded-[5px] bg-muted-foreground/10 animate-none"></Skeleton>
-      </section>
-    </div>
-  )
+	return (
+		<div>
+			<section className="grid md:grid-cols-2 lg:grid-cols-3 grid-cols-1 gap-3">
+				<Skeleton className="h-[182px] w-full rounded-[5px] bg-muted-foreground/10 animate-none"></Skeleton>
+				<Skeleton className="h-[182px] w-full rounded-[5px] bg-muted-foreground/10 animate-none"></Skeleton>
+				<Skeleton className="h-[182px] w-full rounded-[5px] bg-muted-foreground/10 animate-none"></Skeleton>
+				<Skeleton className="h-[182px] w-full rounded-[5px] bg-muted-foreground/10 animate-none"></Skeleton>
+				<Skeleton className="h-[182px] w-full rounded-[5px] bg-muted-foreground/10 animate-none"></Skeleton>
+				<Skeleton className="h-[182px] w-full rounded-[5px] bg-muted-foreground/10 animate-none"></Skeleton>
+			</section>
+		</div>
+	);
 }
 
 export function ServerDetailLoading() {
-  const navigate = useNavigate()
+	const navigate = useNavigate();
 
-  return (
-    <div className="mx-auto w-full max-w-5xl px-0">
-      <div
-        onClick={() => {
-          navigate("/")
-        }}
-        className="flex flex-none cursor-pointer font-semibold leading-none items-center break-all tracking-tight gap-0.5 text-xl"
-      >
-        <BackIcon />
-        <Skeleton className="h-[20px] w-24 rounded-[5px] bg-muted-foreground/10 animate-none"></Skeleton>
-      </div>
-      <Skeleton className="flex flex-wrap gap-2 h-[81px] w-1/2 mt-3 rounded-[5px] bg-muted-foreground/10 animate-none"></Skeleton>
-    </div>
-  )
+	return (
+		<div className="mx-auto w-full max-w-5xl px-0">
+			<div
+				onClick={() => {
+					navigate("/");
+				}}
+				className="flex flex-none cursor-pointer font-semibold leading-none items-center break-all tracking-tight gap-0.5 text-xl"
+			>
+				<BackIcon />
+				<Skeleton className="h-[20px] w-24 rounded-[5px] bg-muted-foreground/10 animate-none"></Skeleton>
+			</div>
+			<Skeleton className="flex flex-wrap gap-2 h-[81px] w-1/2 mt-3 rounded-[5px] bg-muted-foreground/10 animate-none"></Skeleton>
+		</div>
+	);
 }