Feat/restructure #668

shhdgit · 2026-01-09T09:59:19Z

…gation - Introduced LeftNavDesktop and LeftNavMobile components to enhance the layout and navigation experience. - Added RightNav and RightNavMobile components for better accessibility and organization of content. - Integrated a new H1 component with TitleAction for enhanced header functionality. - Updated translation strings and styles for consistency across the application. - Removed the deprecated Contributors component to streamline the codebase.

- Introduced a new feature that generates a GitHub edit link for the current document, allowing users to easily contribute improvements. - The link is conditionally rendered based on the presence of pathConfig and filePath, enhancing user engagement with documentation.

- Changed the feedback string from "Request docs changes" to "Report a doc issue" in both English and Japanese translation files for improved clarity and user understanding.

- Added flexWrap property to the TitleAction component to enhance layout responsiveness. - Changed button text from "Copy Markdown for LLM" to "Copy for LLM" for brevity and clarity.

- Changed the text color in the RightNav component from carbon[600] to carbon[700] to enhance readability and visual contrast.

- Updated the RightNav component to only display the Table of Contents (TOC) when it contains items, improving layout and preventing unnecessary empty space.

- Introduced a new header height management system with constants for different header states, improving layout consistency across components. - Updated the Header, LeftNav, RightNav, and various templates to utilize the new header height logic, ensuring proper spacing based on banner visibility. - Added a language switcher option in the HeaderAction component, allowing for better localization support. - Adjusted styles in typography to align with the new header heights, enhancing overall visual coherence.

vercel · 2026-01-09T09:59:23Z

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Review	Updated (UTC)
website-docs	Error		Jan 14, 2026 10:11am

gemini-code-assist · 2026-01-09T09:59:57Z

Summary of Changes

Hello @shhdgit, I'm Gemini Code Assist¹! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!

This pull request focuses on a significant restructuring of the website's layout and navigation components, aiming to enhance modularity and maintainability. It introduces a dynamic header height mechanism to ensure consistent visual alignment for sticky elements, improving overall layout responsiveness. Additionally, new interactive actions are now seamlessly integrated into documentation pages, offering users convenient options for contributing, viewing content in different formats, and downloading resources.

Highlights

Header and Navigation Restructuring: The website's header has been refactored into a more modular two-row structure, and the LeftNav and RightNav components have been reorganized into dedicated directories for improved maintainability.
Dynamic Header Height Management: A new utility (shared/headerHeight.ts) has been introduced to dynamically calculate header height, ensuring consistent sticky positioning for elements like the table of contents across various page templates, adapting to the presence of a banner.
New Title Actions for Documentation: Documentation pages now feature a set of interactive actions directly below the h1 title, including a 'Contribute' dropdown (with options to 'Report a doc issue' and 'Edit this page'), 'Copy for LLM', 'View as Markdown', and 'Download PDF'.
MDX H1 Customization: The rendering of h1 elements within MDX content has been customized to automatically embed the new TitleAction component, providing immediate access to document-related actions.
Translation and UI Text Updates: Key UI texts in English and Japanese, such as 'Table of Contents' and 'Request docs changes', have been updated for clarity and consistency.

🧠 New Feature in Public Preview: You can now enable Memory to help Gemini Code Assist learn from your team's feedback. This makes future code reviews more consistent and personalized to your project's style. Click here to enable Memory in your admin console.

Using Gemini Code Assist

The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.

Invoking Gemini

You can request assistance from Gemini at any point by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

Feature	Command	Description
Code Review	`/gemini review`	Performs a code review for the current pull request in its current state.
Pull Request Summary	`/gemini summary`	Provides a summary of the current pull request in its current state.
Comment	@gemini-code-assist	Responds in comments when explicitly tagged, both in pull request comments and review comments.
Help	`/gemini help`	Displays a list of available commands.

Customization

To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.

Limitations & Feedback

Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here.

You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.

Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution. ↩

gemini-code-assist

Code Review

