Filtered array always empty

I tried to do some filtering logic and get the members of the project im on ( according to its name on the url params ), but the problem is that it's always empty as you can see below ( teamMembers is always empty even if i change the filtering condition to something obvious).
I also tried other methods instead of filter on the allUsers array, and they just fine somehow .

function Team({ setShowAddMembers }: props) {
    const params = useParams();
    const { projectName } = params;

    const [projectTeam, setProjectTeam] = useState<user[]>([]);

    useEffect(() => {
        try {
            const getProjectTeam = async () => {
                const allProjects: project[] = await getAllProjects();
                console.log(allProjects); // works. Logs projects array
                const allUsers: user[] = await getAllUsers();
                console.log(allUsers); // works. Logs users array

                // to get only the project of the page you're on
                const currentProject: project[] = allProjects.filter(
                    (project) => project.name === projectName
                );
                console.log(currentProject); // works as intended. Logs a 1 item array
                console.log(currentProject[0]); // works as intended 
                const { members } = currentProject[0];
                console.log(members); //works. Logs array of the members of the current project
                const teamMembers: user[] = allUsers.filter((user) =>
                    members.includes(user.username)
                );
                console.log(teamMembers); // DOES NOT WORK. LOGS EMPTY ARRAY
                setProjectTeam(teamMembers);
            };
            getProjectTeam();
        } catch (error) {
            console.log(error);
        }
    }, []);

console logs: ( in order just like in the code )

• allProjects: [{…}, {…}, {…}, {…}, {…}, {…}, {…}] an array of 7 of this type of objects:

    {
        "tickets": [],
        "_id": "640f80cbd601d54a956de834",
        "desc": "Marketplace website",
        "name": "Market",
        "members": [
            "John Doe",
            "Dave Gray"
        ]
    }

• allUsers: [{…}, {…}, {…}, {…}] an array of this type of objects:

{
    "_id": "640c6e87d8efde2fabbb1ba2",
    "username": "AdminDemo",
    "email": "admindemo@gmail.com",
    "password": "$2b$10$7O7JZVgYW9k0dOXiAFtWv.jN7VVmoooPagOvnEnfEfSB7cTH0md/S",
    "role": "admin",
    "protected": true,
    "__v": 0
}

• current project:

[
    {
        "tickets": [],
        "_id": "640f80cbd601d54a956de834",
        "desc": "Marketplace website",
        "name": "Market",
        "members": [
            "John Doe",
            "Dave Gray"
        ]
    }
]

• currentProject[0]:

{
        "tickets": [],
        "_id": "640f80cbd601d54a956de834",
        "desc": "Marketplace website",
        "name": "Market",
        "members": [
            "John Doe",
            "Dave Gray"
        ]
    }

• members:

["John Doe", "Dave Gray"]

• teamMembers:

[]

Looks like you issue is that you try to compare members names e.g. John Doe with the username of a user e.g. AdminDemo in the way the examples are given I would bet that these will never match.

I dont know how you build the username compared to the members name, if its only removes the space between first and last name you can do a hacky solution by just removing the spaces from the members name.

const teamMembers: user[] = allUsers.filter((user) =>
    members.some(m => m.replace(" ", "") === user.userName)
);

However would recommend to store userIds as members instead, to mitigate further issues in the future with user having the same name and so on.

I think you could solve your problem by looking through your members (what I assume is a list of members.) And writing something in the lines of

members.some(m => m.username === user.username);

some looks through the array and returns if the condition retruns true, otherwise it returns false.