Pressable card with Link NextJS Component

[dull saffron]

import { Card, Link } from "@nextui-org/react";

<Card
  isPressable
  isHoverable
  variant="shadow"
  as={Link}
  href="/page"
></Card>

or warp it inside the Link component

[maiden ermine]

i want use Link component from NextJS not from NextUI

[dull saffron]

crap mb-
It's the same thing- just import the link as { Link as NextLink } the replace the as={} in the Card component

or the other way too;

import { Card, Link as UILink } from "@nextui-org/react";
import Link from "next/link"

<Card
  isPressable
  isHoverable
  variant="shadow"
  as={Link}
  href="/page"
>
  <Card.Header>
    <UILink href="/page-2" isExternal>Hello!</UILink>
  </Card.Header>
</Card>

[maiden ermine]

import Link from "next/link";
import {Card, Text, Link as UILink,} from "@nextui-org/react";

            <section className={`${utilStyles.headingMd} ${utilStyles.padding1px}`}>
                <h2 className={utilStyles.headingLg}>Blog</h2>
                <ul className={utilStyles.list}>
                    {allPostsData.map(({ id, date, title }) => (
                        <Card
                            isPressable
                            isHoverable
                            variant="bordered"
                            borderWeight="extrabold"
                            css={{ borderColor: "$gradient" }}
                            as={Link}>
                            <li className={utilStyles.listItem} key={id}>
                                <Card.Header>
                                    <UILink href={`/posts/${id}`}>{title}</UILink>
                                </Card.Header>
                                <Card.Footer>
                                    <Text size={16}>
                                        <Date dateString={date} />
                                    </Text>
                                </Card.Footer>
                            </li>
                        </Card>
                    ))}
                </ul>
            </section>

[maiden ermine]

not working

solved