"use client";

import Link from "next/link";
import { UserPlus, LayoutDashboard } from "lucide-react";
import { useAuth } from "@/hooks/useAuth";

export const JoinUsButton = () => {
    const { user, loading } = useAuth();

    if (loading) return null;

    return user ? (
        <Link href="/dashboard/user" className="inline-flex items-center gap-2 px-6 py-2.5 border border-brand-600 text-brand-600 rounded-xl hover:bg-brand-50 font-medium transition-colors">
            <LayoutDashboard className="w-4 h-4" />
            My Dashboard
        </Link>
    ) : (
        <Link href="/register" className="inline-flex items-center gap-2 px-6 py-2.5 border border-brand-600 text-brand-600 rounded-xl hover:bg-brand-50 font-medium transition-colors">
            <UserPlus className="w-4 h-4" />
            Join Us
        </Link>
    );
};