This pull request introduces a significant and positive restructuring of the application's layout components. Key improvements include centralizing header height management into a dedicated shared/headerHeight.ts file, refactoring the main header into a two-row layout, and introducing a new TitleAction component to group page-related actions under the main title. These changes enhance code quality, maintainability, and user experience. I have a few minor suggestions to further improve the implementation.

gemini-code-assist · 2026-01-09T10:03:04Z

src/components/MDXContent.tsx

+        {...props}
+      />
+    ),
+    [pathConfig, filePath, pageUrl]


The dependency array for this useCallback is missing buildType and language. Since these props are passed down to the H1 component and used in its logic, they should be included in the dependency array to prevent stale closures if they ever change during the component's lifecycle.

Suggested change

[pathConfig, filePath, pageUrl]

[pathConfig, filePath, pageUrl, buildType, language]

gemini-code-assist · 2026-01-09T10:03:04Z

src/components/Layout/RightNav/RightNav.tsx

+    setTimeout(() => {
+      // Observe all heading elements
+      headingIds.forEach((id) => {
+        const element = document.getElementById(id);
+        if (element) {
+          observer.observe(element);
+        }
+      });
+    }, 1000);


Using a fixed setTimeout of 1000ms can be brittle, as it assumes the page will always render within that time. On slower devices or connections, this might not be enough time, causing the IntersectionObserver to miss elements.

Consider adding a comment to explain why this delay is necessary. For a more robust solution, you could explore using requestAnimationFrame or checking for the existence of the last element in headingIds before setting up the observers.

gemini-code-assist · 2026-01-09T10:03:04Z

src/components/Layout/TitleAction/TitleAction.tsx

+            height: "20px !important",
+            backgroundColor: `${theme.palette.carbon[400]} !important`,


The use of !important here should be avoided if possible, as it can make styles difficult to override and debug later. It's better to rely on CSS specificity. Have you tried removing !important to see if the styles are still applied correctly? MUI's sx prop usually has high enough specificity.

Suggested change

height: "20px !important",

backgroundColor: `${theme.palette.carbon[400]} !important`,

height: "20px",

backgroundColor: `${theme.palette.carbon[400]}`,

…lity - Introduced HeaderAction, HeaderNav, and LangSwitch components to improve the header layout and user experience. - Implemented a TiDB AI button in HeaderAction for enhanced interactivity. - Added mobile and desktop navigation stacks in HeaderNav for better accessibility. - Integrated a language switcher in LangSwitch to support multiple locales. - Updated the theme with a color adjustment for improved visual consistency.

- Simplified HeaderAction by consolidating search and action button elements for improved layout. - Updated HeaderNav to remove unused imports and commented-out code, streamlining the component. - Added new HeaderNavMobile component for better mobile navigation experience. - Adjusted spacing and styles in various components for consistency and improved usability. - Enhanced LangSwitch with clearer language labels and updated button styles. - Increased search input width and height for better accessibility.

- Moved getPageType and PageType type definitions from shared/utils to shared/getPageType for better modularity. - Updated imports across various components to reflect the new location of getPageType, ensuring consistent usage throughout the codebase. - Cleaned up unused imports in several components, enhancing overall code clarity and maintainability.

- Replaced instances of getPageType with the new usePageType hook across various components to enhance code consistency and maintainability. - Updated imports to reflect the new structure, ensuring all components utilize the updated page type logic. - Removed the deprecated getPageType utility, streamlining the codebase and improving clarity.

…omponents - Updated multiple components to use the new ChevronDownIcon for consistency in the UI. - Removed imports of the deprecated KeyboardArrowDownIcon, streamlining the codebase. - Added ChevronDownIcon SVG file to the media/icons directory for improved visual representation.

- Introduced a new navigation configuration system in HeaderNav, allowing for dynamic rendering of navigation items and groups based on conditions. - Added NavGroup and NavMenuItem components to improve the structure and maintainability of the navigation logic. - Implemented a default navigation configuration generator to streamline the setup of navigation items based on user cloud plans. - Updated imports and added new icons for improved visual representation in the navigation menu. - Cleaned up unused code and optimized component rendering for better performance.

