Cost Visibility & Optimization

# OpenCost deployment (Helm)
# helm repo add opencost https://opencost.github.io/opencost-helm-chart
# helm install opencost opencost/opencost -n opencost --create-namespace

# Prometheus scrape config for OpenCost
apiVersion: monitoring.coreos.com/v1
kind: ServiceMonitor
metadata:
  name: opencost
  namespace: monitoring
spec:
  selector:
    matchLabels:
      app: opencost
  endpoints:
    - port: metrics
      interval: 30s
      path: /metrics

# PrometheusRule for cost alerts
apiVersion: monitoring.coreos.com/v1
kind: PrometheusRule
metadata:
  name: opencost-alerts
  namespace: monitoring
spec:
  groups:
    - name: opencost
      rules:
        - alert: TeamCostBudgetExceeded
          expr: |
            sum by (team) (opencost_allocation_total_cost{team!=""}) 
            > 
            sum by (team) (opencost_budget_monthly{team!=""}) * 0.8
          for: 1h
          labels:
            severity: warning
            team: platform
          annotations:
            summary: "Team {{ $labels.team }} exceeded 80% of monthly budget"
            description: "Current spend: {{ $value | humanizeCurrency }}. Budget: {{ $labels.budget | humanizeCurrency }}."
            runbook_url: "https://runbooks.platform.example.com/cost-budget-exceeded"

# opencost-config.yaml
apiVersion: v1
kind: ConfigMap
metadata:
  name: opencost-config
  namespace: opencost
data:
  opencost.cfg: |
    # Allocation configuration
    allocation:
      # Shared cost allocation strategy
      sharedCostAllocation:
        # Proportional to resource requests
        cpu: "request"
        memory: "request"
        # Or equal split
        # cpu: "equal"
        # memory: "equal"
      
      # Label to use for team allocation
      teamLabel: "platform.example.com/team"
      
      # Namespace to team mapping (for namespaces without team label)
      namespaceLabels:
        platform-system: "platform"
        monitoring: "platform"
        ingress-nginx: "platform"
        argocd: "platform"
      
      # Custom allocation weights (optional)
      customAllocations:
        - name: "ingress-shared"
          label: "platform.example.com/ingress-class"
          weight: 0.5
        - name: "monitoring-shared"
          label: "platform.example.com/monitoring-enabled"
          weight: 0.3

    # Pricing configuration
    pricing:
      # Use cloud provider pricing API
      provider: "aws"  # or gcp, azure, custom
      # Or custom pricing sheet
      # customPricing:
      #   cpuHourly: 0.03
      #   memoryGiBHourly: 0.004
      #   storageGiBMonthly: 0.10
      #   loadBalancerHourly: 0.025
      #   pvHourly: 0.0001

    # Budget configuration
    budgets:
      - team: "payments"
        monthlyLimit: 5000
        currency: "USD"
        alertThresholds: [0.5, 0.75, 0.9, 1.0]
      - team: "identity"
        monthlyLimit: 3000
        currency: "USD"
        alertThresholds: [0.5, 0.75, 0.9, 1.0]
      - team: "platform"
        monthlyLimit: 10000
        currency: "USD"
        alertThresholds: [0.5, 0.75, 0.9, 1.0]

# VPA for a deployment
apiVersion: autoscaling.k8s.io/v1
kind: VerticalPodAutoscaler
metadata:
  name: payment-api-vpa
  namespace: payments-payment-api
spec:
  targetRef:
    apiVersion: "apps/v1"
    kind: Deployment
    name: payment-api
  updatePolicy:
    updateMode: "Auto"  # Or "Initial" for recommendations only
  resourcePolicy:
    containerPolicies:
      - containerName: payment-api
        minAllowed:
          cpu: "50m"
          memory: "64Mi"
        maxAllowed:
          cpu: "2000m"
          memory: "4Gi"
        controlledResources: ["cpu", "memory"]
        controlledValues: RequestsAndLimits

---
# Goldilocks deployment (visualizes VPA recommendations)
apiVersion: apps/v1
kind: Deployment
metadata:
  name: goldilocks
  namespace: goldilocks
