basic ai analytics created

src/app/[orgId]/settings/logs/ai-usage/page.tsx

@@ -0,0 +1,30 @@
+import { AiUsageAnalyticsData } from "@app/components/AiUsageAnalyticsData";
+import SettingsSectionTitle from "@app/components/SettingsSectionTitle";
+import type { Metadata } from "next";
+
+export const metadata: Metadata = {
+    title: "AI Usage Analytics"
+};
+
+export interface AiUsageAnalyticsPageProps {
+    params: Promise<{ orgId: string }>;
+}
+
+export default async function AiUsageAnalyticsPage(
+    props: AiUsageAnalyticsPageProps
+) {
+    const orgId = (await props.params).orgId;
+
+    return (
+        <>
+            <SettingsSectionTitle
+                title="AI Usage Analytics"
+                description="Analyze AI gateway cost, token usage, and activity across providers, resources, roles, and users"
+            />
+
+            <div className="container mx-auto max-w-12xl">
+                <AiUsageAnalyticsData orgId={orgId} />
+            </div>
+        </>
+    );
+}

src/app/navigation.tsx

@@ -8,6 +8,7 @@ import {
     Building2,
     Cable,
     ChartLine,
+    Coins,
     Combine,
     CreditCard,
     Fingerprint,
@@ -233,6 +234,11 @@ export const orgNavSections = (
                         href: "/{orgId}/settings/logs/ai",
                         icon: <Bot className="size-4 flex-none" />
                     },
+                    {
+                        title: "sidebarLogsAiUsage",
+                        href: "/{orgId}/settings/logs/ai-usage",
+                        icon: <Coins className="size-4 flex-none" />
+                    },
                     ...(!env?.flags.disableEnterpriseFeatures
                         ? [
                               {
@@ -532,6 +538,11 @@ export const commandBarNavSections = (
                 href: "/{orgId}/settings/logs/ai",
                 icon: <Bot className="size-4 flex-none" />
             },
+            {
+                title: "commandLogsAiUsage",
+                href: "/{orgId}/settings/logs/ai-usage",
+                icon: <Coins className="size-4 flex-none" />
+            },
             ...(!env?.flags.disableEnterpriseFeatures
                 ? [
                       {