Move Usage into its own folder

ui/litellm-dashboard/src/app/(dashboard)/usage/page.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import NewUsagePage from "@/components/new_usage";
+import NewUsagePage from "@/components/Usage/components/new_usage";
 import useAuthorized from "@/app/(dashboard)/hooks/useAuthorized";
 import useTeams from "@/app/(dashboard)/hooks/useTeams";
 

ui/litellm-dashboard/src/app/page.tsx

@@ -18,7 +18,7 @@ import { MCPServers } from "@/components/mcp_tools";
 import ModelHubTable from "@/components/model_hub_table";
 import Navbar from "@/components/navbar";
 import { getUiConfig, Organization, proxyBaseUrl, setGlobalLitellmHeaderName } from "@/components/networking";
-import NewUsagePage from "@/components/new_usage";
+import NewUsagePage from "@/components/Usage/components/new_usage";
 import OldTeams from "@/components/OldTeams";
 import { fetchUserModels } from "@/components/organisms/create_key_button";
 import Organizations, { fetchOrganizations } from "@/components/organizations";

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

@@ -1,10 +1,10 @@
 import React from "react";
 import { Card, Grid, Text, Title } from "@tremor/react";
 import { AreaChart, BarChart } from "@tremor/react";
-import { DailyData, ModelActivityData, KeyMetricWithMetadata, TopApiKeyData } from "./usage/types";
+import { DailyData, ModelActivityData, KeyMetricWithMetadata, TopApiKeyData } from "./Usage/types";
 import { Collapse } from "antd";
 import { formatNumberWithCommas } from "@/utils/dataUtils";
