Update Subscription Plan

curl -X POST "https://api.devkit4ai.com/api/v1/payments/stripe/update-subscription?test_mode=true" \
  -H "Authorization: Bearer {end_user_jwt}" \
  -H "Content-Type: application/json" \
  -d '{
    "new_price_id": "price_1XYZ789abc123",
    "proration_behavior": "create_prorations"
  }'

{
  "subscription_id": "sub_1ABC123def456",
  "status": "active",
  "price_id": "price_1XYZ789abc123",
  "message": "Subscription updated to new plan successfully."
}

// Plan upgrade/downgrade component
function ChangePlanModal({ currentPriceId, plans }) {
  const [selectedPlan, setSelectedPlan] = useState(currentPriceId);
  const [loading, setLoading] = useState(false);

  const handleChangePlan = async () => {
    if (selectedPlan === currentPriceId) return;
    
    setLoading(true);
    try {
      const response = await fetch('/api/update-subscription', {
        method: 'POST',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify({
          new_price_id: selectedPlan,
          proration_behavior: 'create_prorations'
        })
      });
      
      const result = await response.json();
      showToast(result.message);
      closeModal();
      refreshSubscriptionStatus();
    } catch (error) {
      showError('Failed to update plan');
    } finally {
      setLoading(false);
    }
  };

  return (
    <div>
      <h2>Change Your Plan</h2>
      {plans.map(plan => (
        <PlanCard
          key={plan.price_id}
          plan={plan}
          selected={selectedPlan === plan.price_id}
          current={currentPriceId === plan.price_id}
          onSelect={() => setSelectedPlan(plan.price_id)}
        />
      ))}
      <button onClick={handleChangePlan} disabled={loading}>
        {loading ? 'Updating...' : 'Confirm Change'}
      </button>
    </div>
  );
}