llm_cost_tracker 0.7.3 → 0.9.0

data/app/services/llm_cost_tracker/dashboard/tag_breakdown.rb

@@ -4,9 +4,10 @@ module LlmCostTracker
   module Dashboard
     class TagBreakdown
       DEFAULT_LIMIT = 100
+      Row = Data.define(:value, :calls, :total_cost, :average_cost_per_call, :share_percent)
 
       class << self
-        def call(key:, scope: LlmCostTracker::Ledger::Call.all, limit: DEFAULT_LIMIT)
+        def call(key:, scope: LlmCostTracker::Call.all, limit: DEFAULT_LIMIT)
           new(scope: scope, key: key, limit: limit)
         end
       end
@@ -21,7 +22,19 @@ module LlmCostTracker
       end
 
       def rows
-        @rows ||= scope.klass.find_by_sql(rows_sql)
+        @rows ||= begin
+          total = tagged_calls
+          scope.klass.find_by_sql(rows_sql).map do |row|
+            calls = row.calls.to_i
+            Row.new(
+              value: row.value,
+              calls: calls,
+              total_cost: row.total_cost,
+              average_cost_per_call: row.average_cost_per_call,
+              share_percent: percentage(calls, total)
+            )
+          end
+        end
       end
 
       def total_calls
@@ -46,13 +59,14 @@ module LlmCostTracker
 
       def rows_sql
         <<~SQL.squish
