Generated by Spark: seems like the requests shown are not correclty linked to the info in the csv. "o3-mini-2025-01-31" model counts as 0.33 instead of 1 ( in the "Requests Used" column) and the tables and chart now show "0".

Author: rajbos

src/App.tsx

@@ -261,7 +261,7 @@ function App() {
                 <div className="p-5">
                   <h3 className="text-sm font-medium text-muted-foreground mb-1">Total Requests</h3>
                   <p className="text-2xl font-bold">
-                    {data.reduce((sum, item) => sum + item.requestsUsed, 0).toLocaleString()}
+                    {data.reduce((sum, item) => sum + item.requestsUsed, 0).toLocaleString(undefined, {maximumFractionDigits: 2, minimumFractionDigits: 0})}
                   </p>
                 </div>
               </Card>
@@ -301,9 +301,9 @@ function App() {
                       {modelSummary.map((item) => (
                         <TableRow key={item.model}>
                           <TableCell className="font-medium">{item.model}</TableCell>
-                          <TableCell className="text-right">{item.totalRequests.toLocaleString()}</TableCell>
-                          <TableCell className="text-right">{item.compliantRequests.toLocaleString()}</TableCell>
-                          <TableCell className="text-right">{item.exceedingRequests.toLocaleString()}</TableCell>
+                          <TableCell className="text-right">{item.totalRequests.toLocaleString(undefined, {maximumFractionDigits: 2, minimumFractionDigits: 0})}</TableCell>
+                          <TableCell className="text-right">{item.compliantRequests.toLocaleString(undefined, {maximumFractionDigits: 2, minimumFractionDigits: 0})}</TableCell>
+                          <TableCell className="text-right">{item.exceedingRequests.toLocaleString(undefined, {maximumFractionDigits: 2, minimumFractionDigits: 0})}</TableCell>
                         </TableRow>
                       ))}
                     </TableBody>
@@ -371,14 +371,14 @@ function App() {
                                   <div className="w-2 h-2 rounded-full bg-[#10b981]" />
                                   <span>Compliant:</span>
                                 </div>
-                                <div className="text-right">{compliant}</div>
+                                <div className="text-right">{Number(compliant).toLocaleString(undefined, {maximumFractionDigits: 2, minimumFractionDigits: 0})}</div>
                                 <div className="flex items-center gap-1.5">
                                   <div className="w-2 h-2 rounded-full bg-[#ef4444]" />
                                   <span>Exceeding:</span>
                                 </div>
-                                <div className="text-right">{exceeding}</div>
+                                <div className="text-right">{Number(exceeding).toLocaleString(undefined, {maximumFractionDigits: 2, minimumFractionDigits: 0})}</div>
                                 <div className="font-medium">Total:</div>
-                                <div className="text-right font-medium">{total}</div>
+                                <div className="text-right font-medium">{Number(total).toLocaleString(undefined, {maximumFractionDigits: 2, minimumFractionDigits: 0})}</div>
                               </div>
                             </div>
                           </div>
@@ -449,7 +449,7 @@ function App() {
                                     />
                                     <span>{entry.name}:</span>
                                   </div>
-                                  <div className="font-medium">{entry.value}</div>
+                                  <div className="font-medium">{Number(entry.value).toLocaleString(undefined, {maximumFractionDigits: 2, minimumFractionDigits: 0})}</div>
                                 </div>
                               ))}
                             </div>

src/lib/utils.ts

@@ -46,7 +46,7 @@ export function parseCSV(csv: string): CopilotUsageData[] {
       timestamp: new Date(values[0]),
       user: values[1],
       model: values[2],
-      requestsUsed: parseInt(values[3], 10),
+      requestsUsed: parseFloat(values[3]),
       exceedsQuota: values[4].toLowerCase() === "true",
       totalMonthlyQuota: values[5],
     };

src/prd.md

@@ -30,9 +30,9 @@
    - Success: Clearly shows trends over time and distinguishes between quota-compliant and exceeding requests
 
 3. **Data Processing**
-   - What: Transform raw CSV data into aggregated daily metrics by model
-   - Why: Converts raw timestamp data into meaningful daily summaries
-   - Success: Correctly groups and counts requests by day, model, and quota status
+   - What: Transform raw CSV data into aggregated daily metrics by model, correctly handling decimal request values
+   - Why: Converts raw timestamp data into meaningful daily summaries, ensuring accurate representation of fractional requests
+   - Success: Correctly groups and counts requests by day, model, and quota status, properly parsing and displaying decimal values
 
 4. **Model Usage Statistics**
    - What: Display detailed model usage statistics in tabular format
@@ -108,8 +108,8 @@
 - **Chart Accessibility**: Multiple visual cues beyond color (patterns or labels) to distinguish data series
 
 ## Edge Cases & Problem Scenarios
-- **Potential Obstacles**: Malformed CSV files, very large datasets
-- **Edge Case Handling**: Validation messaging for incorrect file formats, graceful handling of parsing errors
+- **Potential Obstacles**: Malformed CSV files, very large datasets, fractional request values
+- **Edge Case Handling**: Validation messaging for incorrect file formats, graceful handling of parsing errors, proper display of decimal values
 - **Technical Constraints**: Browser-based CSV parsing limitations
 
 ## Implementation Considerations