Разработка Token Launchpad: IDO/ICO с вестингом и Merkle whitelist

// hooks/useContribute.ts
import { useWriteContract, useWaitForTransactionReceipt } from 'wagmi';
import { getMerkleProof, isWhitelisted } from '@/lib/merkle';

export function useContribute(contractAddress: `0x${string}`, phase: number) {
  const { address } = useAccount();
  const { writeContract, data: txHash, isPending } = useWriteContract();
  const { isLoading: isConfirming, isSuccess } = useWaitForTransactionReceipt({ hash: txHash });

  const contribute = async (ethValue: bigint) => {
    if (!address) return;
    if (phase === 1) {
      if (!isWhitelisted(address)) {
        throw new Error('Адрес не в whitelist');
      }
      const proof = getMerkleProof(address);
      writeContract({
        address: contractAddress,
        abi: PRESALE_ABI,
        functionName: 'contribute',
        args: [proof],
        value: ethValue,
      });
    } else {
      writeContract({
        address: contractAddress,
        abi: PRESALE_ABI,
        functionName: 'contributePublic',
        value: ethValue,
      });
    }
  };

  return { contribute, txHash, isPending, isConfirming, isSuccess };
}

// components/CountdownTimer.tsx
import { useEffect, useState } from 'react';

interface TimeLeft {
  days: number;
  hours: number;
  minutes: number;
  seconds: number;
}

function calcTimeLeft(targetTs: number): TimeLeft {
  const diff = Math.max(0, targetTs * 1000 - Date.now());
  return {
    days: Math.floor(diff / 86_400_000),
    hours: Math.floor((diff % 86_400_000) / 3_600_000),
    minutes: Math.floor((diff % 3_600_000) / 60_000),
    seconds: Math.floor((diff % 60_000) / 1_000),
  };
}

export function CountdownTimer({ targetTs, label }: { targetTs: number; label: string }) {
  const [timeLeft, setTimeLeft] = useState<TimeLeft>(calcTimeLeft(targetTs));

  useEffect(() => {
    const interval = setInterval(() => setTimeLeft(calcTimeLeft(targetTs)), 1000);
    return () => clearInterval(interval);
  }, [targetTs]);

  return (
    <div className="text-center">
      <p className="mb-3 text-sm text-neutral-400">{label}</p>
      <div className="flex items-center gap-3">
        {[
          { value: timeLeft.days, label: 'дней' },
          { value: timeLeft.hours, label: 'часов' },
          { value: timeLeft.minutes, label: 'минут' },
          { value: timeLeft.seconds, label: 'секунд' },
        ].map(({ value, label }) => (
          <div key={label} className="min-w-[60px] rounded-xl bg-neutral-800 p-3 text-center">
            <span className="block text-2xl font-bold tabular-nums">
              {String(value).padStart(2, '0')}
            </span>
            <span className="text-xs text-neutral-500">{label}</span>
          </div>
        ))}
      </div>
    </div>
  );
}

// components/ContributionCalculator.tsx
import { formatEther, formatUnits, parseEther } from 'viem';

interface Props {
  tokenPrice: bigint;
  minContrib: bigint;
  maxContrib: bigint;
  userContrib: bigint;
  tokenDecimals?: number;
}

export function ContributionCalculator({
  tokenPrice,
  minContrib,
  maxContrib,
  userContrib,
  tokenDecimals = 18,
}: Props) {
  const [ethAmount, setEthAmount] = useState('');
  const ethWei = ethAmount ? parseEther(ethAmount) : 0n;
  const tokensReceived = tokenPrice > 0n ? (ethWei * BigInt(10 ** tokenDecimals)) / tokenPrice : 0n;
  const remaining = maxContrib - userContrib;
  const canContribute = ethWei >= minContrib && ethWei <= remaining;

  return (
    <div className="space-y-4">
      {/* original */}
    </div>
  );
}

function FundingProgress({ raised, hardCap, softCap }: { raised: bigint; hardCap: bigint; softCap: bigint }) {
  const raisedEth = parseFloat(formatEther(raised));
  const hardCapEth = parseFloat(formatEther(hardCap));
  const softCapEth = parseFloat(formatEther(softCap));
  const progress = (raisedEth / hardCapEth) * 100;
  const softCapPercent = (softCapEth / hardCapEth) * 100;
  return (
    <div>
      <div className="mb-2 flex justify-between text-sm">
        <span>{raisedEth.toFixed(2)} ETH собрано</span>
        <span>{progress.toFixed(1)}%</span>
      </div>
      <div className="relative h-3 overflow-hidden rounded-full bg-neutral-800">
        <div className="h-full rounded-full bg-gradient-to-r from-blue-600 to-violet-600 transition-all duration-500" style={{ width: `${Math.min(progress, 100)}%` }} />
        <div className="absolute top-0 h-full w-0.5 bg-yellow-400" style={{ left: `${softCapPercent}%` }} />
      </div>
      <div className="mt-1 flex justify-between text-xs text-neutral-500">
        <span>Soft cap: {softCapEth} ETH</span>
        <span>Hard cap: {hardCapEth} ETH</span>
      </div>
    </div>
  );
}