'use client'

import { useAccount } from 'wagmi'
import { PresaleDashboard } from '@/components/PresaleDashboard'

export default function Home() {
  const { isConnected } = useAccount()

  return (
    <div className="container mx-auto py-10 px-4">
      <div className="max-w-4xl mx-auto">
        <div className="mb-8 text-center">
          <h1 className="text-4xl font-bold tracking-tight">{{tokenName}} Presale</h1>
          <p className="text-muted-foreground mt-2">
            Join the {{tokenSymbol}} presale — contribute ETH and receive tokens.
          </p>
        </div>
        {isConnected ? (
          <PresaleDashboard />
        ) : (
          <div className="rounded-lg border bg-card p-8 text-center">
            <h2 className="text-xl font-semibold mb-2">Connect Your Wallet</h2>
            <p className="text-muted-foreground">
              Connect your wallet to participate in the {{tokenSymbol}} presale.
            </p>
          </div>
        )}
      </div>
    </div>
  )
}