- Added onSelectedNavItemChange prop to Header, HeaderNavStack, and LeftNav components to manage selected navigation items. - Implemented a recursive function to find and notify the selected navigation item in HeaderNavStack. - Updated LeftNavDesktop to display the selected navigation item with improved styling and interaction. - Integrated selectedNavItem state management in DocTemplate for better navigation context. - Adjusted styles in various components for consistency and improved user experience.

- Replaced ActionButton with Button in HeaderAction for consistency in component usage. - Added secondary color styling for outlined and contained button variants in the theme. - Adjusted button styles to enhance visual coherence and user experience across the application.

…sistency - Removed the custom ActionButton component and replaced it with the standard Button component from MUI. - Updated button styles to use the secondary color variant for improved visual consistency across the FeedbackSection. - Cleaned up imports by removing the unused ActionButton import, streamlining the codebase.

- Simplified the LangSwitch component by removing unnecessary padding and adjusting the end icon styling. - Updated the theme to ensure consistent margin settings for button icons, enhancing overall button appearance across the application.

- Streamlined Box component styles in NavGroup by removing unnecessary sx prop and directly applying display, flexDirection, and gap properties. - Enhanced the layout of child components for better visual consistency and maintainability.

…nd scroll position - Removed custom StyledTreeItem in favor of MUI's TreeItem for consistency. - Implemented session storage handling for expanded tree nodes and scroll position restoration. - Updated theme styles for TreeItem to improve visual consistency and user experience. - Cleaned up unused imports and streamlined component logic for better maintainability.

…ement - Added clearAllNavStates function to clear session storage for navigation states across components. - Integrated clearAllNavStates in NavMenuItem and NavButton click handlers to ensure consistent navigation behavior. - Updated LeftNav component to utilize clearAllNavStates on item selection for improved user experience.

…sistency - Added disableRipple property to MenuItem components for a cleaner interaction experience. - Simplified Divider components by removing unnecessary margin settings. - Enhanced theme styles for MuiMenu to improve layout and item interaction, including active state styling and list organization. - Streamlined MenuItem styles for better visual consistency across the VersionSelect component.

- Updated the styling for selected TreeItem states to include focused and hover states for improved visual feedback. - Ensured consistent background color and icon fill for selected items, enhancing user experience in the navigation tree.

- Changed the import path for CloudPlan to align with the project structure. - Replaced string literals with CloudPlan enum values in the getTidbCloudFilesFromTocs and determineInDefaultPlan functions for improved type safety and consistency.

