spb/polyllm

1"use client";2import dynamic from "next/dynamic";3import { Skeleton } from "@/components/ui/misc";45/** Recharts is ~100 KB gz — every plot is loaded on demand so the usage route paints its KPIs first. */6const loading = () => <Skeleton className="h-[200px] w-full" />;7const loadingShort = () => <Skeleton className="h-[168px] w-full" />;89export const CostOverTime = dynamic(() => import("./charts").then((m) => m.CostOverTime), { ssr: false, loading });10export const RequestsOverTime = dynamic(() => import("./charts").then((m) => m.RequestsOverTime), { ssr: false, loading });11export const TokensOverTime = dynamic(() => import("./charts").then((m) => m.TokensOverTime), { ssr: false, loading });12export const ProviderDonut = dynamic(() => import("./charts").then((m) => m.ProviderDonut), { ssr: false, loading: loadingShort });13export const ModelBars = dynamic(() => import("./charts").then((m) => m.ModelBars), { ssr: false, loading: loadingShort });14export const LatencyByModel = dynamic(() => import("./charts").then((m) => m.LatencyByModel), { ssr: false, loading: loadingShort });15