Hi, I am creating a new NextJS project using the app directory for the first time instead of the pages. I am currently loading data in using Prisma Client, yet when I update an entity, NextJS seems to cache the old value when switching pages.

When I refresh the page the correct data is shown, but using the <Link> component will keep track of the old data. How would I tackle this?

The code I am currently using is:

const getProducts = async () => {
    const products = await prisma.product.findMany({
        take: 10,
        orderBy: {
            sku: 'asc'
        }
    })
    const count = await prisma.product.count()
    return {products, count}
}

export default async function Products() {
    const {products, count} = await getProducts()

    return (<>Product page</>)
}

When (on another page) I update for example the sku from 123 to 1234 and press <Link href="/products">Products</Link>, the sku will stay at 123 and not update tilll I press F5. I suppose it is a caching issue, but the App router is quite new to me. Previously in the pages routing, I would just use getServerSideProps(), is there an equal solution or a better solution?

I hope someone can help, many thanks.