* refactor: update CloudPlan imports and usage for consistency - Changed the import path for CloudPlan to align with the project structure. - Replaced string literals with CloudPlan enum values in the getTidbCloudFilesFromTocs and determineInDefaultPlan functions for improved type safety and consistency. * refactor: enhance URL resolver with new link and path mapping utilities - Introduced a comprehensive URL resolver module to map source file paths to published URLs. - Added support for branch aliasing and pattern matching for dynamic URL generation. - Implemented link resolution for markdown links, improving navigation consistency. - Created configuration and utility files for managing path and link mappings, enhancing maintainability and scalability. * feat: add Jest configuration and enhance URL resolution utilities - Introduced Jest configuration for TypeScript tests to improve testing capabilities. - Updated package.json to include Jest and ts-jest dependencies for TypeScript support. - Refactored URL resolution logic to utilize new link resolver utilities, enhancing markdown link handling. - Deprecated the old URL generation method in favor of the new calculateFileUrl function for better maintainability. - Added comprehensive tests for the new URL resolver functionalities, ensuring robust link resolution and alias handling. * refactor: enhance link resolver configuration and logic for improved mapping - Updated link resolver configuration to clarify direct and path-based mapping rules. - Refactored link resolution logic to streamline the processing of link mappings and conditions. - Improved handling of namespace transformations and default language settings in URL generation. - Enhanced type definitions for better clarity on mapping rules and conditions. * refactor: enhance URL resolution logic and link handling for tidbcloud - Updated URL resolver configuration to support dedicated _index files for tidbcloud, improving path mapping accuracy. - Refactored link resolution logic to handle branch-specific paths and filename transformations more effectively. - Enhanced test cases to cover new URL patterns and ensure robust handling of markdown links and fallback scenarios. - Cleaned up deprecated rules and improved overall maintainability of the URL resolver module. * refactor: update mdxAstToToc function to use slug for path resolution - Modified the mdxAstToToc function to accept slug instead of config for improved clarity in path resolution. - Updated related functions in create-types and cloud-plan to ensure consistent usage of slug for TOC generation. - Cleaned up deprecated code and improved overall maintainability of the TOC handling logic. * refactor: simplify selectedId logic in LeftNavTree component - Streamlined the assignment of selectedId by removing unnecessary conditional checks, ensuring it defaults to storedId or undefined. - Improved code clarity and maintainability in the ControlledTreeView function by reducing complexity in state management. * refactor: remove unnecessary logging in URL resolution logic - Eliminated debug logging related to currentFileUrl and resolvedPath in the URL resolution process for tidbcloud. - Improved code cleanliness and maintainability by reducing clutter in the content plugin's index file. * refactor: update navigation and frontmatter handling in Gatsby setup - Replaced createExtraType with createFrontmatter and createNavs in gatsby-node.js for improved type management. - Introduced new functions for generating navigation and frontmatter types, enhancing the structure of Markdown nodes. - Updated URL generation logic in path.ts to include shared namespace handling for better path resolution. - Refactored navigation generation in create-doc-home and create-docs to utilize the new navigation functions. - Improved overall code clarity and maintainability by consolidating navigation logic and enhancing type definitions. * feat: add new link resolver configuration for Tidb documentation - Introduced a new path pattern for Tidb documentation in the link resolver configuration, allowing for better URL mapping. - Enhanced link resolution logic to support specific folder conditions, improving navigation for documentation categories such as "develop," "best-practice," "api," and "releases." - Integrated configuration data from the docs.json file to streamline the management of documentation versions.

…to feat/restructure

- Eliminated the import of CONFIG from docs.json in the link resolver configuration file to improve code cleanliness and maintainability.

- Added TOCNamespace enum to categorize documentation namespaces, enhancing clarity and maintainability. - Refactored navigation logic in various components to utilize the new TOCNamespace for better type safety and consistency. - Updated link resolver and path generation functions to support TOCNamespace, improving URL mapping and navigation accuracy. - Enhanced the layout and selection logic in navigation components to leverage the new namespace structure, ensuring a more intuitive user experience.

- Reorganized SHARED_NAMESPACE_RULES to include TiDBCloud and TiDBInKubernetes namespaces for improved clarity. - Adjusted navigation paths in HeaderNavConfigData to reflect updated folder structure. - Modified useCloudPlan and DocTemplate to utilize TOCNamespace for better type safety and consistency in navigation logic. - Enhanced overall maintainability and accuracy of URL mappings across components.

…ernetes - Updated source and target patterns for tidb and tidb-in-kubernetes to improve URL mapping accuracy. - Introduced filename transformation rules to ignore specific filenames for better handling of documentation files. - Added branch alias mappings for both tidb and tidb-in-kubernetes to streamline version management and navigation consistency.

…ator - Introduced new link and target patterns for tidb-operator in both link-resolver and url-resolver configurations to enhance navigation and URL mapping. - Updated HeaderNavConfigData to reflect the new path for TiDB Operator Releases. - Enhanced VersionSelect component to ensure correct selection state for different versions.

- Modified link and target patterns in link-resolver and URL-resolver configurations to include the specific path for tidb releases. - Adjusted navigation paths in HeaderNavConfigData to reflect the updated structure for TiDB Self-Managed Releases. - Updated branch reference in SHARED_NAMESPACE_RULES for improved clarity and consistency in version management.

shhdgit added 8 commits December 18, 2025 15:15

chore: update subproject commit reference in docs

e39608c

fix: update feedback translation for clarity in English and Japanese

468fbf0

