import { User, UserPlus, Users } from "react-feather";

export default function UsersStatistics() {
    return (
        // For Superadmin
        <div className="bg-neutral-10 shadow-md p-6 rounded-lg w-full h-full flex flex-col">
            <p className="font-bold text-xl flex items-center"><Users className="stroke-[#7209B7] mr-2" />Users</p>
            <hr />
            <div className="flex flex-col items-center py-2">
                <div className="stat-value text-[#7209B7]">000</div>
                <div className="stat-desc text-black">Total Users</div>
            </div>
            <hr />
            
            <div className="join my-2 shadow w-full">
                <div className="join-item text-center px-2 border w-full">
                    <div className="stat-value text-secondary-main">000</div>
                    <div className="stat-desc text-black">Team Leaders</div>
                </div>
                <div className="join-item text-center px-2 border w-full">
                    <div className="stat-value text-secondary-main">000</div>
                    <div className="stat-desc text-black">Team Members</div>
                </div>
            </div>

            <div className="join my-2 shadow w-full">
                <div className="join-item text-center px-2 border w-full">
                    <div className="stat-value text-secondary-main">000</div>
                    <div className="stat-desc text-black">Pending Invites</div>
                </div>
                <div className="join-item text-center px-2 border w-full">
                    <div className="stat-value text-secondary-main">000</div>
                    <div className="stat-desc text-black">Revoked Invites</div>
                </div>
            </div>
            <hr />
            
            <div className="flex justify-between mt-auto">
                <div className="btn btn-link text-success-main p-0 mr-8"><User size={20} />Manage</div>
                <div className="btn btn-link text-primary-main p-0"><UserPlus size={20} />Invite</div>
            </div>
        </div>
    )
}