import React from "react";
import "../styles/UserInfoCard.css";

const UserInfoCard = ({ employeeName, employeeId }) => {
  return (
    <div className="user-info-card">
      <div className="user-info-avatar">
        {employeeName ? employeeName.charAt(0).toUpperCase() : "U"}
      </div>
      <div className="user-info-content">
        <h2 className="user-info-name">{employeeName || "User Name"}</h2>
        <p className="user-info-id">
          Employee ID: <strong>{employeeId || "N/A"}</strong>
        </p>
      </div>
    </div>
  );
};

export default UserInfoCard;

