chore(ui): remove unmounted UsageIndicator and the Hide Usage Indicator flag

ui/litellm-dashboard/eslint-suppressions.json

@@ -1655,17 +1655,6 @@
       "count": 1
     }
   },
-  "src/components/UsageIndicator.tsx": {
-    "no-nested-ternary": {
-      "count": 4
-    },
-    "no-restricted-imports": {
-      "count": 1
-    },
-    "react-hooks/static-components": {
-      "count": 1
-    }
-  },
   "src/components/activity_metrics.tsx": {
     "no-nested-ternary": {
       "count": 1

ui/litellm-dashboard/src/components/Navbar/UserDropdown/UserDropdown.tsx

@@ -2,7 +2,6 @@ import useAuthorized from "@/app/(dashboard)/hooks/useAuthorized";
 import { useDisableBlogPosts } from "@/app/(dashboard)/hooks/useDisableBlogPosts";
 import { useDisableBouncingIcon } from "@/app/(dashboard)/hooks/useDisableBouncingIcon";
 import { useDisableShowPrompts } from "@/app/(dashboard)/hooks/useDisableShowPrompts";
-import { useDisableUsageIndicator } from "@/app/(dashboard)/hooks/useDisableUsageIndicator";
 import {
   emitLocalStorageChange,
   getLocalStorageItem,
@@ -72,7 +71,6 @@ interface UserDropdownProps {
 const UserDropdown: React.FC<UserDropdownProps> = ({ onLogout, variant = "navbar", collapsed = false }) => {
   const { userId, userEmail, userRole, premiumUser } = useAuthorized();
   const disableShowPrompts = useDisableShowPrompts();
-  const disableUsageIndicator = useDisableUsageIndicator();
   const disableBlogPosts = useDisableBlogPosts();
   const disableBouncingIcon = useDisableBouncingIcon();
   const [disableShowNewBadge, setDisableShowNewBadge] = useState(false);
@@ -165,23 +163,6 @@ const UserDropdown: React.FC<UserDropdownProps> = ({ onLogout, variant = "navbar
           aria-label="Toggle hide all prompts"
         />
       </Space>
-      <Space style={{ width: "100%", justifyContent: "space-between" }}>
-        <Text type="secondary">Hide Usage Indicator</Text>
-        <Switch
-          size="small"
-          checked={disableUsageIndicator}
-          onChange={(checked) => {
-            if (checked) {
-              setLocalStorageItem("disableUsageIndicator", "true");
-              emitLocalStorageChange("disableUsageIndicator");
-            } else {
-              removeLocalStorageItem("disableUsageIndicator");
-              emitLocalStorageChange("disableUsageIndicator");
-            }
-          }}
-          aria-label="Toggle hide usage indicator"
-        />
-      </Space>
       <Space style={{ width: "100%", justifyContent: "space-between" }}>
         <Text type="secondary">Hide Blog Posts</Text>
         <Switch

ui/litellm-dashboard/src/components/SidebarAccountMenu/SidebarAccountMenu.test.tsx

@@ -37,10 +37,6 @@ vi.mock("@/app/(dashboard)/hooks/useDisableShowPrompts", () => ({
   useDisableShowPrompts: () => mockUseDisableShowPromptsImpl(),
 }));
 
-vi.mock("@/app/(dashboard)/hooks/useDisableUsageIndicator", () => ({
-  useDisableUsageIndicator: () => false,
-}));
-
 vi.mock("@/app/(dashboard)/hooks/useDisableBlogPosts", () => ({
   useDisableBlogPosts: () => false,
 }));

ui/litellm-dashboard/src/components/SidebarAccountMenu/SidebarAccountMenu.tsx

@@ -4,7 +4,6 @@ import { useDisableBlogPosts } from "@/app/(dashboard)/hooks/useDisableBlogPosts
 import { useDisableBouncingIcon } from "@/app/(dashboard)/hooks/useDisableBouncingIcon";
 import { useDisableShowNewBadge } from "@/app/(dashboard)/hooks/useDisableShowNewBadge";
 import { useDisableShowPrompts } from "@/app/(dashboard)/hooks/useDisableShowPrompts";
-import { useDisableUsageIndicator } from "@/app/(dashboard)/hooks/useDisableUsageIndicator";
 import { emitLocalStorageChange, removeLocalStorageItem, setLocalStorageItem } from "@/utils/localStorageUtils";
 import { navAccountDisplayName } from "@/components/Navbar/navDisplayName";
 import CopyButton from "@/components/shared/CopyButton";
@@ -86,7 +85,6 @@ const SidebarAccountMenu: React.FC<SidebarAccountMenuProps> = ({ onLogout, colla
   const { data: healthData } = useHealthReadinessDetails(accessToken);
   const version = healthData?.litellm_version;
   const disableShowPrompts = useDisableShowPrompts();
-  const disableUsageIndicator = useDisableUsageIndicator();
   const disableBlogPosts = useDisableBlogPosts();
   const disableBouncingIcon = useDisableBouncingIcon();
   const disableShowNewBadge = useDisableShowNewBadge();
@@ -115,13 +113,6 @@ const SidebarAccountMenu: React.FC<SidebarAccountMenuProps> = ({ onLogout, colla
       checked: disableShowPrompts,
       onCheckedChange: (checked: boolean) => setFlag("disableShowPrompts", checked),
     },
-    {
-      key: "disableUsageIndicator",
-      label: "Hide Usage Indicator",
-      ariaLabel: "Toggle hide usage indicator",
-      checked: disableUsageIndicator,
-      onCheckedChange: (checked: boolean) => setFlag("disableUsageIndicator", checked),
-    },
     {
       key: "disableBlogPosts",
       label: "Hide Blog Posts",

ui/litellm-dashboard/src/components/SidebarUsageCard.test.tsx

@@ -8,10 +8,6 @@ import type { LicenseInfo } from "./networking";
 
 vi.mock("./networking", () => ({ getRemainingUsers: vi.fn() }));
 
-vi.mock("@/app/(dashboard)/hooks/useDisableUsageIndicator", () => ({
-  useDisableUsageIndicator: vi.fn(() => false),
-}));
-
 vi.mock("@/app/(dashboard)/hooks/license/useLicenseInfo", () => ({
   useLicenseInfo: vi.fn(),
 }));

ui/litellm-dashboard/src/components/SidebarUsageCard.tsx

@@ -1,4 +1,3 @@
-import { useDisableUsageIndicator } from "@/app/(dashboard)/hooks/useDisableUsageIndicator";
 import { useLicenseInfo } from "@/app/(dashboard)/hooks/license/useLicenseInfo";
 import { formatExpirationStatus } from "@/utils/licenseUtils";
 import { Button } from "@/components/ui/button";
@@ -69,15 +68,14 @@ const buildMeters = (data: RemainingUsage | null): MeterData[] => {
  * design's Spend / API-request meters are intentionally omitted.
  */
 export default function SidebarUsageCard({ accessToken, collapsed, onExpandRail }: SidebarUsageCardProps) {
-  const disableUsageIndicator = useDisableUsageIndicator();
   const licenseInfo = useLicenseInfo(accessToken).data ?? null;
   const { data: usageData, isLoading } = useQuery(remainingUsersQuery(accessToken));
   const data = usageData ?? null;
 
   const hasData = data !== null && (data.total_users !== null || data.total_teams !== null);
   const noUsableData = !isLoading && !hasData;
   const noLicensedUsage = !licenseInfo?.has_license || noUsableData;
-  if (disableUsageIndicator || !accessToken || noLicensedUsage) {
+  if (!accessToken || noLicensedUsage) {
     return null;
   }