import { FiX, FiEdit2 } from 'react-icons/fi';
interface Account {
    id: number;
    isDefault: boolean;
    name: string;
}

interface UserData {
    id: string;
    firstName: string;
    lastName: string;
    email: string;
    language: string;
    account: Account;
}

interface UserProfileProps {
    userData: UserData;
}
const UserProfile: React.FC<UserProfileProps> = ({ userData }) => {
    const getInitials = (firstName: string, lastName: string) => {
        return `${firstName.charAt(0)}${lastName.charAt(0)}`.toUpperCase();
    };
    return (
        <div className="bg-white rounded-md shadow-sm flex w-full p-6">
            {/* Profile Picture */}
            <div className="flex-shrink-0 text-center">
                <div className="w-20 h-20 bg-green-800 text-white font-bold text-2xl rounded-full flex items-center justify-center shadow-lg">
                    {getInitials(userData.firstName, userData.lastName)}
                </div>
            </div>

            {/* Info Fields */}
            <div className="flex flex-col justify-center flex-1 ms-10">
                {/* Row: Name */}
                <div className="flex py-1">
                    <div className="text-gray-500 font-medium text-[13px] w-32">Name</div>
                    <div className="text-gray-400 font-medium text-[13px]">
                        {userData.firstName} {userData.lastName}
                    </div>
                </div>

                {/* Row: Email */}
                <div className="flex py-1">
                    <div className="text-gray-500 font-medium text-[13px] w-32">Email</div>
                    <div className="text-gray-400 font-medium text-[13px]">{userData.email}</div>
                </div>

                {/* Row: Account Name */}
                <div className="flex py-1">
                    <div className="text-gray-500 font-medium text-[13px] w-32">Account name</div>
                    <div className="text-gray-400 font-medium text-[13px]">
                        {userData.account.name}
                    </div>
                </div>
            </div>
        </div>


    );
};

export default UserProfile