docs: redesign sidebar (#8408)

* initial changes * redesign the sidebar + nav drawer * changes to sidebar items * finish up sidebar redesign * support new sidebar in resources * general fixes * integrate in ui * support api reference * refactor * integrate in user guide * docs: fix build errors * fix user guide build * more refactoring * added banner * added bottom logo + icon * fix up sidebar * fix up paddings * fix shadow bottom * docs: add table of content (#8445) * add toc types * implement toc functionality * finished toc redesign * redesigned table of content * mobile fixes * truncate text in toc * mobile fixes * merge fixes * implement redesign * add hide sidebar * add menu action item * finish up hide sidebar design * implement redesign in resources * integrate in api reference * integrate changes in ui * fixes to api reference scrolling * fix build error * fix build errors * fixes * fixes to sidebar * general fixes * fix active category not closing * fix long titles
2024-08-15 12:13:13 +03:00
parent 4cb28531e5
commit b4f3b8a79d
157 changed files with 5080 additions and 2010 deletions
@@ -15,6 +15,7 @@ import {
 import SidebarProvider from "./sidebar"
 import SearchProvider from "./search"
 import { config } from "../config"
+import { MainNavProvider } from "./main-nav"

 type ProvidersProps = {
  children?: React.ReactNode
@@ -32,15 +33,17 @@ const Providers = ({ children }: ProvidersProps) => {
                  <ScrollControllerProvider scrollableSelector="#main">
                    <SidebarProvider>
                      <PaginationProvider>
-                        <SearchProvider>
-                          <HooksLoader
-                            options={{
-                              pageScrollManager: true,
-                            }}
-                          >
-                            {children}
-                          </HooksLoader>
-                        </SearchProvider>
+                        <MainNavProvider>
+                          <SearchProvider>
+                            <HooksLoader
+                              options={{
+                                pageScrollManager: true,
+                              }}
+                            >
+                              {children}
+                            </HooksLoader>
+                          </SearchProvider>
+                        </MainNavProvider>
                      </PaginationProvider>
                    </SidebarProvider>
                  </ScrollControllerProvider>
@@ -0,0 +1,46 @@
+"use client"
+
+import {
+  formatReportLink,
+  getNavDropdownItems,
+  MainNavProvider as UiMainNavProvider,
+  useIsBrowser,
+} from "docs-ui"
+import { useMemo } from "react"
+import { config } from "../config"
+import { basePathUrl } from "../utils/base-path-url"
+
+type MainNavProviderProps = {
+  children?: React.ReactNode
+}
+
+export const MainNavProvider = ({ children }: MainNavProviderProps) => {
+  const isBrowser = useIsBrowser()
+  const navigationDropdownItems = useMemo(
+    () =>
+      getNavDropdownItems({
+        basePath: config.baseUrl,
+        activePath: basePathUrl(),
+        version: "v2",
+      }),
+    []
+  )
+
+  const reportLink = useMemo(
+    () =>
+      formatReportLink(
+        config.titleSuffix || "",
+        isBrowser ? document.title : ""
+      ),
+    [isBrowser]
+  )
+
+  return (
+    <UiMainNavProvider
+      navItems={navigationDropdownItems}
+      reportIssueLink={reportLink}
+    >
+      {children}
+    </UiMainNavProvider>
+  )
+}
@@ -20,7 +20,6 @@ const SidebarProvider = ({ children }: SidebarProviderProps) => {
      initialItems={config.sidebar}
      staticSidebarItems={true}
      disableActiveTransition={true}
-      noTitleStyling={true}
    >
      {children}
    </UiSidebarProvider>