The app router has its own way of setting metadata tags and since Next.js v13 the next/head component should not be used.

See this documentation page: https://nextjs.org/docs/app/building-your-application/optimizing/metadata

If you need to set metadata from a client component you can just include those tags in your component and React will automatically move it inside the document head.

See: https://nextjs-faq.com/metadata-client-components#how-do-i-set-dynamic-metadata-that-depends-on-client-side-states