fix(deps): update docusaurus monorepo to v2.3.0 (#7475)

* fix(deps): update docusaurus monorepo to v2.3.0

* fix(deps): update docusaurus monorepo to v2.3.0

* useStorageSlot

* fix: update to docusaurus 2.3.1

---------

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
Co-authored-by: Tobbe Lundberg <tobbe@tlundberg.com>
Co-authored-by: Dominic Saadi <dominiceliassaadi@gmail.com>

docs/package.json

@@ -24,17 +24,18 @@
     ]
   },
   "dependencies": {
-    "@docusaurus/core": "2.2.0",
-    "@docusaurus/plugin-content-docs": "2.2.0",
-    "@docusaurus/preset-classic": "2.2.0",
+    "@docusaurus/core": "2.3.1",
+    "@docusaurus/plugin-content-docs": "2.3.1",
+    "@docusaurus/preset-classic": "2.3.1",
+    "@docusaurus/theme-common": "2.3.1",
     "@mdx-js/react": "1.6.22",
     "clsx": "1.2.1",
     "react": "17.0.2",
     "react-dom": "17.0.2",
     "react-player": "2.11.0"
   },
   "devDependencies": {
-    "@docusaurus/module-type-aliases": "2.2.0",
+    "@docusaurus/module-type-aliases": "2.3.1",
     "@tsconfig/docusaurus": "1.0.6",
     "typescript": "4.9.5"
   }

docs/src/components/FileExtSwitcher.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react'
 
-import { useTabGroupChoice } from '@docusaurus/theme-common/internal'
+import { useStorageSlot } from '@docusaurus/theme-common'
 
 interface Props {
   path: string
@@ -12,16 +12,12 @@ interface Props {
  * on what language the user has selected for the code blocks
  */
 export default function FileExtSwitcher({ path }: Props) {
-  const { tabGroupChoices } = useTabGroupChoice()
+  const [jsTs] = useStorageSlot('docusaurus.tab.js-ts')
 
   const extensionStart = path.lastIndexOf('{')
   const extensions = path.slice(extensionStart + 1, path.length - 1)
   const ts = extensions.split(',')[1]
   const pathWithoutExt = path.slice(0, extensionStart)
 
-  return (
-    <code>
-      {pathWithoutExt + (tabGroupChoices['js-ts'] === 'js' ? 'js' : ts)}
-    </code>
-  )
+  return <code>{pathWithoutExt + (jsTs === 'js' ? 'js' : ts)}</code>
 }

docs/src/components/ShowForTs.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react'
 
-import { useTabGroupChoice } from '@docusaurus/theme-common/internal'
+import { useStorageSlot } from '@docusaurus/theme-common'
 import MDXContent from '@theme/MDXContent'
 
 interface Props {
@@ -19,9 +19,7 @@ interface Props {
  * **/
 
 export default function ShowForTs({ children }: Props) {
-  const { tabGroupChoices } = useTabGroupChoice()
+  const [jsTs] = useStorageSlot('docusaurus.tab.js-ts')
 
-  const isTsSelected = tabGroupChoices['js-ts'] === 'ts'
-
-  return isTsSelected && <MDXContent>{children}</MDXContent>
+  return jsTs === 'ts' && <MDXContent>{children}</MDXContent>
 }