Quick Start

npm install @stakefy/sdk
# or
yarn add @stakefy/sdk
# or
bun add @stakefy/sdk

// app.js or _app.js
import { StakefyProvider } from '@stakefy/sdk';

function App() {
  return (
    <StakefyProvider
      apiKey={process.env.NEXT_PUBLIC_STAKEFY_API_KEY}
      network="mainnet-beta" // or "devnet" for testing
      config={{
        autoConnect: true,
        theme: 'dark'
      }}
    >
      <YourApp />
    </StakefyProvider>
  );
}

// SubscriptionPage.jsx
import { StakePay } from '@stakefy/sdk';

function SubscriptionPage() {
  const handleSuccess = (result) => {
    console.log('Stake successful!', result);
    // result contains: { txHash, amount, token, userWallet }
    
    // Grant user access to your service
    grantUserAccess(result.userWallet);
  };

  return (
    <div>
      <h1>Upgrade to Premium</h1>
      
      {/* Traditional payment option */}
      <button>Pay $10/month</button>
      
      {/* Stakefy option */}
      <StakePay
        serviceId="your-service-id"
        requiredStake={{
          amount: 1200,
          token: 'USDC'
        }}
        onSuccess={handleSuccess}
        onError={(err) => console.error(err)}
      />
    </div>
  );
}

// api/verify-access.js
const Stakefy = require('@stakefy/node');

const client = new Stakefy({
  secretKey: process.env.STAKEFY_SECRET_KEY
});

export default async function handler(req, res) {
  const { wallet } = req.body;
  
  try {
    const status = await client.verifyStake({
      walletAddress: wallet,
      serviceId: 'your-service-id'
    });
    
    if (status.hasActiveStake) {
      res.json({ access: true, tier: status.accessTier });
    } else {
      res.json({ access: false });
    }
  } catch (error) {
    res.status(500).json({ error: error.message });
  }
}

# Set environment to devnet
NEXT_PUBLIC_STAKEFY_NETWORK=devnet

# Get devnet SOL from faucet
solana airdrop 2 YOUR_WALLET_ADDRESS --url devnet

# Test staking flow

const tiers = [
  {
    id: 'basic',
    name: 'Basic',
    requiredStake: { amount: 500, token: 'USDC' },
    features: ['Feature A', 'Feature B'],
    color: '#bronze'
  },
  {
    id: 'pro',
    name: 'Professional',
    requiredStake: { amount: 2000, token: 'USDC' },
    features: ['All Basic', 'Feature C', 'Priority Support'],
    color: '#silver'
  },
  {
    id: 'enterprise',
    name: 'Enterprise',
    requiredStake: { amount: 10000, token: 'USDC' },
    features: ['All Pro', 'Custom Integrations', 'Dedicated Account Manager'],
    color: '#gold'
  }
];

<StakePay
  tiers={tiers}
  allowTierSelection={true}
  onTierChange={(tier) => console.log('User selected:', tier)}
/>

// Configure webhooks in dashboard, then:

// api/webhooks/stakefy.js
const crypto = require('crypto');

export default async function handler(req, res) {
  // Verify webhook signature
  const signature = req.headers['x-stakefy-signature'];
  const payload = JSON.stringify(req.body);
  
  const expectedSignature = crypto
    .createHmac('sha256', process.env.STAKEFY_WEBHOOK_SECRET)
    .update(payload)
    .digest('hex');
  
  if (signature !== expectedSignature) {
    return res.status(401).json({ error: 'Invalid signature' });
  }
  
  // Handle events
  const { event, data } = req.body;
  
  switch (event) {
    case 'stake.created':
      await grantAccess(data.userWallet, data.serviceId);
      break;
      
    case 'stake.unstaked':
      await revokeAccess(data.userWallet, data.serviceId);
      break;
      
    case 'yield.distributed':
      await logRevenue(data.amount, data.token);
      break;
  }
  
  res.json({ received: true });
}

import { useStakeStatus, useUserStakes } from '@stakefy/sdk';

function ProtectedContent() {
  const { hasAccess, loading, tier } = useStakeStatus('your-service-id');
  
  if (loading) return <Spinner />;
  
  if (!hasAccess) {
    return (
      <div>
        <h2>Premium Content</h2>
        <p>Stake to unlock access</p>
        <StakePay serviceId="your-service-id" />
      </div>
    );
  }
  
  return (
    <div>
      <h2>Welcome, {tier} Member! 🎉</h2>
      <PremiumFeatures />
    </div>
  );
}

// View all user stakes
function Dashboard() {
  const { stakes, totalValue } = useUserStakes();
  
  return (
    <div>
      <h3>Your Stakes</h3>
      <p>Total Staked: ${totalValue}</p>
      {stakes.map(stake => (
        <StakeCard
          key={stake.id}
          service={stake.serviceName}
          amount={stake.amount}
          token={stake.token}
          yield={stake.yieldGenerated}
          onUnstake={() => stake.unstake()}
        />
      ))}
    </div>
  );
}