Add usage per user

Author: SamSaffron

app/models/ai_api_audit_log.rb

@@ -3,6 +3,7 @@
 class AiApiAuditLog < ActiveRecord::Base
   belongs_to :post
   belongs_to :topic
+  belongs_to :user
 
   module Provider
     OpenAI = 1

app/serializers/ai_usage_serializer.rb

@@ -1,7 +1,7 @@
 # frozen_string_literal: true
 
 class AiUsageSerializer < ApplicationSerializer
-  attributes :data, :features, :models, :summary
+  attributes :data, :features, :models, :users, :summary
 
   def data
     object.tokens_by_period.as_json(
@@ -35,6 +35,19 @@ def models
     )
   end
 
+  def users
+    object.user_breakdown.as_json(
+      only: %i[
+        username
+        usage_count
+        total_tokens
+        total_cached_tokens
+        total_request_tokens
+        total_response_tokens
+      ],
+    )
+  end
+
   def summary
     {
       total_tokens: object.total_tokens,

assets/javascripts/discourse/components/ai-usage.gjs

@@ -88,14 +88,22 @@ export default class AiUsage extends Component {
     return normalized;
   }
 
-  // Then modify the chartConfig getter to use this normalized data:
   get chartConfig() {
     if (!this.data?.data) {
       return;
     }
 
     const normalizedData = this.normalizeTimeSeriesData(this.data.data);
 
+    const chartEl = document.querySelector(".ai-usage__chart");
+    const computedStyle = getComputedStyle(chartEl);
+
+    const colors = {
+      response: computedStyle.getPropertyValue("--chart-response-color").trim(),
+      request: computedStyle.getPropertyValue("--chart-request-color").trim(),
+      cached: computedStyle.getPropertyValue("--chart-cached-color").trim(),
+    };
+
     return {
       type: "bar",
       data: {
@@ -107,17 +115,19 @@ export default class AiUsage extends Component {
           {
             label: "Response Tokens",
             data: normalizedData.map((row) => row.total_response_tokens),
-            backgroundColor: "rgba(75, 192, 192, 0.8)",
+            backgroundColor: colors.response,
           },
           {
-            label: "Request Tokens",
-            data: normalizedData.map((row) => row.total_request_tokens),
-            backgroundColor: "rgba(153, 102, 255, 0.8)",
+            label: "Net Request Tokens",
+            data: normalizedData.map(
+              (row) => row.total_request_tokens - row.total_cached_tokens
+            ),
+            backgroundColor: colors.request,
           },
           {
-            label: "Cached Tokens",
+            label: "Cached Request Tokens",
             data: normalizedData.map((row) => row.total_cached_tokens),
-            backgroundColor: "rgba(255, 159, 64, 0.8)",
+            backgroundColor: colors.cached,
           },
         ],
       },
@@ -296,6 +306,37 @@ export default class AiUsage extends Component {
             </div>
 
             <div class="ai-usage__breakdowns">
+
+              <div class="ai-usage__users">
+                <h3 class="ai-usage__users-title">
+                  {{i18n "discourse_ai.usage.users_breakdown"}}
+                </h3>
+                <table class="ai-usage__users-table">
+                  <thead>
+                    <tr>
+                      <th>{{i18n "discourse_ai.usage.username"}}</th>
+                      <th>{{i18n "discourse_ai.usage.usage_count"}}</th>
+                      <th>{{i18n "discourse_ai.usage.total_tokens"}}</th>
+                    </tr>
+                  </thead>
+                  <tbody>
+                    {{#each this.data.users as |user|}}
+                      <tr class="ai-usage__users-row">
+                        <td
+                          class="ai-usage__users-cell"
+                        >{{user.username}}</td>
+                        <td
+                          class="ai-usage__users-cell"
+                        >{{user.usage_count}}</td>
+                        <td
+                          class="ai-usage__users-cell"
+                        >{{user.total_tokens}}</td>
+                      </tr>
+                    {{/each}}
+                  </tbody>
+                </table>
+              </div>
+
               <div class="ai-usage__features">
                 <h3 class="ai-usage__features-title">
                   {{i18n "discourse_ai.usage.features_breakdown"}}

assets/stylesheets/modules/llms/common/usage.scss

@@ -1,4 +1,8 @@
 .ai-usage {
+  --chart-response-color: rgba(75, 192, 192, 0.8);
+  --chart-request-color: rgba(153, 102, 255, 0.8);
+  --chart-cached-color: rgba(153, 102, 255, 0.4);
+
   padding: 1em;
 
   &__filters-dates {
@@ -64,6 +68,10 @@
     margin-top: 2em;
   }
 
+  &__chart {
+    position: relative;
+  }
+
   &__chart-container {
     margin-bottom: 2em;
   }
@@ -84,18 +92,21 @@
   }
 
   &__features,
+  &__users,
   &__models {
     background: var(--primary-very-low);
     padding: 1em;
     border-radius: 0.5em;
   }
 
   &__features-title,
+  &__users-title,
   &__models-title {
     margin-bottom: 1em;
   }
 
   &__features-table,
+  &__users-table,
   &__models-table {
     width: 100%;
     border-collapse: collapse;
@@ -108,13 +119,15 @@
   }
 
   &__features-row,
+  &__users-row,
   &__models-row {
     &:hover {
       background: var(--primary-low);
     }
   }
 
   &__features-cell,
+  &__users-cell,
   &__models-cell {
     padding: 0.5em;
     border-bottom: 1px solid var(--primary-low);

config/locales/client.en.yml

@@ -136,8 +136,10 @@ en:
         usage_count: "Usage count"
         model: "Model"
         models_breakdown: "Usage per model"
+        users_breakdown: "Usage per user"
         all_features: "All features"
         all_models: "All models"
+        username: "Username"
 
 
       ai_persona:

lib/completions/report.rb

@@ -1,6 +1,9 @@
 module DiscourseAi
   module Completions
     class Report
+      UNKNOWN_FEATURE = "unknown"
+      USER_LIMIT = 50
+
       attr_reader :start_date, :end_date, :base_query
 
       def initialize(start_date: 30.days.ago, end_date: Time.current)
@@ -40,12 +43,28 @@ def tokens_by_period(period = nil)
           )
       end
 
+      def user_breakdown
+        base_query
+          .joins(:user)
+          .group(:user_id, "users.username")
+          .order("usage_count DESC")
+          .limit(USER_LIMIT)
+          .select(
+            "users.username",
+            "COUNT(*) as usage_count",
+            "SUM(request_tokens + response_tokens) as total_tokens",
+            "SUM(COALESCE(cached_tokens,0)) as total_cached_tokens",
+            "SUM(request_tokens) as total_request_tokens",
+            "SUM(response_tokens) as total_response_tokens",
+          )
+      end
+
       def feature_breakdown
         base_query
           .group(:feature_name)
           .order("usage_count DESC")
           .select(
-            "feature_name",
+            "case when coalesce(feature_name, '') = '' then '#{UNKNOWN_FEATURE}' else feature_name end as feature_name",
             "COUNT(*) as usage_count",
             "SUM(request_tokens + response_tokens) as total_tokens",
             "SUM(COALESCE(cached_tokens,0)) as total_cached_tokens",
@@ -81,7 +100,11 @@ def tokens_per_month
       end
 
       def filter_by_feature(feature_name)
-        @base_query = base_query.where(feature_name: feature_name)
+        if feature_name == UNKNOWN_FEATURE
+          @base_query = base_query.where("coalesce(feature_name, '') = ''")
+        else
+          @base_query = base_query.where(feature_name: feature_name)
+        end
         self
       end