@littlebearapps/platform-admin-sdk 2.0.0 → 2.2.0

package/templates/shared/dashboard/src/components/usage/transformers.ts

@@ -0,0 +1,478 @@
+/**
+ * Usage Data Transformers
+ *
+ * Functions to transform API response data into component formats.
+ * Part of task-17.9 (Restructure page layout).
+ */
+
+import type { UnifiedResource, ResourceType, ResourceStatus } from './types';
+import { CF_PRICING } from '../../lib/cloudflare/costs';
+
+/**
+ * Transform API usage data into UnifiedResource array for the table.
+ * Consolidates all resource types (workers, D1, KV, R2, etc.) into a single list.
+ */
+export function transformToUnifiedResources(
+  data: {
+    workers?: Array<{
+      scriptName: string;
+      requests: number;
+      cpuTime: number;
+      duration: number;
+      errors: number;
+    }>;
+    d1?: Array<{
+      databaseId: string;
+      databaseName: string;
+      rowsRead: number;
+      rowsWritten: number;
+      queryCount: number;
+    }>;
+    kv?: Array<{
+      namespaceId: string;
+      namespaceName: string;
+      reads: number;
+      writes: number;
+      deletes: number;
+      lists: number;
+    }>;
+    r2?: Array<{
+      bucketName: string;
+      storageBytes: number;
+      objectCount: number;
+      classAOperations: number;
+      classBOperations: number;
+    }>;
+    vectorize?: Array<{
+      id: string;
+      name: string;
+      vectorCount: number;
+      dimensions: number;
+    }>;
+    pages?: Array<{
+      projectName: string;
+      deployments: number;
+      requests: number;
+      bandwidth: number;
+    }>;
+    durableObjects?: Array<{
+      name: string;
+      requests: number;
+      duration: number;
+      storageBytes: number;
+    }>;
+    aiGateway?: {
+      totalRequests: number;
+      totalTokens: number;
+      cachedRequests: number;
+      modelBreakdown: Array<{
+        model: string;
+        requests: number;
+        tokens: number;
+      }>;
+    };
+  },
+  costs: {
+    workers: number;
+    d1: number;
+    kv: number;
+    r2: number;
+    vectorize: number;
+    pages: number;
+    queues: number;
+    workflows: number;
+    durableObjects: number;
+    aiGateway: number;
+    total: number;
+  },
+  projectMapping: (name: string) => string
+): UnifiedResource[] {
+  const resources: UnifiedResource[] = [];
+
+  // Transform Workers - calculate cost based on actual requests and CPU time
+  if (data.workers) {
+    for (const worker of data.workers) {
+      // Workers pricing: $0.30 per million requests + $0.02 per million CPU ms
+      // Note: $5/mo base cost is account-level, not per-worker
+      const requestCost = (worker.requests / 1_000_000) * CF_PRICING.workers.requestsPerMillion;
+      const cpuCost = (worker.cpuTime / 1_000_000) * CF_PRICING.workers.cpuMsPerMillion;
+      const costPerWorker = requestCost + cpuCost;
+      resources.push({
+        id: `worker-${worker.scriptName}`,
+        name: worker.scriptName,
+        type: 'worker' as ResourceType,
+        project: projectMapping(worker.scriptName),
+        usage: {
+          value: worker.requests,
+          unit: 'requests',
+          formatted: formatNumber(worker.requests),
+        },
+        costCurrent: costPerWorker,
+        costPrior: 0, // Will be filled by comparison data
+        costDelta: 0,
+        costDeltaPct: null,
+        status: getStatusFromThreshold(worker.errors, worker.requests),
+      });
+    }
+  }
+
+  // Transform D1 databases - calculate cost based on actual rowsRead/rowsWritten
+  if (data.d1) {
+    for (const db of data.d1) {
+      // D1 pricing: $0.001 per billion rows read + $1.00 per million rows written
+      const costPerDb =
+        (db.rowsRead / 1_000_000_000) * CF_PRICING.d1.rowsReadPerBillion +
+        (db.rowsWritten / 1_000_000) * CF_PRICING.d1.rowsWrittenPerMillion;
+      resources.push({
+        id: `d1-${db.databaseId}`,
+        name: db.databaseName || db.databaseId,
+        type: 'd1' as ResourceType,
+        project: projectMapping(db.databaseName || db.databaseId),
+        usage: {
+          value: db.rowsRead,
+          unit: 'rows read',
+          formatted: formatNumber(db.rowsRead),
+        },
+        costCurrent: costPerDb,
+        costPrior: 0,
+        costDelta: 0,
+        costDeltaPct: null,
+        status: 'healthy' as ResourceStatus,
+      });
+    }
+  }
+
+  // Transform KV namespaces - calculate cost based on actual reads/writes/deletes/lists
+  if (data.kv) {
+    for (const kv of data.kv) {
+      // KV pricing: $0.50/M reads + $5.00/M writes + $5.00/M deletes + $5.00/M lists
+      const costPerKv =
+        (kv.reads / 1_000_000) * CF_PRICING.kv.readsPerMillion +
+        (kv.writes / 1_000_000) * CF_PRICING.kv.writesPerMillion +
+        (kv.deletes / 1_000_000) * CF_PRICING.kv.deletesPerMillion +
+        (kv.lists / 1_000_000) * CF_PRICING.kv.listsPerMillion;
+      const totalOps = kv.reads + kv.writes + kv.deletes + kv.lists;
+      resources.push({
+        id: `kv-${kv.namespaceId}`,
+        name: kv.namespaceName || kv.namespaceId,
+        type: 'kv' as ResourceType,
+        project: projectMapping(kv.namespaceName || kv.namespaceId),
+        usage: {
+          value: totalOps,
+          unit: 'operations',
+          formatted: formatNumber(totalOps),
+        },
+        costCurrent: costPerKv,
+        costPrior: 0,
+        costDelta: 0,
+        costDeltaPct: null,
+        status: 'healthy' as ResourceStatus,
+      });
+    }
+  }
+
+  // Transform R2 buckets - calculate cost based on actual storage and operations
+  if (data.r2) {
+    for (const bucket of data.r2) {
+      // R2 pricing: $0.015/GB storage + $4.50/M Class A ops + $0.36/M Class B ops
+      // Note: Cloudflare uses decimal GB (1 GB = 1,000,000,000 bytes) for billing
+      const costPerBucket =
+        (bucket.storageBytes / 1_000_000_000) * CF_PRICING.r2.storagePerGbMonth +
+        (bucket.classAOperations / 1_000_000) * CF_PRICING.r2.classAPerMillion +
+        (bucket.classBOperations / 1_000_000) * CF_PRICING.r2.classBPerMillion;
+      resources.push({
+        id: `r2-${bucket.bucketName}`,
+        name: bucket.bucketName,
+        type: 'r2' as ResourceType,
+        project: projectMapping(bucket.bucketName),
+        usage: {
+          value: bucket.storageBytes,
+          unit: 'storage',
+          formatted: formatBytes(bucket.storageBytes),
+        },
+        costCurrent: costPerBucket,
+        costPrior: 0,
+        costDelta: 0,
+        costDeltaPct: null,
+        status: 'healthy' as ResourceStatus,
+      });
+    }
+  }
+
+  // Transform Vectorize indexes - calculate cost based on actual dimensions stored
+  if (data.vectorize) {
+    for (const index of data.vectorize) {
+      // Vectorize pricing: $0.01 per million stored dimensions
+      const storedDimensions = index.vectorCount * index.dimensions;
+      const costPerIndex =
+        (storedDimensions / 1_000_000) * CF_PRICING.vectorize.storedDimensionsPerMillion;
+      resources.push({
+        id: `vectorize-${index.id}`,
+        name: index.name || index.id,
+        type: 'vectorize' as ResourceType,
+        project: projectMapping(index.name || index.id),
+        usage: {
+          value: index.vectorCount,
+          unit: 'vectors',
+          formatted: formatNumber(index.vectorCount),
+        },
+        costCurrent: costPerIndex,
+        costPrior: 0,
+        costDelta: 0,
+        costDeltaPct: null,
+        status: 'healthy' as ResourceStatus,
+      });
+    }
+  }
+
+  // Transform Pages projects - calculate cost based on deployments and bandwidth
+  if (data.pages) {
+    for (const page of data.pages) {
+      // Pages pricing: $0.15 per build after 500 free + $0.02 per GB bandwidth
+      // Note: First 500 builds/month are free - assuming passed in usage is billable
+      // Note: Cloudflare uses decimal GB (1 GB = 1,000,000,000 bytes) for billing
+      const buildCost = page.deployments * CF_PRICING.pages.buildCost;
+      const bandwidthCost = (page.bandwidth / 1_000_000_000) * CF_PRICING.pages.bandwidthPerGb;
+      const costPerPage = buildCost + bandwidthCost;
+      resources.push({
+        id: `pages-${page.projectName}`,
+        name: page.projectName,
+        type: 'pages' as ResourceType,
+        project: projectMapping(page.projectName),
+        usage: {
+          value: page.requests,
+          unit: 'requests',
+          formatted: formatNumber(page.requests),
+        },
+        costCurrent: costPerPage,
+        costPrior: 0,
+        costDelta: 0,
+        costDeltaPct: null,
+        status: 'healthy' as ResourceStatus,
+      });
+    }
+  }
+
+  // Transform Durable Objects - calculate cost based on requests, duration, storage
+  if (data.durableObjects) {
+    for (const obj of data.durableObjects) {
+      // DO pricing: $0.15/M requests + $12.50/M GB-seconds + $0.20/GB storage
+      // Note: Cloudflare uses decimal GB (1 GB = 1,000,000,000 bytes) for billing
+      const requestCost = (obj.requests / 1_000_000) * CF_PRICING.durableObjects.requestsPerMillion;
+      const durationCost =
+        (obj.duration / 1_000_000) * CF_PRICING.durableObjects.gbSecondsPerMillion;
+      const storageCost =
+        (obj.storageBytes / 1_000_000_000) * CF_PRICING.durableObjects.storagePerGbMonth;
+      const costPerObj = requestCost + durationCost + storageCost;
+      resources.push({
+        id: `do-${obj.name}`,
+        name: obj.name,
+        type: 'do' as ResourceType,
+        project: projectMapping(obj.name),
+        usage: {
+          value: obj.requests,
+          unit: 'requests',
+          formatted: formatNumber(obj.requests),
+        },
+        costCurrent: costPerObj,
+        costPrior: 0,
+        costDelta: 0,
+        costDeltaPct: null,
+        status: 'healthy' as ResourceStatus,
+      });
+    }
+  }
+
+  // Transform AI Gateway (single entry)
+  if (data.aiGateway && data.aiGateway.totalRequests > 0) {
+    resources.push({
+      id: 'ai-gateway-main',
+      name: 'AI Gateway',
+      type: 'ai-gateway' as ResourceType,
+      project: 'platform', // AI Gateway project attribution
+      usage: {
+        value: data.aiGateway.totalTokens,
+        unit: 'tokens',
+        formatted: formatNumber(data.aiGateway.totalTokens),
+      },
+      costCurrent: costs.aiGateway,
+      costPrior: 0,
+      costDelta: 0,
+      costDeltaPct: null,
+      status: 'healthy' as ResourceStatus,
+    });
+  }
+
+  return resources;
+}
+
+/**
+ * Apply comparison data to resources.
+ * Updates costPrior, costDelta, and costDeltaPct for each resource.
+ */
+export function applyComparisonData(
+  resources: UnifiedResource[],
+  priorResources: UnifiedResource[]
+): UnifiedResource[] {
+  const priorMap = new Map(priorResources.map((r) => [r.id, r]));
+
+  return resources.map((resource) => {
+    const prior = priorMap.get(resource.id);
+
+    if (!prior) {
+      // New resource - mark as NEW
+      return {
+        ...resource,
+        costDeltaPct: 'NEW' as const,
+      };
+    }
+
+    const costDelta = resource.costCurrent - prior.costCurrent;
+    // Use $0.01 threshold to avoid extreme percentages from near-zero baselines
+    // Cap at 999% for display sanity
+    const costDeltaPct =
+      prior.costCurrent >= 0.01
+        ? Math.min((costDelta / prior.costCurrent) * 100, 999)
+        : resource.costCurrent > 0
+          ? 'NEW'
+          : 0;
+
+    return {
+      ...resource,
+      costPrior: prior.costCurrent,
+      costDelta,
+      costDeltaPct:
+        typeof costDeltaPct === 'number' ? Math.round(costDeltaPct * 10) / 10 : costDeltaPct,
+    };
+  });
+}
+
+/**
+ * Filter resources based on filter state.
+ */
+export function filterResources(
+  resources: UnifiedResource[],
+  filters: {
+    project?: string;
+    serviceTypes?: string[];
+    searchQuery?: string;
+    onlyChanged?: boolean;
+    nonZeroCost?: boolean;
+  }
+): UnifiedResource[] {
+  return resources.filter((resource) => {
+    // Project filter
+    if (filters.project && filters.project !== 'all' && resource.project !== filters.project) {
+      return false;
+    }
+
+    // Service type filter
+    if (filters.serviceTypes && filters.serviceTypes.length > 0) {
+      if (!filters.serviceTypes.includes(resource.type)) {
+        return false;
+      }
+    }
+
+    // Search query filter
+    if (filters.searchQuery) {
+      const query = filters.searchQuery.toLowerCase();
+      if (!resource.name.toLowerCase().includes(query)) {
+        return false;
+      }
+    }
+
+    // Only changed filter (>5% change or NEW)
+    if (filters.onlyChanged) {
+      if (resource.costDeltaPct === 'NEW') return true;
+      if (typeof resource.costDeltaPct !== 'number') return false;
+      if (Math.abs(resource.costDeltaPct) <= 5) return false;
+    }
+
+    // Non-zero cost filter
+    if (filters.nonZeroCost && resource.costCurrent === 0) {
+      return false;
+    }
+
+    return true;
+  });
+}
+
+/**
+ * Sort resources by column.
+ */
+export function sortResources(
+  resources: UnifiedResource[],
+  column: string,
+  direction: 'asc' | 'desc'
+): UnifiedResource[] {
+  const sorted = [...resources].sort((a, b) => {
+    let comparison = 0;
+
+    switch (column) {
+      case 'name':
+        comparison = a.name.localeCompare(b.name);
+        break;
+      case 'type':
+        comparison = a.type.localeCompare(b.type);
+        break;
+      case 'project':
+        comparison = a.project.localeCompare(b.project);
+        break;
+      case 'usage':
+        comparison = a.usage.value - b.usage.value;
+        break;
+      case 'costCurrent':
+        comparison = a.costCurrent - b.costCurrent;
+        break;
+      case 'costDeltaPct': {
+        const aPct = a.costDeltaPct === 'NEW' ? Infinity : (a.costDeltaPct ?? -Infinity);
+        const bPct = b.costDeltaPct === 'NEW' ? Infinity : (b.costDeltaPct ?? -Infinity);
+        comparison = aPct - bPct;
+        break;
+      }
+      case 'status': {
+        const statusOrder = { critical: 4, high: 3, warning: 2, healthy: 1 };
+        comparison = statusOrder[a.status] - statusOrder[b.status];
+        break;
+      }
+      default:
+        comparison = 0;
+    }
+
+    return direction === 'asc' ? comparison : -comparison;
+  });
+
+  return sorted;
+}
+
+// Helper functions
+function formatNumber(num: number): string {
+  if (num === undefined || num === null || isNaN(num)) return '0';
+  if (num >= 1_000_000_000) return `${(num / 1_000_000_000).toFixed(2)}B`;
+  if (num >= 1_000_000) return `${(num / 1_000_000).toFixed(2)}M`;
+  if (num >= 1_000) return `${(num / 1_000).toFixed(1)}K`;
+  return num.toLocaleString();
+}
+
+/**
+ * Format bytes to human-readable string using decimal (SI) units.
+ *
+ * IMPORTANT: Uses decimal (SI) units because Cloudflare bills in decimal GB:
+ * - 1 GB = 1,000,000,000 bytes (decimal/SI - used for billing)
+ * - 1 GiB = 1,073,741,824 bytes (binary - NOT used by Cloudflare)
+ */
+function formatBytes(bytes: number): string {
+  if (bytes >= 1_000_000_000) return `${(bytes / 1_000_000_000).toFixed(2)} GB`;
+  if (bytes >= 1_000_000) return `${(bytes / 1_000_000).toFixed(2)} MB`;
+  if (bytes >= 1_000) return `${(bytes / 1_000).toFixed(2)} KB`;
+  return `${bytes} B`;
+}
+
+function getStatusFromThreshold(errors: number, requests: number): ResourceStatus {
+  if (requests === 0) return 'healthy';
+  const errorRate = (errors / requests) * 100;
+  if (errorRate >= 10) return 'critical';
+  if (errorRate >= 5) return 'high';
+  if (errorRate >= 1) return 'warning';
+  return 'healthy';
+}