Analyze and remove usage cost rounding (#198)

<!-- CURSOR_SUMMARY -->
---

> [!NOTE]
> Standardizes currency display to exactly 2 decimals, shows vCPU/RAM
with two-decimal precision in usage, and lowercases the add-on price
label.
> 
> - **Formatting Utilities**:
>   - `formatCurrency`: now enforces exactly 2 decimal places.
> - `formatNumber`: adds `maxFractionDigits` parameter (default 0) for
configurable precision.
> - **Usage Display**:
> - Shows `vcpu` and `ram` values with two decimal places in
`formatHoveredValues` and `formatTotalValues`.
> - **Billing UI**:
> - Lowercases add-on price label text in
`concurrent-sandboxes-addon-section.tsx`.
> 
> <sup>Written by [Cursor
Bugbot](https://cursor.com/dashboard?tab=bugbot) for commit
58b7f39. This will update automatically
on new commits. Configure
[here](https://cursor.com/dashboard?tab=bugbot).</sup>
<!-- /CURSOR_SUMMARY -->

---------

Co-authored-by: Cursor Agent <[email protected]>

Author: ben-fornefeld

src/features/dashboard/billing/concurrent-sandboxes-addon-section.tsx

@@ -49,7 +49,7 @@ export function ConcurrentSandboxAddonSection({
         <div className="flex flex-col items-start gap-3 sm:flex-row sm:items-center sm:justify-between sm:gap-4">
           <div className="flex-1">
             <p className="prose-body text-fg">+500 Concurrent Sandboxes</p>
-            <p className="text-fg-tertiary prose-label mt-0.5 uppercase">
+            <p className="text-fg-tertiary prose-label mt-0.5 lowercase">
               {`+${formatCurrency(priceCents / 100)}/mo`}
             </p>
           </div>

src/features/dashboard/usage/display-utils.ts

@@ -139,12 +139,12 @@ export function formatHoveredValues(
       timestamp: timestampLabel,
     },
     vcpu: {
-      displayValue: formatNumber(vcpuHours),
+      displayValue: formatNumber(vcpuHours, 'en-US', 2),
       label,
       timestamp: timestampLabel,
     },
     ram: {
-      displayValue: formatNumber(ramGibHours),
+      displayValue: formatNumber(ramGibHours, 'en-US', 2),
       label,
       timestamp: timestampLabel,
     },
@@ -177,12 +177,12 @@ export function formatTotalValues(totals: {
       timestamp: null,
     },
     vcpu: {
-      displayValue: formatNumber(totals.vcpu),
+      displayValue: formatNumber(totals.vcpu, 'en-US', 2),
       label: 'total over range',
       timestamp: null,
     },
     ram: {
-      displayValue: formatNumber(totals.ram),
+      displayValue: formatNumber(totals.ram, 'en-US', 2),
       label: 'total over range',
       timestamp: null,
     },

src/lib/utils/formatting.ts

@@ -217,11 +217,16 @@ export function formatAveragingPeriod(stepMs: number): string {
  * Format a number with locale-specific separators
  * @param value - Number to format
  * @param locale - Locale to use (defaults to 'en-US')
+ * @param maxFractionDigits - Maximum decimal places to show (defaults to 0 for whole numbers)
  * @returns Formatted number string
  */
-export function formatNumber(value: number, locale: string = 'en-US'): string {
+export function formatNumber(
+  value: number,
+  locale: string = 'en-US',
+  maxFractionDigits: number = 0
+): string {
   return value.toLocaleString(locale, {
-    maximumFractionDigits: 0,
+    maximumFractionDigits: maxFractionDigits,
   })
 }
 
@@ -421,6 +426,7 @@ export function combineDateTimeStrings(
 
 /**
  * Format a currency amount with the specified currency and locale
+ * Always displays exactly 2 decimal places with standard rounding
  * @param amount - Amount to format
  * @param currency - Currency to use (defaults to 'USD')
  * @param locale - Locale to use (defaults to 'en-US')
@@ -434,7 +440,7 @@ export function formatCurrency(
   return Intl.NumberFormat(locale, {
     style: 'currency',
     currency,
-    minimumFractionDigits: 0,
+    minimumFractionDigits: 2,
     maximumFractionDigits: 2,
   }).format(amount)
 }