CUB-42: Show filament cost and usage in UI

frontend/src/app/components/filament-table/filament-table.component.ts

@@ -30,6 +30,8 @@ export type FilamentColumn =
   | 'brand'
   | 'serial'
   | 'remaining'
+  | 'cost'
+  | 'usage'
   | 'stockLevel'
   | 'status';
 
@@ -70,6 +72,8 @@ export class FilamentTableComponent implements OnInit {
     'brand',
     'serial',
     'remaining',
+    'cost',
+    'usage',
     'stockLevel',
     'status',
   ]);
@@ -143,6 +147,18 @@ export class FilamentTableComponent implements OnInit {
             getRemainingPercent(b),
             isAsc
           );
+        case 'cost':
+          return compare(
+            a.purchasePrice ?? 0,
+            b.purchasePrice ?? 0,
+            isAsc
+          );
+        case 'usage':
+          return compare(
+            a.weightTotalGrams - a.weightRemainingGrams,
+            b.weightTotalGrams - b.weightRemainingGrams,
+            isAsc
+          );
         case 'stockLevel':
           return compare(
             stockLevelOrder(classifyStockLevel(a)),
@@ -243,6 +259,29 @@ export class FilamentTableComponent implements OnInit {
     }
     return `${Math.round(grams)}g`;
   }
+
+  /** Template helper: format currency */
+  formatCurrency(value: number): string {
+    return new Intl.NumberFormat('en-US', {
+      style: 'currency',
+      currency: 'USD',
+      minimumFractionDigits: 2,
+      maximumFractionDigits: 2,
+    }).format(value);
+  }
+
+  /** Template helper: compute cost per gram for a filament */
+  getCostPerGram(filament: Filament): number | null {
+    if (filament.purchasePrice === null || filament.purchasePrice === 0 || filament.weightTotalGrams <= 0) {
+      return null;
+    }
+    return filament.purchasePrice / filament.weightTotalGrams;
+  }
+
+  /** Template helper: compute grams used for a filament */
+  getGramsUsed(filament: Filament): number {
+    return filament.weightTotalGrams - filament.weightRemainingGrams;
+  }
 }
 
 /** Compare helper for sorting */