fix(ui): repoint dead usage guide link to cost tracking docs

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

@@ -58,7 +58,7 @@
   token: string | null;
   userRole: string | null;
   userID: string | null;
   keys: any[] | null;
   premiumUser: boolean;
 }
 
@@ -69,9 +69,9 @@
 }
 
 type CustomTooltipTypeBar = {
   payload: any;
   active: boolean | undefined;
   label: any;
 };
 
 const customTooltip = (props: CustomTooltipTypeBar) => {
@@ -107,7 +107,7 @@
   );
 };
 
 function getTopKeys(data: Array<{ [key: string]: unknown }>): any[] {
   const spendKeys: { key: string; spend: unknown }[] = [];
 
   data.forEach((dict) => {
@@ -134,12 +134,12 @@
 
 const UsagePage: React.FC<UsagePageProps> = ({ accessToken, token, userRole, userID, keys, premiumUser }) => {
   const currentDate = new Date();
   const [keySpendData, setKeySpendData] = useState<any[]>([]);
   const [topKeys, setTopKeys] = useState<any[]>([]);
   const [topModels, setTopModels] = useState<any[]>([]);
   const [topUsers, setTopUsers] = useState<any[]>([]);
   const [teamSpendData, setTeamSpendData] = useState<any[]>([]);
   const [topTagsData, setTopTagsData] = useState<any[]>([]);
   const [allTagNames, setAllTagNames] = useState<string[]>([]);
   const [uniqueTeamIds, setUniqueTeamIds] = useState<any[]>([]);
   const [totalSpendPerTeam, setTotalSpendPerTeam] = useState<any[]>([]);
@@ -547,7 +547,7 @@
             Please follow our guide to view usage when SpendLogs has more than 1M rows.
           </Text>
           <Button className="mt-4">
-            <a href="https://docs.litellm.ai/docs/proxy/spending_monitoring" target="_blank">
+            <a href="https://docs.litellm.ai/docs/proxy/cost_tracking" target="_blank">
               View Usage Guide
             </a>
           </Button>