diff --git a/src/components/Project/AssignEmployeeCard.jsx b/src/components/Project/AssignEmployeeCard.jsx
deleted file mode 100644
index e8cb9092..00000000
--- a/src/components/Project/AssignEmployeeCard.jsx
+++ /dev/null
@@ -1,60 +0,0 @@
-
-import React, { useState, useEffect } from 'react';
-import RoleBadge from './RoleBadge';
-import Avatar from '../common/Avatar';
-
-const AssignEmployeeCard = ({
-  employee,
-  jobRoles,
-  isChecked,
-  onRoleChange,
-  onCheckboxChange,
-}) => {
-  const [currentJobRole, setCurrentJobRole] = useState(employee.jobRoleId);
-
-  useEffect(() => {
-    setCurrentJobRole(employee.jobRoleId);
-  }, [employee.jobRoleId]);
-
-  const handleRoleChange = (newRoleId) => {
-    setCurrentJobRole(newRoleId);
-    onRoleChange(employee.id, newRoleId);
-  };
-
-  const handleCheckboxChange = () => {
-    if (!employee.isActive) {
-      onCheckboxChange(employee.id); 
-    }
-  };
-
-  return (
-    <div className="assign-employee-card d-flex justify-content-between align-items-center px-2 py-1 border-bottom">
-      <div className="d-flex align-items-center flex-grow-1">
-        <div className="avatar me-3">
-         
-          <Avatar firstName={employee.firstName} lastName={employee.l} />
-        </div>
-        <div className="employee-info">
-          <p className="mb-0  d-none d-sm-block">{employee.firstName} {employee.lastName} </p>
-        </div>
-      </div>
-
-      <div className="d-flex align-items-center">
-        <RoleBadge
-          JobRoles={jobRoles}
-          currentJobRole={currentJobRole}
-          onRoleChange={handleRoleChange}
-        />
-        <input
-          className="form-check-input ms-3"
-          type="checkbox"
-          checked={isChecked}
-          disabled={employee.isActive} 
-          onChange={handleCheckboxChange}
-        />
-      </div>
-    </div>
-  );
-};
-
-export default AssignEmployeeCard;
\ No newline at end of file
diff --git a/src/components/Project/RoleBadge.jsx b/src/components/Project/RoleBadge.jsx
deleted file mode 100644
index 198ce550..00000000
--- a/src/components/Project/RoleBadge.jsx
+++ /dev/null
@@ -1,57 +0,0 @@
-import React from 'react';
-
-const RoleBadge = ({ JobRoles, currentJobRole, onRoleChange }) => {
-  const handleRoleSelect = (newRoleId) => {
-    onRoleChange(newRoleId);
-  };
-
- 
-  const validJobRoles = Array.isArray(JobRoles) ? JobRoles : [];
-
-  const selectedRole = validJobRoles.find((role) => role.id === currentJobRole);
-  const selectedRoleName = selectedRole ? selectedRole.name : 'Select Job Role';
-
-  if (validJobRoles.length === 0) {
-    return (
-      <div className="badge bg-label-warning d-flex align-items-center lead">
-        <span className="ms-1 px-2 py-1">No Roles Available</span>
-      </div>
-    );
-  }
-
-  return (
-    <div className="dropdown py-2 px-3 cursor-pointer">
-      <div
-        className=" dropdown-toggle d-flex align-items-center lead"
-        id="dropdownMenuButton"
-        data-bs-toggle="dropdown"
-        aria-expanded="false"
-      >
-        <span className="ms-1 px-2 py-1">
-          <small>{selectedRoleName}</small>
-        </span>
-      </div>
-      <ul
-        className="dropdown-menu"
-        aria-labelledby="dropdownMenuButton"
-        style={{ maxHeight: '200px', overflowY: 'auto' }}
-      >
-        {validJobRoles.map((role) => (
-          <li key={role.id}>
-            <a
-              className="dropdown-item"
-              onClick={(e) => {
-                e.preventDefault();
-                handleRoleSelect(role.id);
-              }}
-            >
-              {role.name}
-            </a>
-          </li>
-        ))}
-      </ul>
-    </div>
-  );
-};
-
-export default RoleBadge;