refactor: remove @numeric-text/react dependency and implement NumericText component

src/test/components/basic-components.test.tsx

@@ -1,6 +1,6 @@
 import { fireEvent, render, screen } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
-import { describe, expect, it, vi } from "vitest";
+import { describe, expect, it } from "vitest";
 import AnimateCountClient, { AnimateCount } from "@/components/AnimatedCount";
 import ErrorBoundary from "@/components/ErrorBoundary";
 import ChartSkeleton from "@/components/loading/ChartSkeleton";
@@ -14,16 +14,6 @@ import { Input } from "@/components/ui/input";
 import { Separator } from "@/components/ui/separator";
 import { Skeleton } from "@/components/ui/skeleton";
 
-vi.mock("@numeric-text/react", () => ({
-	default: ({
-		className,
-		value,
-	}: {
-		className?: string;
-		value: string | number;
-	}) => <span className={className}>{value}</span>,
-}));
-
 import { CommandProvider } from "@/context/command-provider";
 import { StatusProvider } from "@/context/status-provider";
 import { useCommand } from "@/hooks/use-command";

src/test/components/header.test.tsx

@@ -21,12 +21,6 @@ const headerMocks = vi.hoisted(() => ({
 	updateBackground: vi.fn(),
 }));
 
-vi.mock("@numeric-text/react", () => ({
-	default: ({ value }: { value: string | number }) => (
-		<span data-testid="numeric-text">{value}</span>
-	),
-}));
-
 vi.mock("@/hooks/use-background", () => ({
 	useBackground: () => ({
 		backgroundImage: headerMocks.backgroundImage,
@@ -150,7 +144,7 @@ describe("Header", () => {
 		);
 		expect(screen.getAllByRole("link", { name: "Docs" })).toHaveLength(2);
 		expect(await screen.findAllByText("dashboard")).toHaveLength(2);
-		expect(screen.getByTestId("numeric-text")).toHaveTextContent("4");
+		expect(screen.getByText("online").closest("button")).toHaveTextContent("4");
 		expect(screen.getByText("online")).toBeInTheDocument();
 
 		await waitFor(() => {

src/test/components/server-detail-components.test.tsx

@@ -14,10 +14,6 @@ const websocketMocks = vi.hoisted(() => ({
 	} | null,
 }));
 
-vi.mock("@numeric-text/react", () => ({
-	default: ({ value }: { value: string | number }) => <span>{value}</span>,
-}));
-
 vi.mock("@/hooks/use-websocket-context", () => ({
 	useWebSocketContext: () => websocketMocks,
 }));