-import { valueFormatter } from "../components/usage/utils/value_formatters";
+import { valueFormatter } from "./Usage/utils/value_formatters";
 import { CustomTooltip, CustomLegend } from "./common_components/chartUtils";
 
 interface ActivityMetricsProps {

ui/litellm-dashboard/src/components/common_components/chartUtils.tsx

@@ -1,6 +1,6 @@
 import React from "react";
 import type { CustomTooltipProps } from "@tremor/react";
-import { SpendMetrics } from "../usage/types";
+import { SpendMetrics } from "../Usage/types";
 
 interface ChartDataPoint {
   date: string;

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

@@ -49,7 +49,7 @@ import {
   adminGlobalActivityPerModel,
   getProxyUISettings,
 } from "./networking";
-import TopKeyView from "./top_key_view";
+import TopKeyView from "./Usage/components/EntityUsage/top_key_view";
 import { formatNumberWithCommas } from "@/utils/dataUtils";
 console.log("process.env.NODE_ENV", process.env.NODE_ENV);
 

ui/litellm-dashboard/src/components/usage/components/EntityUsage/entity_usage.test.tsx

@@ -1,7 +1,7 @@
 import { act, fireEvent, render, screen, waitFor } from "@testing-library/react";
 import { beforeAll, beforeEach, describe, expect, it, vi } from "vitest";
 import EntityUsage from "./entity_usage";
-import * as networking from "./networking";
+import * as networking from "../../../networking";
 
 beforeAll(() => {
   if (typeof window !== "undefined" && !window.ResizeObserver) {

ui/litellm-dashboard/src/components/usage/components/EntityUsage/entity_usage.tsx

@@ -21,21 +21,21 @@ import {
   TabPanels,
   Subtitle,
 } from "@tremor/react";
-import { ActivityMetrics, processActivityData } from "./activity_metrics";
-import { DailyData, BreakdownMetrics, KeyMetricWithMetadata, EntityMetricWithMetadata, TagUsage } from "./usage/types";
+import { ActivityMetrics, processActivityData } from "../../../activity_metrics";
+import { DailyData, BreakdownMetrics, KeyMetricWithMetadata, EntityMetricWithMetadata, TagUsage } from "../../types";
 import {
   organizationDailyActivityCall,
   tagDailyActivityCall,
   teamDailyActivityCall,
   customerDailyActivityCall,
   agentDailyActivityCall,
-} from "./networking";
+} from "../../../networking";
 import TopKeyView from "./top_key_view";
 import { formatNumberWithCommas } from "@/utils/dataUtils";
-import { valueFormatterSpend } from "./usage/utils/value_formatters";
-import { getProviderLogoAndName } from "./provider_info_helpers";
-import { UsageExportHeader } from "./EntityUsageExport";
-import type { EntityType } from "./EntityUsageExport/types";
+import { valueFormatterSpend } from "../../utils/value_formatters";
+import { getProviderLogoAndName } from "../../../provider_info_helpers";
+import { UsageExportHeader } from "../../../EntityUsageExport";
+import type { EntityType } from "../../../EntityUsageExport/types";
 import TopModelView from "./top_model_view";
 
 interface EntityMetrics {

ui/litellm-dashboard/src/components/usage/components/EntityUsage/top_key_view.tsx

@@ -1,13 +1,13 @@
 import React, { useState } from "react";
 import { BarChart } from "@tremor/react";
-import KeyInfoView from "./templates/key_info_view";
-import { keyInfoV1Call } from "./networking";
-import { transformKeyInfo } from "../components/key_team_helpers/transform_key_info";
-import { DataTable } from "./view_logs/table";
+import KeyInfoView from "../../../templates/key_info_view";
+import { keyInfoV1Call } from "../../../networking";
+import { transformKeyInfo } from "../../../key_team_helpers/transform_key_info";
+import { DataTable } from "../../../view_logs/table";
 import { Tooltip } from "antd";
 import { Button } from "@tremor/react";
-import { formatNumberWithCommas } from "../utils/dataUtils";
-import { TagUsage } from "./usage/types";
+import { formatNumberWithCommas } from "../../../../utils/dataUtils";
+import { TagUsage } from "../../types";
 import { ChevronDownIcon, ChevronUpIcon } from "@heroicons/react/outline";
 
 interface TopKeyViewProps {

ui/litellm-dashboard/src/components/usage/components/EntityUsage/top_model_view.tsx

@@ -1,7 +1,7 @@
 import { BarChart } from "@tremor/react";
-import { formatNumberWithCommas } from "../utils/dataUtils";
+import { formatNumberWithCommas } from "../../../../utils/dataUtils";
 import { useState } from "react";
-import { DataTable } from "./view_logs/table";
+import { DataTable } from "../../../view_logs/table";
 
 interface TopModel {
   key: string;

ui/litellm-dashboard/src/components/usage/components/new_usage.test.tsx

@@ -1,8 +1,8 @@
 import { render, screen, fireEvent, waitFor, act } from "@testing-library/react";
 import { describe, it, expect, vi, beforeEach, beforeAll } from "vitest";
 import NewUsagePage from "./new_usage";
-import type { Organization } from "./networking";
-import * as networking from "./networking";
+import type { Organization } from "../../networking";
+import * as networking from "../../networking";
 import { useCustomers } from "@/app/(dashboard)/hooks/customers/useCustomers";
 import { useAgents } from "@/app/(dashboard)/hooks/agents/useAgents";
 

ui/litellm-dashboard/src/components/usage/components/new_usage.tsx

@@ -33,22 +33,22 @@ import React, { useCallback, useEffect, useMemo, useState } from "react";
 import { useCustomers } from "@/app/(dashboard)/hooks/customers/useCustomers";
 import { formatNumberWithCommas } from "@/utils/dataUtils";
 import { Button } from "@tremor/react";
-import { all_admin_roles } from "../utils/roles";
-import { ActivityMetrics, processActivityData } from "./activity_metrics";
-import CloudZeroExportModal from "./cloudzero_export_modal";
-import EntityUsage, { EntityList } from "./entity_usage";
-import EntityUsageExportModal from "./EntityUsageExport";
-import { Team } from "./key_team_helpers/key_list";
-import { Organization, tagListCall, userDailyActivityAggregatedCall, userDailyActivityCall } from "./networking";
-import { getProviderLogoAndName } from "./provider_info_helpers";
-import AdvancedDatePicker from "./shared/advanced_date_picker";
-import { ChartLoader } from "./shared/chart_loader";
-import { Tag } from "./tag_management/types";
-import TopKeyView from "./top_key_view";
-import { DailyData, KeyMetricWithMetadata, MetricWithMetadata } from "./usage/types";
-import { valueFormatterSpend } from "./usage/utils/value_formatters";
-import UserAgentActivity from "./user_agent_activity";
-import ViewUserSpend from "./view_user_spend";
+import { all_admin_roles } from "../../../utils/roles";
+import { ActivityMetrics, processActivityData } from "../../activity_metrics";
+import CloudZeroExportModal from "../../cloudzero_export_modal";
+import EntityUsage, { EntityList } from "./EntityUsage/entity_usage";
+import EntityUsageExportModal from "../../EntityUsageExport";
+import { Team } from "../../key_team_helpers/key_list";
+import { Organization, tagListCall, userDailyActivityAggregatedCall, userDailyActivityCall } from "../../networking";
+import { getProviderLogoAndName } from "../../provider_info_helpers";
+import AdvancedDatePicker from "../../shared/advanced_date_picker";
+import { ChartLoader } from "../../shared/chart_loader";
+import { Tag } from "../../tag_management/types";
+import TopKeyView from "./EntityUsage/top_key_view";
+import { DailyData, KeyMetricWithMetadata, MetricWithMetadata } from "../types";
+import { valueFormatterSpend } from "../utils/value_formatters";
+import UserAgentActivity from "../../user_agent_activity";
+import ViewUserSpend from "../../view_user_spend";
 import { useAgents } from "@/app/(dashboard)/hooks/agents/useAgents";
 
 interface NewUsagePageProps {