- Changed the feedback string from "Request docs changes" to "Report a doc issue" in both English and Japanese translation files for improved clarity and user understanding.

fix: update TitleAction component for improved layout and button text

af715b7

- Added flexWrap property to the TitleAction component to enhance layout responsiveness. - Changed button text from "Copy Markdown for LLM" to "Copy for LLM" for brevity and clarity.

fix: update color in RightNav component for better visibility

6cb99b0

- Changed the text color in the RightNav component from carbon[600] to carbon[700] to enhance readability and visual contrast.

fix: conditionally render TOC in RightNav component

5f229c9

- Updated the RightNav component to only display the Table of Contents (TOC) when it contains items, improving layout and preventing unnecessary empty space.

gemini-code-assist bot reviewed Jan 9, 2026

View reviewed changes

Merge branch 'master' into feat/restructure

0915790

vercel bot deployed to Preview – website-docs January 9, 2026 10:06 View deployment

shhdgit added 9 commits January 10, 2026 19:17

vercel bot deployed to Preview – website-docs January 12, 2026 02:15 View deployment

vercel bot deployed to Preview – website-docs January 12, 2026 03:10 View deployment

shhdgit added 2 commits January 12, 2026 11:16

vercel bot deployed to Preview – website-docs January 12, 2026 04:15 View deployment

vercel bot deployed to Preview – website-docs January 12, 2026 04:24 View deployment

vercel bot deployed to Preview – website-docs January 12, 2026 06:59 View deployment

vercel bot deployed to Preview – website-docs January 12, 2026 07:08 View deployment

shhdgit added 3 commits January 13, 2026 00:51

Merge branch 'feat/restructure' of github.com:pingcap/website-docs in…

56953c5

…to feat/restructure

vercel bot had a problem deploying to Preview – website-docs January 14, 2026 03:04 Failure

shhdgit added 2 commits January 14, 2026 11:13

refactor: remove unused CONFIG import from link resolver configuration

e2e2965

- Eliminated the import of CONFIG from docs.json in the link resolver configuration file to improve code cleanliness and maintainability.

vercel bot had a problem deploying to Preview – website-docs January 14, 2026 06:33 Failure

vercel bot had a problem deploying to Preview – website-docs January 14, 2026 07:55 Failure

vercel bot had a problem deploying to Preview – website-docs January 14, 2026 08:16 Failure

vercel bot had a problem deploying to Preview – website-docs January 14, 2026 09:26 Failure

vercel bot had a problem deploying to Preview – website-docs January 14, 2026 09:29 Failure

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Feat/restructure #668

Feat/restructure #668

Uh oh!

shhdgit commented Jan 9, 2026 •

edited

Loading

Uh oh!

vercel bot commented Jan 9, 2026 •

edited

Loading

Uh oh!

gemini-code-assist bot commented Jan 9, 2026

Uh oh!

gemini-code-assist bot left a comment

Uh oh!

gemini-code-assist bot Jan 9, 2026

Uh oh!

gemini-code-assist bot Jan 9, 2026

Uh oh!

gemini-code-assist bot Jan 9, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

	[pathConfig, filePath, pageUrl]
	[pathConfig, filePath, pageUrl, buildType, language]

		height: "20px !important",
		backgroundColor: `${theme.palette.carbon[400]} !important`,

Feat/restructure #668

Are you sure you want to change the base?

Feat/restructure #668

Uh oh!

Conversation

shhdgit commented Jan 9, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

vercel bot commented Jan 9, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

gemini-code-assist bot commented Jan 9, 2026

Summary of Changes

Highlights

Footnotes

Uh oh!

gemini-code-assist bot left a comment

Choose a reason for hiding this comment

Code Review

Uh oh!

gemini-code-assist bot Jan 9, 2026

Choose a reason for hiding this comment

Uh oh!

gemini-code-assist bot Jan 9, 2026

Choose a reason for hiding this comment

Uh oh!

gemini-code-assist bot Jan 9, 2026

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

shhdgit commented Jan 9, 2026 •

edited

Loading

vercel bot commented Jan 9, 2026 •

edited

Loading