spec:
  replicas: 1
  selector:
    matchLabels:
      app: goldilocks
  template:
    metadata:
      labels:
        app: goldilocks
    spec:
      containers:
        - name: goldilocks
          image: fairwinds/goldilocks:v5.0.0
          ports:
            - containerPort: 8080
          env:
            - name: LABEL_SELECTOR
              value: "platform.example.com/managed-by=platform-controller"
            - name: NAMESPACE
              valueFrom:
                fieldRef:
                  fieldPath: metadata.namespace
          args:
            - "--disable-vpa-creation"
            - "--vpa-namespace=all"
          resources:
            requests:
              cpu: "50m"
              memory: "64Mi"
            limits:
              cpu: "200m"
              memory: "256Mi"

// components/CostWidget.tsx
interface CostWidgetProps {
  entityRef: string; // e.g., "component:payments/payment-api"
}

export const CostWidget: React.FC<CostWidgetProps> = ({ entityRef }) => {
  const { data: costData } = useQuery({
    queryKey: ['cost', entityRef],
    queryFn: () => fetchCostData(entityRef),
    refetchInterval: 5 * 60 * 1000, // 5 min
  });

  const { data: budgetData } = useQuery({
    queryKey: ['budget', entityRef],
    queryFn: () => fetchBudgetData(entityRef),
  });

  if (!costData) return <Skeleton />;

  const burnRate = budgetData ? costData.monthly / budgetData.monthlyLimit : 0;
  const isOverBudget = burnRate > 1;
  const isWarning = burnRate > 0.8;

  return (
    <Card className={isOverBudget ? 'border-red-500' : isWarning ? 'border-yellow-500' : ''}>
      <CardHeader>
        <div className="flex items-center justify-between">
          <CardTitle>Monthly Cost</CardTitle>
          <Badge variant={isOverBudget ? 'destructive' : isWarning ? 'warning' : 'default'}>
            {burnRate > 1 ? 'OVER BUDGET' : burnRate > 0.8 ? 'WARNING' : 'ON TRACK'}
          </Badge>
        </div>
      </CardHeader>
      <CardContent>
        <div className="text-3xl font-bold text-primary">
          ${costData.monthly.toLocaleString()}
        </div>
        <div className="text-sm text-muted-foreground">
          ${costData.daily.toFixed(2)}/day • ${costData.monthly.toLocaleString()}/month projected
        </div>
        
        <Progress value={Math.min(burnRate * 100, 100)} className="mt-4 h-2" 
          className={isOverBudget ? 'bg-red-500' : isWarning ? 'bg-yellow-500' : 'bg-green-500'} />
        
        <div className="flex justify-between text-xs text-muted-foreground mt-1">
          <span>$0</span>
          <span>${budgetData?.monthlyLimit.toLocaleString() || 'N/A'}/mo</span>
        </div>

        <div className="mt-4 grid grid-cols-3 gap-4 text-sm">
          <div>
            <div className="text-muted-foreground">Compute</div>
            <div className="font-medium">${costData.breakdown.compute.toLocaleString()}</div>
          </div>
          <div>
            <div className="text-muted-foreground">Storage</div>
            <div className="font-medium">${costData.breakdown.storage.toLocaleString()}</div>
          </div>
          <div>
            <div className="text-muted-foreground">Network</div>
            <div className="font-medium">${costData.breakdown.network.toLocaleString()}</div>
          </div>
        </div>

        {costData.recommendations.length > 0 && (
          <div className="mt-4 p-3 bg-yellow-50 rounded-lg">
            <div className="font-medium text-yellow-800 mb-2">💡 Optimization Opportunities</div>
            <ul className="text-sm text-yellow-700 space-y-1">
              {costData.recommendations.map((rec, i) => (
                <li key={i} className="flex items-center gap-2">
                  <span className="text-yellow-600">{rec.icon}</span>
                  <span>{rec.description}</span>
                  <span className="ml-auto text-xs text-yellow-600">
                    Save ~${rec.monthlySavings}/mo
                  </span>
                </li>
              ))}
            </ul>
          </div>
        )}
      </CardContent>
    </Card>
  );
};