Javascript find method returns undefined despite valid arguments

See more:

Javascript

React

Redux

I am working on a simple React app which is a blog app.

I have a component which is used to display the name of the Author.

```

import React from "react";
import { useSelector } from "react-redux";

const AuthorPost = ({ authorId }) => {
  console.log(authorId); // Prints authorId as expected
  const authors = useSelector((store) => store.author);
  console.log(authors); // Prints array
  const author = authors.find((author) => author.id === authorId);
  console.log(author); // Prints undefined

  return <span>{author ? author.name : "unknown author"}</span>;
};

export default AuthorPost;

```

The following line is used to find the author whose id matches the authorId. authorId is a prop that we get from a different component.

I have console logged both authorId and author.id separately. And it works.
But if I try to find an author which has an author.id which matches authorId then I get undefined. I am pulling my hair for hours on this particular problem. Need help.

What I have tried:

I have tried console logging both author.id and authorId. Technically it should work.