Yields (SDK)

const yields = await pan.yields.getAll();

console.log('Mejor APY:', yields.best.apy, '%');
console.log('En chain:', yields.best.chain);

interface YieldsResponse {
  rates: Rate[];
  best: {
    chain: string;
    asset: string;
    apy: number;
    reasoning: string;
  };
}

interface Rate {
  chain: string;
  protocol: string;
  asset: string;
  apy: number;
}

const { rates, best } = await pan.yields.getAll();

// Ordenar por APY
const sorted = [...rates].sort((a, b) => b.apy - a.apy);

sorted.forEach(y => {
  const isBest = y.chain === best.chain ? ' (MEJOR)' : '';
  console.log(`${y.chain}: ${y.apy.toFixed(2)}%${isBest}`);
});

function getRateForChain(yields: YieldsResponse, chain: string): Rate | undefined {
  return yields.rates.find(y => y.chain === chain);
}

const baseRate = getRateForChain(yields, 'base');
console.log('Base APY:', baseRate?.apy);

function calculateEarnings(
  amount: number,
  apy: number,
  days: number
): { finalAmount: number; earnings: number } {
  const dailyRate = apy / 365 / 100;
  const finalAmount = amount * Math.pow(1 + dailyRate, days);
  const earnings = finalAmount - amount;

  return { finalAmount, earnings };
}

// Uso
const { earnings } = calculateEarnings(1000, 8.52, 365);
console.log('Ganancia anual:', earnings.toFixed(2)); // ~88.97

import { useState, useEffect, useCallback } from 'react';
import { usePan } from './usePan';
import type { YieldsResponse } from '@pan/sdk';

interface UseYieldsOptions {
  autoRefresh?: boolean;
  refreshInterval?: number;
}

export function useYields(options: UseYieldsOptions = {}) {
  const { autoRefresh = false, refreshInterval = 300000 } = options; // 5 min default
  const pan = usePan();

  const [yields, setYields] = useState<YieldsResponse | null>(null);
  const [loading, setLoading] = useState(true);
  const [error, setError] = useState<Error | null>(null);

  const fetch = useCallback(async () => {
    try {
      const data = await pan.yields.getAll();
      setYields(data);
      setError(null);
    } catch (err) {
      setError(err);
    } finally {
      setLoading(false);
    }
  }, [pan]);

  useEffect(() => {
    fetch();
  }, [fetch]);

  useEffect(() => {
    if (!autoRefresh) return;

    const timer = setInterval(fetch, refreshInterval);
    return () => clearInterval(timer);
  }, [autoRefresh, refreshInterval, fetch]);

  return {
    rates: yields?.rates || [],
    best: yields?.best,
    loading,
    error,
    refresh: fetch
  };
}

// Uso
function YieldsDisplay() {
  const { rates, best, loading } = useYields({ autoRefresh: true });

  if (loading) return <div>Cargando yields...</div>;

  return (
    <div>
      {best && (
        <div className="best-yield">
          Mejor: {best.apy.toFixed(2)}% en {best.chain}
        </div>
      )}

      <table>
        <thead>
          <tr>
            <th>Chain</th>
            <th>APY</th>
          </tr>
        </thead>
        <tbody>
          {rates.map(y => (
            <tr key={y.chain}>
              <td>{y.chain}</td>
              <td>{y.apy.toFixed(2)}%</td>
            </tr>
          ))}
        </tbody>
      </table>
    </div>
  );
}