From b63d73924ec6f77aef9d7a63a3ea1ca2faa1ae85 Mon Sep 17 00:00:00 2001
From: "Mingyu Chen (Rayner)" <yunyou@selectdb.com>
Date: Wed, 6 May 2026 09:00:50 -0700
Subject: [PATCH 1/2] [fix] fix banner and docs

---
 src/components/home-next/HomeNext.scss  | 44 ---------------------
 src/components/home-next/LayoutNext.tsx | 51 ++-----------------------
 src/components/home-next/NavbarNext.tsx | 41 ++++----------------
 src/theme/Layout/index.tsx              |  2 +
 4 files changed, 12 insertions(+), 126 deletions(-)

diff --git a/src/components/home-next/HomeNext.scss b/src/components/home-next/HomeNext.scss
index 1627a0451a701..4e9ed5807f0a1 100644
--- a/src/components/home-next/HomeNext.scss
+++ b/src/components/home-next/HomeNext.scss
@@ -23,47 +23,3 @@
     overflow-x: clip;
 }
 
-.home-next-preview-banner {
-    position: sticky;
-    top: 0;
-    z-index: 110;
-    width: 100%;
-    background: #FFD23F;
-    color: #0F1A14;
-    text-align: center;
-    padding: 8px 16px;
-    font-family: 'JetBrains Mono', 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
-    font-size: 13px;
-    font-weight: 500;
-    line-height: 1.4;
-    letter-spacing: 0.01em;
-    border-bottom: 1px solid rgba(15, 26, 20, 0.12);
-
-    &__text {
-        display: inline-block;
-        max-width: 1180px;
-    }
-
-    &__link {
-        background: none;
-        border: none;
-        padding: 0;
-        margin: 0;
-        font: inherit;
-        color: inherit;
-        text-decoration: underline;
-        text-underline-offset: 2px;
-        cursor: pointer;
-
-        &:hover {
-            text-decoration: none;
-        }
-    }
-}
-
-@media (max-width: 640px) {
-    .home-next-preview-banner {
-        font-size: 12px;
-        padding: 8px 12px;
-    }
-}
diff --git a/src/components/home-next/LayoutNext.tsx b/src/components/home-next/LayoutNext.tsx
index 158b53400b629..fe125b3fb72cb 100644
--- a/src/components/home-next/LayoutNext.tsx
+++ b/src/components/home-next/LayoutNext.tsx
@@ -1,9 +1,10 @@
-import React, { JSX, useEffect, useRef } from 'react';
+import React, { JSX } from 'react';
 import { PageMetadata } from '@docusaurus/theme-common';
 import LayoutProvider from '@theme/Layout/Provider';
 import Footer from '@theme/Footer';
 import AnnouncementBar from '@theme/AnnouncementBar';
 import { NavbarNext } from './NavbarNext';