-          SELECT #{tag_expression} AS value,
+          SELECT #{tag_value_column} AS value,
                  COUNT(*) AS calls,
                  COALESCE(SUM(sub.total_cost), 0) AS total_cost,
                  COALESCE(SUM(sub.total_cost), 0) / NULLIF(COUNT(*), 0) AS average_cost_per_call
           FROM (#{scope.to_sql}) AS sub
+          INNER JOIN #{call_tag_table} t ON t.llm_cost_tracker_call_id = sub.id AND t.#{quote_column('key')} = #{quoted_key}
           WHERE #{tag_present_predicate}
-          GROUP BY #{tag_expression}
+          GROUP BY #{tag_value_column}
           ORDER BY total_cost DESC, calls DESC, value ASC
           LIMIT #{limit}
         SQL
@@ -61,18 +75,37 @@ module LlmCostTracker
       def summary_sql
         <<~SQL.squish
           SELECT COUNT(*) AS total_calls,
-                 COALESCE(SUM(CASE WHEN #{tag_present_predicate} THEN 1 ELSE 0 END), 0) AS tagged_calls,
-                 COUNT(DISTINCT CASE WHEN #{tag_present_predicate} THEN #{tag_expression} END) AS distinct_values
+                 COUNT(t.#{quote_column('value')}) AS tagged_calls,
+                 COUNT(DISTINCT CASE WHEN #{tag_present_predicate} THEN #{tag_value_column} END) AS distinct_values
           FROM (#{scope.to_sql}) AS sub
+          LEFT OUTER JOIN #{call_tag_table} t ON t.llm_cost_tracker_call_id = sub.id AND t.#{quote_column('key')} = #{quoted_key}
         SQL
       end
 
       def tag_present_predicate
-        "#{tag_expression} IS NOT NULL AND #{tag_expression} != ''"
+        "#{tag_value_column} IS NOT NULL AND #{tag_value_column} != ''"
+      end
+
+      def tag_value_column
+        "t.#{quote_column('value')}"
+      end
+
+      def call_tag_table
+        LlmCostTracker::CallTag.quoted_table_name
       end
 
-      def tag_expression
-        @tag_expression ||= LlmCostTracker::Ledger::Call.tag_value_expression(key, table_name: "sub")
+      def quote_column(name)
+        scope.connection.quote_column_name(name)
+      end
+
+      def quoted_key
+        scope.connection.quote(key)
+      end
+
+      def percentage(numerator, denominator)
+        return 0.0 unless denominator.positive?
+
+        (numerator / denominator.to_f) * 100.0
       end
     end
   end

data/app/services/llm_cost_tracker/dashboard/tag_key_explorer.rb

@@ -6,14 +6,14 @@ module LlmCostTracker
       DEFAULT_LIMIT = 100
 
       class << self
-        def call(scope: LlmCostTracker::Ledger::Call.all, limit: DEFAULT_LIMIT)
+        def call(scope: LlmCostTracker::Call.all, limit: DEFAULT_LIMIT)
           new(scope: scope, limit: limit).rows
         end
       end
 
       def initialize(scope:, limit:)
         @scope = scope
-        @connection = LlmCostTracker::Ledger::Call.connection
+        @connection = LlmCostTracker::Call.connection
         limit = limit.to_i
         @limit = limit.positive? ? [limit, DEFAULT_LIMIT].min : DEFAULT_LIMIT
       end
@@ -29,50 +29,27 @@ module LlmCostTracker
 
       attr_reader :scope, :connection, :limit
 
-      def subquery
-        scope.to_sql
-      end
-
       def build_sql
-        return postgresql_sql if Ledger::Schema::Adapter.postgresql?(connection)
-        return mysql_sql if Ledger::Schema::Adapter.mysql?(connection)
-
-        Ledger::Schema::Adapter.ensure_supported!(connection)
-      end
+        tags_table = LlmCostTracker::CallTag.quoted_table_name
 
-      def mysql_sql
         <<~SQL.squish
-          SELECT jt.key AS key,
+          SELECT t.#{key_column} AS #{key_column},
                  COUNT(*) AS calls_count,
-                 COUNT(DISTINCT JSON_UNQUOTE(JSON_EXTRACT(sub.tags, CONCAT('$.', JSON_QUOTE(jt.key))))) AS distinct_values
-          FROM (#{subquery}) AS sub
-          JOIN JSON_TABLE(
-            COALESCE(JSON_KEYS(sub.tags), JSON_ARRAY()),
-            '$[*]' COLUMNS(
-              key VARCHAR(255) PATH '$'
-            )
-          ) AS jt
-          WHERE sub.tags IS NOT NULL
-            AND sub.tags != ''
-          GROUP BY jt.key
+                 COUNT(DISTINCT t.#{value_column}) AS distinct_values
+          FROM (#{scope.to_sql}) AS sub
+          INNER JOIN #{tags_table} t ON t.llm_cost_tracker_call_id = sub.id
+          GROUP BY t.#{key_column}
           ORDER BY calls_count DESC
           LIMIT #{limit}
         SQL
       end
 
-      def postgresql_sql
-        <<~SQL.squish
-          SELECT key,
-                 COUNT(*) AS calls_count,
-                 COUNT(DISTINCT (sub.tags::jsonb)->>key) AS distinct_values
-          FROM (#{subquery}) AS sub,
-               jsonb_object_keys(sub.tags::jsonb) AS key
-          WHERE sub.tags IS NOT NULL
-            AND sub.tags::jsonb <> '{}'::jsonb
-          GROUP BY key
-          ORDER BY calls_count DESC
-          LIMIT #{limit}
-        SQL
+      def key_column
+        connection.quote_column_name("key")
+      end
+
+      def value_column
+        connection.quote_column_name("value")
       end
     end
   end

data/app/services/llm_cost_tracker/dashboard/time_series.rb

@@ -8,7 +8,7 @@ module LlmCostTracker
       DEFAULT_DAYS = 30
 
       class << self
-        def call(scope: LlmCostTracker::Ledger::Call.all, from: nil, to: Date.current)
+        def call(scope: LlmCostTracker::Call.all, from: nil, to: Date.current)
           new(scope: scope, from: from, to: to).points
         end
       end

data/app/services/llm_cost_tracker/dashboard/top_models.rb

@@ -8,7 +8,7 @@ module LlmCostTracker
       DEFAULT_SORT = "cost"
 
       class << self
-        def call(scope: LlmCostTracker::Ledger::Call.all, limit: DEFAULT_LIMIT, sort: DEFAULT_SORT)
+        def call(scope: LlmCostTracker::Call.all, limit: DEFAULT_LIMIT, sort: DEFAULT_SORT)
           new(scope: scope, limit: limit, sort: sort).rows
         end
       end

data/app/views/layouts/llm_cost_tracker/application.html.erb

@@ -1,3 +1,4 @@
+<% body = capture { yield } %>
 <!DOCTYPE html>
 <html lang="en">
   <head>
@@ -5,6 +6,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <title>LLM Cost Tracker</title>
     <%= stylesheet_link_tag stylesheet_path %>
+    <%= inline_style_block %>
   </head>
   <body class="lct-body">
     <div class="lct-app">
@@ -19,10 +21,13 @@
             <%= link_to "Calls", calls_path, class: ("lct-active" if request.path.start_with?(calls_path)) %>
             <%= link_to "Tags", tags_path, class: ("lct-active" if request.path.start_with?(tags_path)) %>
             <%= link_to "Data Quality", data_quality_path, class: ("lct-active" if request.path.start_with?(data_quality_path)) %>
+            <% if LlmCostTracker.reconciliation_enabled? %>
+              <%= link_to "Reconciliation", reconciliation_path, class: ("lct-active" if request.path.start_with?(reconciliation_path)) %>
+            <% end %>
           </nav>
         </header>
 
-        <%= yield %>
+        <%= body %>
       </main>
     </div>
   </body>

data/app/views/llm_cost_tracker/calls/index.html.erb

@@ -2,83 +2,16 @@
   <div class="lct-toolbar-head">
     <h2 class="lct-section-title">Calls</h2>
     <div class="lct-toolbar-actions">
-      <%= link_to "Export CSV", calls_path(current_query(format: :csv)), class: "lct-button lct-button-secondary" %>
+      <%= link_to "Export CSV",
+                  calls_path(current_query(format: :csv)),
+                  class: "lct-button lct-button-secondary",
+                  title: "Capped at #{number(LlmCostTracker::CallsController::CSV_EXPORT_LIMIT)} rows per request — narrow the date range to export larger slices." %>
     </div>
   </div>
 
-  <form class="lct-filters" action="<%= calls_path %>" method="get">
-    <div class="lct-filter-row lct-filter-row-with-sort">
-      <div class="lct-field">
-        <label for="lct-from">From</label>
-        <input id="lct-from" type="date" name="from" value="<%= params[:from] %>">
-      </div>
-
-      <div class="lct-field">
-        <label for="lct-to">To</label>
-        <input id="lct-to" type="date" name="to" value="<%= params[:to] %>">
-      </div>
-
-      <div class="lct-field">
-        <label for="lct-provider">Provider</label>
-        <%= select_tag :provider,
-                       options_for_select(provider_filter_options, params[:provider]),
-                       include_blank: "All providers",
-                       id: "lct-provider" %>
-      </div>
-
-      <div class="lct-field">
-        <label for="lct-model">Model</label>
-        <%= select_tag :model,
-                       options_for_select(model_filter_options, params[:model]),
-                       include_blank: "All models",
-                       id: "lct-model" %>
-      </div>
-
-      <div class="lct-field">
-        <label for="lct-stream">Stream</label>
-        <%= select_tag :stream,
-                       options_for_select(LlmCostTracker::DashboardFilterHelper::STREAM_FILTER_OPTIONS, params[:stream]),
-                       include_blank: "All calls",
-                       id: "lct-stream" %>
-      </div>
-
-      <div class="lct-field">
-        <label for="lct-sort">Sort</label>
-        <%= select_tag :sort,
-                       options_for_select(
-                         [["Recent first", ""],
-                          ["Most expensive", "expensive"],
-                          ["Largest input", "input"],
-                          ["Largest output", "output"],
-                          ["Slowest", "slow"],
-                          ["Unknown pricing only", "unknown_pricing"]],
-                         @sort
-                       ),
-                       id: "lct-sort" %>
-      </div>
-
-      <div class="lct-filter-actions">
-        <button class="lct-button" type="submit">Apply</button>
-        <%= link_to("Reset", calls_path, class: "lct-button lct-button-secondary") if any_filter_applied? %>
-      </div>
-    </div>
-  </form>
+  <%= render "llm_cost_tracker/shared/filters", path: calls_path %>
 
   <%= render "llm_cost_tracker/shared/active_filters", chips: active_tag_filters, clear_path: calls_path %>
-
-  <p class="lct-summary-row">
-    <span class="lct-pagination-per">
-      <span class="lct-pagination-per-label">Per page:</span>
-      <% LlmCostTracker::PaginationHelper::PER_PAGE_CHOICES.each do |choice| %>
-        <% if choice == @page.per %>
-          <span class="lct-pagination-per-option is-active" aria-current="true"><%= choice %></span>
-        <% else %>
-          <%= link_to choice, calls_path(current_query(per: choice, page: 1)), class: "lct-pagination-per-option" %>
-        <% end %>
-      <% end %>
-    </span>
-  </p>
-  <p class="lct-toolbar-note">CSV export is capped at <%= number(LlmCostTracker::CallsController::CSV_EXPORT_LIMIT) %> rows per request — narrow the date range to export larger slices.</p>
 </section>
 
 <% if @calls_count.zero? %>
@@ -91,6 +24,31 @@
   </section>
 <% else %>
   <section class="lct-panel">
+    <div class="lct-results-toolbar">
+      <span class="lct-pagination-per">
+        <span class="lct-pagination-per-label">Per page:</span>
+        <% LlmCostTracker::PaginationHelper::PER_PAGE_CHOICES.each do |choice| %>
+          <% if choice == @page.per %>
+            <span class="lct-pagination-per-option is-active" aria-current="true"><%= choice %></span>
+          <% else %>
+            <%= link_to choice, calls_path(current_query(per: choice, page: 1)), class: "lct-pagination-per-option" %>
+          <% end %>
+        <% end %>
+      </span>
+
+      <%= render "llm_cost_tracker/shared/sort",
+                 current: @sort,
+                 options: [
+                   ["Recent", ""],
+                   ["Most expensive", "expensive"],
+                   ["Largest input", "input"],
+                   ["Largest output", "output"],
+                   ["Slowest", "slow"],
+                   ["Unknown pricing", "unknown_pricing"]
+                 ],
+                 path_for_sort: ->(value) { calls_path(current_query(sort: value.presence, page: nil)) } %>
+    </div>
+
     <div class="lct-table-wrap">
       <table class="lct-table lct-table-compact lct-calls-table">
         <thead>
@@ -113,9 +71,9 @@
               <td class="lct-nowrap"><%= format_date(call.tracked_at) %></td>
               <td><%= call.provider %></td>
               <td><code class="lct-code"><%= call.model %></code></td>
-              <td class="lct-num"><%= format_tokens(call.input_tokens) %></td>
-              <td class="lct-num"><%= format_tokens(call.output_tokens) %></td>
-              <td class="lct-num"><%= format_tokens(call.total_tokens) %></td>
+              <td class="lct-num"><%= number(call.input_tokens) %></td>
+              <td class="lct-num"><%= number(call.output_tokens) %></td>
+              <td class="lct-num"><%= number(call.total_tokens) %></td>
               <td class="lct-num<%= ' lct-num-muted' if call.total_cost.nil? %>"><%= optional_money(call.total_cost) %></td>
               <td class="lct-num<%= ' lct-num-muted' if call.latency_ms.nil? %>"><%= call.latency_ms ? "#{number(call.latency_ms)}ms" : "n/a" %></td>
               <td><%= render "llm_cost_tracker/shared/tag_chips", tags: call.parsed_tags %></td>

data/app/views/llm_cost_tracker/calls/show.html.erb

@@ -1,28 +1,32 @@
 <% priced_components = token_usage_stack_components %>
+<% line_item_costs_by_component = call_line_item_costs_by_component(@call) %>
 <% token_segments = priced_components.map do |component|
   token_key = component.fetch(:token_key)
   value = @call.has_attribute?(token_key) ? @call[token_key] : 0
-  { label: component.fetch(:label), value: value, formatted_value: format_tokens(value), css_class: component.fetch(:css_class) }
+  { label: component.fetch(:label), value: value, formatted_value: number(value), css_class: component.fetch(:css_class) }
 end %>
 <% cost_segments = [] %>
 <% unless @call.total_cost.nil? %>
   <% cost_segments = priced_components.map do |component|
-    cost_key = component.fetch(:cost_key)
-    value = @call.has_attribute?(cost_key) ? @call[cost_key] : nil
+    value = line_item_costs_by_component[component.fetch(:price_key)]
     { label: component.fetch(:label), value: value, formatted_value: optional_money(value), css_class: component.fetch(:css_class) }
   end %>
 <% end %>
 
 <section class="lct-panel">
-  <p class="lct-muted"><%= link_to "Back to calls", calls_path %></p>
+  <nav class="lct-breadcrumb" aria-label="Breadcrumb">
+    <%= link_to "Calls", calls_path, class: "lct-breadcrumb-link" %>
+    <span class="lct-breadcrumb-sep" aria-hidden="true">›</span>
+    <span class="lct-breadcrumb-current">#<%= @call.id %></span>
+  </nav>
   <div class="lct-call-hero">
     <div>
-      <h2 class="lct-section-title lct-call-title">Call #<%= @call.id %></h2>
+      <h2 class="lct-section-title lct-call-title">
+        <code class="lct-code"><%= @call.model %></code>
+      </h2>
       <p class="lct-call-subtitle">
         <code class="lct-code"><%= @call.provider %></code>
         <span>·</span>
-        <code class="lct-code"><%= @call.model %></code>
-        <span>·</span>
         <span><%= format_date(@call.tracked_at) %></span>
       </p>
     </div>
@@ -38,7 +42,7 @@ end %>
       </div>
       <div class="lct-call-summary-item">
         <span class="lct-call-summary-label">Total tokens</span>
-        <strong><%= format_tokens(@call.total_tokens) %></strong>
+        <strong><%= number(@call.total_tokens) %></strong>
       </div>
       <div class="lct-call-summary-item">
         <span class="lct-call-summary-label">Latency</span>
@@ -65,55 +69,91 @@ end %>
 
   <div class="lct-detail-grid">
     <dl class="lct-dl">
-      <dt>Tracked At</dt>
-      <dd><%= format_date(@call.tracked_at) %></dd>
+      <dt>Cost Status</dt>
+      <dd><%= @call.cost_status.presence || "n/a" %></dd>
 
-      <dt>Provider</dt>
-      <dd><%= @call.provider %></dd>
-
-      <dt>Model</dt>
-      <dd><%= @call.model %></dd>
+      <dt>Latency</dt>
+      <dd><%= @call.latency_ms ? "#{optional_number(@call.latency_ms)}ms" : "n/a" %></dd>
 
-      <dt>Pricing Status</dt>
-      <dd><%= pricing_status(@call) %></dd>
+      <dt>Batch</dt>
+      <dd><%= @call.batch? ? "yes" : "no" %></dd>
 
-      <dt>Provider Response ID</dt>
+      <dt>Response ID</dt>
       <dd><%= @call.provider_response_id.presence || "n/a" %></dd>
 
-      <% if @call.has_attribute?("created_at") %>
-        <dt>Created At</dt>
-        <dd><%= format_date(@call.created_at) %></dd>
-      <% end %>
+      <dt>Project ID</dt>
+      <dd><%= @call.provider_project_id.present? ? LlmCostTracker::Masking.mask_value(:provider_project_id, @call.provider_project_id) : "n/a" %></dd>
 
-      <% if @call.has_attribute?("updated_at") %>
-        <dt>Updated At</dt>
-        <dd><%= format_date(@call.updated_at) %></dd>
-      <% end %>
+      <dt>API Key ID</dt>
+      <dd><%= @call.provider_api_key_id.present? ? LlmCostTracker::Masking.mask_value(:provider_api_key_id, @call.provider_api_key_id) : "n/a" %></dd>
+
+      <dt>Workspace ID</dt>
+      <dd><%= @call.provider_workspace_id.present? ? LlmCostTracker::Masking.mask_value(:provider_workspace_id, @call.provider_workspace_id) : "n/a" %></dd>
     </dl>
 
     <dl class="lct-dl">
       <% priced_components.each do |component| %>
         <dt><%= component.fetch(:label).titleize %> Tokens</dt>
-        <dd><%= format_tokens(@call[component.fetch(:token_key)]) %></dd>
+        <dd><%= number(@call[component.fetch(:token_key)]) %></dd>
       <% end %>
 
       <dt>Total Tokens</dt>
-      <dd><%= format_tokens(@call.total_tokens) %></dd>
+      <dd><%= number(@call.total_tokens) %></dd>
+    </dl>
 
+    <dl class="lct-dl">
       <% priced_components.each do |component| %>
         <dt><%= component.fetch(:label).titleize %> Cost</dt>
-        <dd><%= optional_money(@call[component.fetch(:cost_key)]) %></dd>
+        <dd><%= optional_money(line_item_costs_by_component[component.fetch(:price_key)]) %></dd>
       <% end %>
 
       <dt>Total Cost</dt>
       <dd><%= optional_money(@call.total_cost) %></dd>
-
-      <dt>Latency</dt>
-      <dd><%= @call.latency_ms ? "#{optional_number(@call.latency_ms)}ms" : "n/a" %></dd>
     </dl>
   </div>
 </section>
 
+<% service_line_items = @call.line_items.where.not(unit: "token").order(:position).to_a %>
+<% if service_line_items.any? %>
+  <section class="lct-panel">
+    <h2 class="lct-section-title">Service Charges</h2>
+    <div class="lct-table-wrap">
+      <table class="lct-table lct-table-compact">
+        <thead>
+          <tr>
+            <th>Component</th>
+            <th>Unit</th>
+            <th class="lct-num">Quantity</th>
+            <th class="lct-num">Rate</th>
+            <th class="lct-num">Cost</th>
+            <th>Status</th>
+          </tr>
+        </thead>
+        <tbody>
+          <% service_line_items.each do |line_item| %>
+            <tr>
+              <td><code class="lct-code"><%= line_item.kind %></code></td>
+              <td><%= line_item.unit %></td>
+              <td class="lct-num"><%= line_item.quantity %></td>
+              <td class="lct-num"><%= line_item.rate_amount ? "#{optional_money(line_item.rate_amount)} / #{line_item.rate_quantity}" : "n/a" %></td>
+              <% unknown_cost = line_item.cost.nil? || line_item.cost_status.to_s == LlmCostTracker::Billing::CostStatus::UNKNOWN %>
+              <td class="lct-num<%= ' lct-num-muted' if unknown_cost %>"><%= unknown_cost ? "n/a" : money(line_item.cost) %></td>
+              <td><%= line_item.cost_status %></td>
+            </tr>
+          <% end %>
+        </tbody>
+      </table>
+    </div>
+  </section>
+<% end %>
+
+<% if @call.pricing_snapshot.present? %>
+  <section class="lct-panel">
+    <h2 class="lct-section-title">Pricing Snapshot</h2>
+    <pre class="lct-pre"><%= safe_json(@call.pricing_snapshot) %></pre>
+  </section>
+<% end %>
+
 <section class="lct-panel">
   <h2 class="lct-section-title">Tags</h2>
   <pre class="lct-pre"><%= safe_json(@call.parsed_tags) %></pre>
@@ -122,6 +162,6 @@ end %>
 <% if @call.has_attribute?("metadata") %>
   <section class="lct-panel">
     <h2 class="lct-section-title">Metadata</h2>
-    <pre class="lct-pre"><%= safe_json(@call.read_attribute("metadata")) %></pre>
+    <pre class="lct-pre"><%= safe_json(LlmCostTracker::Masking.mask_hash(masked_metadata_hash(@call.read_attribute("metadata")))) %></pre>
   </section>
 <% end %>

data/app/views/llm_cost_tracker/dashboard/index.html.erb

@@ -1,48 +1,10 @@
 <% overview_filter_scope = current_query(from: @from_date.iso8601, to: @to_date.iso8601) %>
 
 <section class="lct-panel lct-toolbar">
-  <form class="lct-filters" action="<%= root_path %>" method="get">
-    <div class="lct-filter-row lct-filter-row-basic">
-      <div class="lct-field">
-        <label for="lct-overview-from">From</label>
-        <input id="lct-overview-from" type="date" name="from" value="<%= params[:from] || @from_date.iso8601 %>">
-      </div>
-
-      <div class="lct-field">
-        <label for="lct-overview-to">To</label>
-        <input id="lct-overview-to" type="date" name="to" value="<%= params[:to] || @to_date.iso8601 %>">
-      </div>
-
-      <div class="lct-field">
-        <label for="lct-overview-provider">Provider</label>
-        <%= select_tag :provider,
-                       options_for_select(provider_filter_options(filter_params: overview_filter_scope), params[:provider]),
-                       include_blank: "All providers",
-                       id: "lct-overview-provider" %>
-      </div>
-
-      <div class="lct-field">
-        <label for="lct-overview-model">Model</label>
-        <%= select_tag :model,
-                       options_for_select(model_filter_options(filter_params: overview_filter_scope), params[:model]),
-                       include_blank: "All models",
-                       id: "lct-overview-model" %>
-      </div>
-
-      <div class="lct-field">
-        <label for="lct-overview-stream">Stream</label>
-        <%= select_tag :stream,
-                       options_for_select(LlmCostTracker::DashboardFilterHelper::STREAM_FILTER_OPTIONS, params[:stream]),
-                       include_blank: "All calls",
-                       id: "lct-overview-stream" %>
-      </div>
-
-      <div class="lct-filter-actions">
-        <button class="lct-button" type="submit">Apply</button>
-        <%= link_to("Reset", root_path, class: "lct-button lct-button-secondary") if any_filter_applied? %>
-      </div>
-    </div>
-  </form>
+  <%= render "llm_cost_tracker/shared/filters",
+             path: root_path,
+             filter_scope: overview_filter_scope,
+             defaults: { from: @from_date.iso8601, to: @to_date.iso8601 } %>
 
   <%= render "llm_cost_tracker/shared/active_filters", chips: active_tag_filters, clear_path: root_path %>
 </section>
@@ -52,7 +14,7 @@
     <h2 class="lct-state-title">No LLM calls yet</h2>
     <p class="lct-state-copy">Tracked requests will appear here after your application records its first LLM API call.</p>
     <div class="lct-state-actions">
-      <%= link_to "View calls", calls_path, class: "lct-button lct-button-secondary" %>
+      <%= link_to "Calls", calls_path, class: "lct-button lct-button-secondary" %>
     </div>
   </section>
 <% else %>
@@ -84,7 +46,7 @@
           <% end %>
         </p>
       </div>
-      <%= link_to "Review calls →",
+      <%= link_to "Calls",
                   calls_path(current_query(provider: @spend_anomaly.fetch(:provider), model: @spend_anomaly.fetch(:model), from: @to_date.iso8601, to: @to_date.iso8601, page: nil, per: nil, format: nil)),
                   class: "lct-button lct-button-secondary" %>
     </aside>
@@ -102,6 +64,11 @@
 
     <div class="lct-hero-side">
       <div class="lct-stat-grid">
+        <article class="lct-stat">
+          <p class="lct-stat-label">Avg cost / call</p>
+          <p class="lct-stat-value"><%= money(@stats.average_cost_per_call) %></p>
+        </article>
+
         <article class="lct-stat">
           <p class="lct-stat-label">Calls</p>
           <p class="lct-stat-value"><%= number(@stats.total_calls) %></p>
@@ -109,11 +76,6 @@
           <span class="<%= badge[:css_class] %>"><span class="lct-delta-dot" aria-hidden="true"></span><%= badge[:text] %></span>
         </article>
 
-        <article class="lct-stat">
-          <p class="lct-stat-label">Avg cost / call</p>
-          <p class="lct-stat-value"><%= money(@stats.average_cost_per_call) %></p>
-        </article>
-
         <% if @stats.average_latency_ms %>
           <article class="lct-stat">
             <p class="lct-stat-label">Avg latency</p>
@@ -125,9 +87,6 @@
 
       <% if @monthly_budget_status %>
         <% budget = @monthly_budget_status %>
-        <% fill_mod = budget_fill_modifier(budget[:percent_used]) %>
-        <% projected_marker = [[budget[:projected_percent_used].to_f, 0.0].max, 100.0].min %>
-        <% projected_delta = budget[:projected_delta].to_f %>
         <section class="lct-panel lct-panel-tight">
           <div class="lct-section-head">
             <div>
@@ -143,16 +102,16 @@
               </span>
               <span class="lct-budget-percent"><%= percent(budget[:percent_used]) %></span>
             </div>
-            <div class="lct-budget-track" role="progressbar" aria-valuemin="0" aria-valuemax="100" aria-valuenow="<%= [budget[:percent_used].to_f, 100.0].min.round %>">
-              <div class="lct-budget-fill <%= fill_mod %>" style="width: <%= [budget[:percent_used].to_f, 100.0].min %>%"></div>
+            <div class="lct-budget-track" role="progressbar" aria-valuemin="0" aria-valuemax="100" aria-valuenow="<%= budget[:progress_percent].round %>">
+              <div data-lct-style="<%= inline_style("width: #{budget[:progress_percent]}%") %>" class="lct-budget-fill <%= budget[:fill_modifier] %>"></div>
               <% if budget[:projected_spent].positive? %>
-                <span class="lct-budget-marker" aria-hidden="true" style="left: calc(<%= projected_marker %>% - 1px)"></span>
+                <span data-lct-style="<%= inline_style("left: calc(#{budget[:projected_marker_percent]}% - 1px)") %>" class="lct-budget-marker" aria-hidden="true"></span>
               <% end %>
             </div>
             <p class="lct-budget-projection">
               <span>Projected <strong><%= money(budget[:projected_spent]) %></strong> by <%= budget[:projection_end_label] %></span>
-              <span class="lct-budget-projection-status <%= projected_delta.positive? ? "lct-budget-projection-status--over" : "lct-budget-projection-status--under" %>">
-                <%= money(projected_delta.abs) %> <%= projected_delta.positive? ? "over" : "under" %> budget
+              <span class="lct-budget-projection-status <%= budget[:projected_delta_status_class] %>">
+                <%= money(budget[:projected_delta_amount]) %> <%= budget[:projected_delta_direction] %> budget
               </span>
             </p>
             <p class="lct-budget-meta">Soft limit: blocking is not atomic under concurrency.</p>