After updating deps to v3: Hook useDocsSidebar is called outside the <DocsSidebarProvider>

[glitch-txs]

I'm not using this hook anywhere in my app how can I fix this error?

My deps:

  "dependencies": {
    "@docusaurus/core": "^3.1.0",
    "@docusaurus/cssnano-preset": "^3.1.0",
    "@docusaurus/plugin-debug": "^3.1.0",
    "@docusaurus/plugin-google-analytics": "^3.1.0",
    "@docusaurus/plugin-google-gtag": "^3.1.0",
    "@docusaurus/plugin-sitemap": "^3.1.0",
    "@docusaurus/preset-classic": "^3.1.0",
    "@docusaurus/remark-plugin-npm2yarn": "^3.1.0",
    "@docusaurus/theme-classic": "^3.1.0",
    "@docusaurus/theme-common": "^3.1.0",
    "@docusaurus/theme-search-algolia": "^3.1.0",
    "@markprompt/css": "^0.19.1",
    "@markprompt/docusaurus-theme-search": "^0.14.6",
    "@markprompt/react": "^0.31.3",
    "@markprompt/web": "^0.21.9",
    "@mdx-js/react": "3.0.0",
    "clsx": "2.1.0",
    "prism-react-renderer": "2.3.1",
    "react": "^18.2.0",
    "react-dom": "18.2.0",
    "react-router-dom": "^6.21.2"
  },
  "devDependencies": {
    "@docusaurus/module-type-aliases": "^3.1.0",
    "@docusaurus/tsconfig": "^3.1.0",
    "@docusaurus/types": "^3.1.0",
    "prettier": "3.2.2",
    "typedoc-plugin-markdown": "3.17.1",
    "typescript": "5.3.3"
  },

[slorber]

You probably swizzled components. When upgrading you have to eventually upgrade the swizzled compoonents so that they are in sync with our latest changes. Eventually you can reswizzle them again and reapply your changes one by one.

[glitch-txs]

Hi, thanks for answering, I was able to fix it with adding src/Root.js

import React from 'react';
import { DocsSidebarProvider } from '@docusaurus/theme-common/internal';
// Default implementation, that you can customize
export default function Root({children}) {
  return <DocsSidebarProvider>{children}</DocsSidebarProvider>;
}