ignore: zen

cloud/app/src/component/workspace/payment-section.tsx

@@ -19,9 +19,44 @@ const downloadReceipt = action(async (workspaceID: string, paymentID: string) =>
 
 export function PaymentSection() {
   const params = useParams()
+  // ORIGINAL CODE - COMMENTED OUT FOR TESTING
   const payments = createAsync(() => getPaymentsInfo(params.id))
   const downloadReceiptAction = useAction(downloadReceipt)
 
+  // DUMMY DATA FOR TESTING
+  // const payments = () => [
+  //   {
+  //     id: "pi_3QK1x2FT9vXn4A6r1234567890",
+  //     paymentID: "pi_3QK1x2FT9vXn4A6r1234567890",
+  //     timeCreated: new Date(Date.now() - 86400000 * 1).toISOString(), // 1 day ago
+  //     amount: 2100000000, // $21.00 ($20 + $1 fee)
+  //   },
+  //   {
+  //     id: "pi_3QJ8k7FT9vXn4A6r0987654321",
+  //     paymentID: "pi_3QJ8k7FT9vXn4A6r0987654321",
+  //     timeCreated: new Date(Date.now() - 86400000 * 15).toISOString(), // 15 days ago
+  //     amount: 2100000000, // $21.00
+  //   },
+  //   {
+  //     id: "pi_3QI5m1FT9vXn4A6r5678901234",
+  //     paymentID: "pi_3QI5m1FT9vXn4A6r5678901234",
+  //     timeCreated: new Date(Date.now() - 86400000 * 32).toISOString(), // 32 days ago
+  //     amount: 2100000000, // $21.00
+  //   },
+  //   {
+  //     id: "pi_3QH2n9FT9vXn4A6r3456789012",
+  //     paymentID: "pi_3QH2n9FT9vXn4A6r3456789012",
+  //     timeCreated: new Date(Date.now() - 86400000 * 47).toISOString(), // 47 days ago
+  //     amount: 2100000000, // $21.00
+  //   },
+  //   {
+  //     id: "pi_3QG7p4FT9vXn4A6r7890123456",
+  //     paymentID: "pi_3QG7p4FT9vXn4A6r7890123456",
+  //     timeCreated: new Date(Date.now() - 86400000 * 63).toISOString(), // 63 days ago
+  //     amount: 2100000000, // $21.00
+  //   },
+  // ]
+
   return (
     payments() &&
     payments()!.length > 0 && (

cloud/app/src/component/workspace/usage-section.tsx

@@ -14,8 +14,69 @@ const getUsageInfo = query(async (workspaceID: string) => {
 
 export function UsageSection() {
   const params = useParams()
+  // ORIGINAL CODE - COMMENTED OUT FOR TESTING
   const usage = createAsync(() => getUsageInfo(params.id))
 
+  // DUMMY DATA FOR TESTING
+  // const usage = () => [
+  //   {
+  //     timeCreated: new Date(Date.now() - 86400000 * 0).toISOString(), // Today
+  //     model: "claude-3-5-sonnet-20241022",
+  //     inputTokens: 1247,
+  //     outputTokens: 423,
+  //     cost: 125400000, // $1.254
+  //   },
+  //   {
+  //     timeCreated: new Date(Date.now() - 86400000 * 0.5).toISOString(), // 12 hours ago
+  //     model: "claude-3-haiku-20240307",
+  //     inputTokens: 892,
+  //     outputTokens: 156,
+  //     cost: 23500000, // $0.235
+  //   },
+  //   {
+  //     timeCreated: new Date(Date.now() - 86400000 * 1).toISOString(), // Yesterday
+  //     model: "claude-3-5-sonnet-20241022",
+  //     inputTokens: 2134,
+  //     outputTokens: 687,
+  //     cost: 234700000, // $2.347
+  //   },
+  //   {
+  //     timeCreated: new Date(Date.now() - 86400000 * 1.3).toISOString(), // 1.3 days ago
+  //     model: "gpt-4o-mini",
+  //     inputTokens: 567,
+  //     outputTokens: 234,
+  //     cost: 8900000, // $0.089
+  //   },
+  //   {
+  //     timeCreated: new Date(Date.now() - 86400000 * 2).toISOString(), // 2 days ago
+  //     model: "claude-3-opus-20240229",
+  //     inputTokens: 1893,
+  //     outputTokens: 945,
+  //     cost: 445600000, // $4.456
+  //   },
+  //   {
+  //     timeCreated: new Date(Date.now() - 86400000 * 2.7).toISOString(), // 2.7 days ago
+  //     model: "gpt-4o",
+  //     inputTokens: 1456,
+  //     outputTokens: 532,
+  //     cost: 156800000, // $1.568
+  //   },
+  //   {
+  //     timeCreated: new Date(Date.now() - 86400000 * 3).toISOString(), // 3 days ago
+  //     model: "claude-3-haiku-20240307",
+  //     inputTokens: 634,
+  //     outputTokens: 89,
+  //     cost: 12300000, // $0.123
+  //   },
+  //   {
+  //     timeCreated: new Date(Date.now() - 86400000 * 4).toISOString(), // 4 days ago
+  //     model: "claude-3-5-sonnet-20241022",
+  //     inputTokens: 3245,
+  //     outputTokens: 1123,
+  //     cost: 387200000, // $3.872
+  //   },
+  // ]
+
   return (
     <section class={styles.root}>
       <div data-slot="section-title">