I'm having an issue with wrapping a card component using the Link component from 'next/link'. Instead of redirecting me to the desired link when I click the card, I receive a warning that says 'Function components cannot be given refs. Attempts to access this ref will fail'. How can I resolve this problem?
Below is the code snippet:
<div className="flex justify_between align_center flex_wrap mb_2 ">
{[1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12].map((item) => (
<Link href="/blog-details" key={item}>
<BlogCard />
</Link>
))}