+import { PreviewBanner } from './PreviewBanner';
 
 interface LayoutNextProps {
     title?: string;
@@ -14,57 +15,11 @@ interface LayoutNextProps {
 }
 
 export function LayoutNext({ title, description, onSwitchBack, children }: LayoutNextProps): JSX.Element {
-    const bannerRef = useRef<HTMLDivElement>(null);
-
-    useEffect(() => {
-        const el = bannerRef.current;
-        if (!el) return;
-        const update = () => {
-            document.documentElement.style.setProperty(
-                '--home-next-banner-height',
-                `${el.offsetHeight}px`,
-            );
-        };
-        update();
-        const ro = new ResizeObserver(update);
-        ro.observe(el);
-        return () => {
-            ro.disconnect();
-            document.documentElement.style.removeProperty('--home-next-banner-height');
-        };
-    }, []);
-
     return (
         <LayoutProvider>
             <PageMetadata title={title} description={description} />
             <AnnouncementBar />
-            <div ref={bannerRef} className="home-next-preview-banner" role="status">
-                <span className="home-next-preview-banner__text">
-                    You're viewing the preview version of this page. For the full experience, please return to the
-                    {' '}
-                    <button
-                        type="button"
-                        className="home-next-preview-banner__link"
-                        onClick={() => {
-                            if (onSwitchBack) {
-                                onSwitchBack();
-                                return;
-                            }
-                            if (typeof window !== 'undefined') {
-                                try {
-                                    window.localStorage.removeItem('doris-home-version');
-                                } catch {
-                                    // localStorage may be unavailable (private mode / disabled cookies)
-                                }
-                                window.location.assign('/');
-                            }
-                        }}
-                    >
-                        classic homepage
-                    </button>
-                    .
-                </span>
-            </div>
+            <PreviewBanner onSwitchBack={onSwitchBack} />
             <NavbarNext />
             <main className="home-next-main">{children}</main>
             <Footer />
diff --git a/src/components/home-next/NavbarNext.tsx b/src/components/home-next/NavbarNext.tsx
index 7d34f7eae4e46..8d758908c6357 100644
--- a/src/components/home-next/NavbarNext.tsx
+++ b/src/components/home-next/NavbarNext.tsx
@@ -4,11 +4,12 @@ import { useLocation } from '@docusaurus/router';
 import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
 import DropdownNavbarItem from '@theme/NavbarItem/DropdownNavbarItem';
 import { getLocalePrefix, isDocsNextPath, isReleasesPath, normalizePathname } from '@site/src/utils/locale';
+import { STAR_COUNT } from '@site/src/constant/github.data';
 import './NavbarNext.scss';
 
 const GITHUB_REPO = 'apache/doris';
-const FALLBACK_STARS = '-';
 const HOME_VERSION_KEY = 'doris-home-version';
+const STAR_DISPLAY = `${STAR_COUNT}k`;
 
 function safeSetLocalStorage(key: string, value: string): void {
     try {
@@ -18,33 +19,6 @@ function safeSetLocalStorage(key: string, value: string): void {
     }
 }
 
-function formatStars(n: number): string {
-    if (n >= 1000) return `${(n / 1000).toFixed(1)}k`;
-    return String(n);
-}
-
-function useGitHubStars(repo: string, fallback: string): string {
-    const [stars, setStars] = useState(fallback);
-    useEffect(() => {
-        let cancelled = false;
-        const timer = window.setTimeout(() => {
-            fetch(`https://api.github.com/repos/${repo}`)
-                .then(r => (r.ok ? r.json() : null))
-                .then(data => {
-                    if (!cancelled && data && typeof data.stargazers_count === 'number') {
-                        setStars(formatStars(data.stargazers_count));
-                    }
-                })
-                .catch(() => { /* keep fallback on network/CORS/rate-limit errors */ });
-        }, 1200);
-        return () => {
-            cancelled = true;
-            window.clearTimeout(timer);
-        };
-    }, [repo]);
-    return stars;
-}
-
 interface DropdownItem {
     label: string;
     href: string;
@@ -138,7 +112,6 @@ export function NavbarNext(): JSX.Element {
         i18n: { currentLocale, defaultLocale, localeConfigs },
     } = useDocusaurusContext();
     const { pathname, search, hash } = useLocation();
-    const stars = useGitHubStars(GITHUB_REPO, FALLBACK_STARS);
     const [mobileOpen, setMobileOpen] = useState(false);
     const localePrefix = getLocalePrefix(currentLocale, defaultLocale);
     const docsHref = `${localePrefix}/docs-next/dev/getting-started/what-is-apache-doris`;
@@ -152,7 +125,7 @@ export function NavbarNext(): JSX.Element {
     const localeSwitchLabel = currentLocale === 'zh-CN' ? localeConfigs[defaultLocale]?.label ?? 'English' : '中文';
     const currentLocalizedPath = normalizePathname(pathname, [defaultLocale, 'zh-CN']);
     const buildLocaleHref = (locale: string) =>
-        `${locale === defaultLocale ? '' : `/${locale}`}${currentLocalizedPath}${search}${hash}`;
+        `pathname://${locale === defaultLocale ? '' : `/${locale}`}${currentLocalizedPath}${search}${hash}`;
     const localeItems = [defaultLocale, 'zh-CN']
         .filter((locale, index, arr) => arr.indexOf(locale) === index)
         .map(locale => ({
@@ -245,12 +218,12 @@ export function NavbarNext(): JSX.Element {
                         target="_blank"
                         rel="noopener noreferrer"
                         className="navbar-next__star-link"
-                        aria-label={`Star Apache Doris on GitHub (${stars} stars)`}
+                        aria-label={`Star Apache Doris on GitHub (${STAR_DISPLAY} stars)`}
                     >
                         <StarIcon />
                         <span>Star</span>
                         <span className="navbar-next__star-divider" />
-                        <span className="navbar-next__star-count">{stars}</span>
+                        <span className="navbar-next__star-count">{STAR_DISPLAY}</span>
                         <span className="navbar-next__star-divider" />
                         <GitHubIcon />
                     </a>
@@ -340,12 +313,12 @@ export function NavbarNext(): JSX.Element {
                         target="_blank"
                         rel="noopener noreferrer"
                         className="navbar-next__star-link"
-                        aria-label={`Star Apache Doris on GitHub (${stars} stars)`}
+                        aria-label={`Star Apache Doris on GitHub (${STAR_DISPLAY} stars)`}
                     >
                         <StarIcon />
                         <span>Star</span>
                         <span className="navbar-next__star-divider" />
-                        <span className="navbar-next__star-count">{stars}</span>
+                        <span className="navbar-next__star-count">{STAR_DISPLAY}</span>
                         <span className="navbar-next__star-divider" />
                         <GitHubIcon />
                     </a>
diff --git a/src/theme/Layout/index.tsx b/src/theme/Layout/index.tsx
index 1c900fed9be52..2aa123c2558c7 100644
--- a/src/theme/Layout/index.tsx
+++ b/src/theme/Layout/index.tsx
@@ -17,6 +17,7 @@ import type { Props } from '@theme/Layout';
 import styles from './styles.module.css';
 import { useHistory } from '@docusaurus/router';
 import { NavbarNext } from '@site/src/components/home-next/NavbarNext';
+import { PreviewBanner } from '@site/src/components/home-next/PreviewBanner';
 import { isDocsNextPath, isReleasesPath, isEventsPath } from '@site/src/utils/locale';
 interface DataType {
     showSearchPageMobile: boolean;
@@ -89,6 +90,7 @@ export default function Layout(props: Props): JSX.Element {
 
                 <SkipToContent />
                 <AnnouncementBar />
+                {useNextNavbar && <PreviewBanner />}
                 {useNextNavbar ? <NavbarNext /> : <Navbar />}
                 {!useNextNavbar && showSearchPageMobile ? (
                     <div ref={searchPageDom}>

From b20793c7db482c52aef60718586ce1d4efdaae6d Mon Sep 17 00:00:00 2001
From: "Mingyu Chen (Rayner)" <yunyou@selectdb.com>
Date: Wed, 6 May 2026 09:42:03 -0700
Subject: [PATCH 2/2] [fix] add missing PreviewBanner files

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 src/components/home-next/PreviewBanner.scss | 44 ++++++++++++++++
 src/components/home-next/PreviewBanner.tsx  | 58 +++++++++++++++++++++
 2 files changed, 102 insertions(+)
 create mode 100644 src/components/home-next/PreviewBanner.scss
 create mode 100644 src/components/home-next/PreviewBanner.tsx

diff --git a/src/components/home-next/PreviewBanner.scss b/src/components/home-next/PreviewBanner.scss
new file mode 100644
index 0000000000000..7ba599a987e19
--- /dev/null
+++ b/src/components/home-next/PreviewBanner.scss
@@ -0,0 +1,44 @@
+.home-next-preview-banner {
+    position: sticky;
+    top: 0;
+    z-index: 110;
+    width: 100%;
+    background: #FFD23F;
+    color: #0F1A14;
+    text-align: center;
+    padding: 8px 16px;
+    font-family: 'JetBrains Mono', 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
+    font-size: 13px;
+    font-weight: 500;
+    line-height: 1.4;
+    letter-spacing: 0.01em;
+    border-bottom: 1px solid rgba(15, 26, 20, 0.12);
+
+    &__text {
+        display: inline-block;
+        max-width: 1180px;
+    }
+
+    &__link {
+        background: none;
+        border: none;
+        padding: 0;
+        margin: 0;
+        font: inherit;
+        color: inherit;
+        text-decoration: underline;
+        text-underline-offset: 2px;
+        cursor: pointer;
+
+        &:hover {
+            text-decoration: none;
+        }
+    }
+}
+
+@media (max-width: 640px) {
+    .home-next-preview-banner {
+        font-size: 12px;
+        padding: 8px 12px;
+    }
+}
diff --git a/src/components/home-next/PreviewBanner.tsx b/src/components/home-next/PreviewBanner.tsx
new file mode 100644
index 0000000000000..208cde8413b84
--- /dev/null
+++ b/src/components/home-next/PreviewBanner.tsx
@@ -0,0 +1,58 @@
+import React, { JSX, useEffect, useRef } from 'react';
+import './PreviewBanner.scss';
+
+interface PreviewBannerProps {
+    onSwitchBack?: () => void;
+}
+
+export function PreviewBanner({ onSwitchBack }: PreviewBannerProps): JSX.Element {
+    const bannerRef = useRef<HTMLDivElement>(null);
+
+    useEffect(() => {
+        const el = bannerRef.current;
+        if (!el) return;
+        const update = () => {
+            document.documentElement.style.setProperty(
+                '--home-next-banner-height',
+                `${el.offsetHeight}px`,
+            );
+        };
+        update();
+        const ro = new ResizeObserver(update);
+        ro.observe(el);
+        return () => {
+            ro.disconnect();
+            document.documentElement.style.removeProperty('--home-next-banner-height');
+        };
+    }, []);
+
+    return (
+        <div ref={bannerRef} className="home-next-preview-banner" role="status">
+            <span className="home-next-preview-banner__text">
+                You're viewing the preview version of this page. For the full experience, please return to the
+                {' '}
+                <button
+                    type="button"
+                    className="home-next-preview-banner__link"
+                    onClick={() => {
+                        if (onSwitchBack) {
+                            onSwitchBack();
+                            return;
+                        }
+                        if (typeof window !== 'undefined') {
+                            try {
+                                window.localStorage.removeItem('doris-home-version');
+                            } catch {
+                                // localStorage may be unavailable (private mode / disabled cookies)
+                            }
+                            window.location.assign('/');
+                        }
+                    }}
+                >
+                    classic homepage
+                </button>
+                .
+            </span>
+        </div>
+    );
+}