I implemented Casl to deal with authorization in my NextJs app (using app router), and it works fine. Reading the docs, I found out that Casl has a react library (@casl/react) that offers a <Can> component, to wrap the elements I need to controll access, and it also works fine on client components (using the 'use client' directive).

The problem happens when i try to use de Can component in server components. I get this error:

Error: Class extends value undefined is not a constructor or null This might be caused by a React Class Component being rendered in a Server Component, React Class Components only works in Client Components. Read more: https://nextjs.org/docs/messages/class-component-in-server-component

Is there a solution for that? Someone here uses the <Can> component on server components, or because of this limitation, you guys use Casl only by checking the ability.can() method?

thanks in advance