This commit is contained in:
Kenneth Ezekiel 2026-09-27 14:05:56 +08:00 • committed by GitHub
commit 562444d4a0
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 16 additions and 4 deletions

View file

@ -67,11 +67,14 @@ describe("SidebarUsageCard", () => {
});
it("renders an expanded seat meter reporting value and range when data loads", async () => {
const user = userEvent.setup();
const { container } = renderWithClient(
<SidebarUsageCard accessToken="token" collapsed={false} onExpandRail={() => {}} />,
);
await screen.findByText("Enterprise usage");
// Card starts collapsed by default — open it first
await user.click(await screen.findByRole("button", { name: /Enterprise usage/i }));
const meter = await screen.findByRole("meter");
expect(meter).toHaveAttribute("aria-valuenow", "20");
expect(meter).toHaveAttribute("aria-valuemax", "100");
@ -85,6 +88,8 @@ describe("SidebarUsageCard", () => {
const user = userEvent.setup();
renderWithClient(<SidebarUsageCard accessToken="token" collapsed={false} onExpandRail={() => {}} />);
// Card starts collapsed — open it, then collapse it
await user.click(await screen.findByRole("button", { name: /Enterprise usage/i }));
await screen.findByRole("meter");
await user.click(screen.getByRole("button", { name: /Enterprise usage/i }));
@ -93,11 +98,15 @@ describe("SidebarUsageCard", () => {
it("flags over-limit usage with a destructive, capped indicator", async () => {
mockGetRemainingUsers.mockResolvedValue(OVER_LIMIT_DATA);
const user = userEvent.setup();
const { container } = renderWithClient(
<SidebarUsageCard accessToken="token" collapsed={false} onExpandRail={() => {}} />,
);
// Card starts collapsed — open it first
await user.click(await screen.findByRole("button", { name: /Enterprise usage/i }));
await screen.findByRole("meter");
const indicator = container.querySelector('[data-slot="meter-indicator"]');
expect(indicator).toHaveClass("bg-destructive");

View file

@ -96,7 +96,7 @@ export default function SidebarUsageCard({ accessToken, collapsed, onExpandRail
const meters = buildMeters(data);
return (
<Collapsible defaultOpen className="overflow-hidden rounded-xl border border-sidebar-border bg-sidebar">
<Collapsible defaultOpen={false} className="overflow-hidden rounded-xl border border-sidebar-border bg-sidebar">
<CollapsibleTrigger className="group/usage flex w-full items-center gap-2.5 px-3 py-2.5 text-left transition-colors hover:bg-sidebar-accent">
<span className="flex size-[26px] flex-none items-center justify-center rounded-md bg-sidebar-primary/10 text-sidebar-primary">
<Award className="size-4" strokeWidth={1.75} />

View file

@ -637,7 +637,7 @@ const Sidebar_: React.FC<SidebarProps> = ({
</div>
</SidebarHeader>
<ScrollArea className="min-h-0 flex-1">
<ScrollArea className="min-h-0 flex-1 overflow-hidden">
<nav className="flex flex-col gap-0.5 px-3 pb-3">
{visibleGroups.map((group, gi) => (
<SidebarGroup key={group.groupLabel}>

View file

@ -64,7 +64,10 @@ const SidebarFooter = React.forwardRef<HTMLDivElement, React.ComponentPropsWitho
<div
ref={ref}
data-slot="sidebar-footer"
className={cn("flex flex-none flex-col gap-2.5 border-t border-sidebar-border p-3", className)}
className={cn(
"relative z-raised flex flex-none flex-col gap-2.5 border-t border-sidebar-border bg-sidebar p-3",
className,
)}
{...props}
/>
),