Merge pull request #103 from GetStream/feat/sidebar-github

feat: Fix error from hooks
GetStream · Sep 1, 2023 · 36fe2f3 · 36fe2f3
2 parents fed962c + 28f61b4
commit 36fe2f3
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 25 deletions.
diff --git a/src/contexts/BreadcrumbsContext.js b/src/contexts/BreadcrumbsContext.js
@@ -2,6 +2,8 @@ import React, { useCallback, useEffect, useMemo, useState } from "react"
 
 import { useLocation } from "@docusaurus/router"
 
+import URLS from "../../urls"
+
 export const BreadcrumbsContext = React.createContext()
 
 const removeTrailingSlash = string => {
@@ -42,6 +44,7 @@ export const BreadcrumbsContextProvider = ({ children }) => {
   const [breadcrumbs, setBreadcrumbs] = useState([])
   const [sidebar, setSidebar] = useState([])
   const { pathname } = useLocation()
+  const [urlPlatform] = pathname.replace(URLS.docs.root, "").split("/")
 
   const extarctBreadcrumbs = useCallback((localSidebar, localPathname) => {
     const pathObjects = extractPathObjects(localSidebar, localPathname)
@@ -56,8 +59,9 @@ export const BreadcrumbsContextProvider = ({ children }) => {
     () => ({
       breadcrumbs,
       setSidebar,
+      urlPlatform,
     }),
-    [breadcrumbs, setSidebar]
+    [breadcrumbs, setSidebar, urlPlatform]
   )
 
   return (

diff --git a/src/theme/DocSidebar/index.js b/src/theme/DocSidebar/index.js
@@ -1,37 +1,31 @@
 import React, { useEffect, useMemo } from "react"
 
-import { useLocation } from "@docusaurus/router"
 import OriginalDocSidebar from "@theme-original/DocSidebar"
 
 import { useBreadcrumbsContext } from "../../hooks/useBreadcrumbsContext"
 import productVariables from "../../product-variables"
 
-const gitLink = () => {
-  const location = useLocation()
-  const locationPlatform = useMemo(() => {
-    const [urlPlatform] = location.pathname
-      .replace(URLS.docs.root, "")
-      .split("/")
-    return urlPlatform
-  }, [location.pathname])
+const gitLink = urlPlatform => {
   return (
-    productVariables[process.env.PRODUCT]?.gitHub?.[locationPlatform] ||
+    productVariables[process.env.PRODUCT]?.gitHub?.[urlPlatform] ||
     "https://github.com/GetStream/"
   )
 }
 
-const WEB_LINKS = [
-  ["Contact Support", "https://getstream.io/contact/support/"],
-  ["Maker Account", "https://getstream.io/maker-account/"],
-  ["Mobile Chat Kit", "https://getstream.io/chat/ux-kit/"], // activity feeds ux kit ???
-  ["Install from GitHub", gitLink()],
-  [
-    <>
-      © Stream.IO, Inc. <br /> All Rights Reserved.
-    </>,
-    "/",
-  ],
-]
+const WEB_LINKS = gitLink => {
+  return [
+    ["Contact Support", "https://getstream.io/contact/support/"],
+    ["Maker Account", "https://getstream.io/maker-account/"],
+    ["Mobile Chat Kit", "https://getstream.io/chat/ux-kit/"], // activity feeds ux kit ???
+    ["Install from GitHub", gitLink],
+    [
+      <>
+        © Stream.IO, Inc. <br /> All Rights Reserved.
+      </>,
+      "/",
+    ],
+  ]
+}
 
 const addTitle = sidebarItems => {
   return sidebarItems.map(({ label, items, ...props }) => ({
@@ -42,7 +36,8 @@ const addTitle = sidebarItems => {
 }
 
 export default function DocSidebar({ sidebar, ...props }) {
-  const { setSidebar } = useBreadcrumbsContext()
+  const { setSidebar, urlPlatform } = useBreadcrumbsContext()
+  const gitHubLink = gitLink(urlPlatform)
 
   useEffect(() => {
     setSidebar(sidebar)
@@ -52,7 +47,7 @@ export default function DocSidebar({ sidebar, ...props }) {
     () =>
       addTitle([
         ...sidebar.map(category => ({ ...category, collapsed: false })),
-        ...WEB_LINKS.map(([label, href]) => ({
+        ...WEB_LINKS(gitHubLink).map(([label, href]) => ({
           type: "link",
           label,
           href,