import Link from 'next/link';
import { Users, Trophy, ChevronRight } from 'lucide-react';

export function QuickActions({ className }: { className?: string }) {
  return (
    <div className={className}>
      <h3 className="font-semibold text-white mb-4">Quick Actions</h3>
      <div className="space-y-2">
        <Link
          href="/leagues"
          className="flex items-center gap-3 p-3 rounded-lg bg-deep-graphite hover:bg-charcoal-outline/50 transition-colors"
        >
          <div className="p-2 bg-primary-blue/10 rounded-lg">
            <Users className="w-4 h-4 text-primary-blue" />
          </div>
          <span className="text-sm text-white">Browse Leagues</span>
          <ChevronRight className="w-4 h-4 text-gray-500 ml-auto" />
        </Link>
        <Link
          href="/leaderboards"
          className="flex items-center gap-3 p-3 rounded-lg bg-deep-graphite hover:bg-charcoal-outline/50 transition-colors"
        >
          <div className="p-2 bg-warning-amber/10 rounded-lg">
            <Trophy className="w-4 h-4 text-warning-amber" />
          </div>
          <span className="text-sm text-white">View Leaderboards</span>
          <ChevronRight className="w-4 h-4 text-gray-500 ml-auto" />
        </Link>
      </div>
    </div>
  );
}