theme-common doesn't deduplicate if site using pnpm/PnP installs it

### Have you read the Contributing Guidelines on issues?

- [X] I have read the [Contributing Guidelines on issues](https://github.com/facebook/docusaurus/blob/main/CONTRIBUTING.md#reporting-new-issues).

### Prerequisites

- [X] I'm using the latest version of Docusaurus.
- [X] I have tried the `npm run clear` or `yarn clear` command.
- [X] I have tried `rm -rf node_modules yarn.lock package-lock.json` and re-installing packages.
- [X] I have tried creating a repro with https://new.docusaurus.io.
- [X] I have read the console error message carefully (if applicable).

### Description

So I've tried to copy the code from your own [docs](https://github.com/facebook/docusaurus/blob/main/website/docs/guides/docs/sidebar/index.md?plain=1#L36-L41) and make a custom category index page. With the sub-pages displayed as cards, and some additional text on the page. Therefore, I don't want to use the `type: generate-index` category page.

The pre-existing code worked fine in docusaurus `v2.0.0-beta.21`, however, when upgrading to `v2.0.1` the page crashes upon visiting it in local dev, and Vercel preview deployments fail to build.

I can't reproduce the issue in a fresh [Stackblitz](https://stackblitz.com/edit/github-e83uag?file=sidebars.js,package.json,docusaurus.config.js) actually. It works as expected there. However, here is my [draft PR](https://github.com/nextauthjs/next-auth/pull/5062) in which it does not work as expected anymore. As previously mentioned, the same code worked in `v2.0.0-beta.21` (i.e. in our current `main` / prod deployment - https://next-auth.js.org/guides).

So when rendering the markdown below, I get the following error: `Hook useDocsSidebar is called outside the .` all of a sudden.

`docs/guides/index.md`
```
---
id: guides
title: Guides
---

# Guides

` ``mdx-code-block
import DocCardList from '@theme/DocCardList';
import {useCurrentSidebarCategory} from '@docusaurus/theme-common';

` ``

We have internal guides in three levels of difficulty.

If you can't find what you're looking for here, maybe take a look at our third-party [tutorials](/tutorials) page.

```

### Reproducible demo

https://stackblitz.com/edit/github-e83uag?file=sidebars.js,package.json,docusaurus.config.js

### Steps to reproduce

1. Visit `/guides` page
2. Watch `` render throw an error

### Expected behavior

Render a custom category index page with the sub-pages listed in `DocCardList` components next to some more additional custom text.

### Actual behavior

Opening the page in question causes the following error: `Hook useDocsSidebar is called outside the .`


### Your environment

- Public source code: https://github.com/nextauthjs/next-auth
- Public site URL: https://next-auth.js.org
- Docusaurus version used: `2.0.1`
- Environment name and version (e.g. Chrome 89, Node.js 16.4): 1.39.122 Chromium: 102.0.5005.115 (Official Build) (64-bit), Node 16.15.0
- Operating system and version (e.g. Ubuntu 20.04.2 LTS): Arch Linux (up-to-date)

### Self-service

- [X] I'd be willing to fix this bug myself.