From 5e22d9d36fa6eaae0b5700353a25c5b30059570e Mon Sep 17 00:00:00 2001
From: dev <verc20.dev@proton.me>
Date: Wed, 5 Nov 2025 17:14:25 +0800
Subject: [PATCH] fix: note head nav related

---
 src/renderer/src/pages/notes/HeaderNavbar.tsx | 79 +++++++++----------
 1 file changed, 36 insertions(+), 43 deletions(-)

diff --git a/src/renderer/src/pages/notes/HeaderNavbar.tsx b/src/renderer/src/pages/notes/HeaderNavbar.tsx
index 81f5668395..044e87bbe6 100644
--- a/src/renderer/src/pages/notes/HeaderNavbar.tsx
+++ b/src/renderer/src/pages/notes/HeaderNavbar.tsx
@@ -1,4 +1,3 @@
-import { BreadcrumbItem, Breadcrumbs } from '@heroui/react'
 import { loggerService } from '@logger'
 import { NavbarCenter, NavbarHeader, NavbarRight } from '@renderer/components/app/Navbar'
 import { HStack } from '@renderer/components/Layout'
@@ -6,7 +5,7 @@ import { useActiveNode } from '@renderer/hooks/useNotesQuery'
 import { useNotesSettings } from '@renderer/hooks/useNotesSettings'
 import { useShowWorkspace } from '@renderer/hooks/useShowWorkspace'
 import { findNode } from '@renderer/services/NotesTreeService'
-import { Dropdown, Input, Tooltip } from 'antd'
+import { Breadcrumb, Dropdown, Input, Tooltip } from 'antd'
 import { t } from 'i18next'
 import { MoreHorizontal, PanelLeftClose, PanelRightClose, Star } from 'lucide-react'
 import { useCallback, useEffect, useRef, useState } from 'react'
@@ -191,42 +190,43 @@ const HeaderNavbar = ({ notesTree, getCurrentNoteContent, onToggleStar, onExpand
       </HStack>
       <NavbarCenter style={{ flex: 1, minWidth: 0 }}>
         <BreadcrumbsContainer>
-          <Breadcrumbs style={{ borderRadius: 0 }}>
-            {breadcrumbItems.map((item, index) => {
+          <Breadcrumb
+            separator={'>'}
+            items={breadcrumbItems.map((item, index) => {
               const isLastItem = index === breadcrumbItems.length - 1
               const isCurrentNote = isLastItem && !item.isFolder
-
-              return (
-                <BreadcrumbItem key={item.key} isCurrent={isLastItem}>
-                  {isCurrentNote ? (
-                    <TitleInputWrapper>
-                      <TitleInput
-                        ref={titleInputRef}
-                        value={titleValue}
-                        onChange={handleTitleChange}
-                        onBlur={handleTitleBlur}
-                        onKeyDown={handleTitleKeyDown}
-                        size="small"
-                        variant="borderless"
-                        style={{
-                          fontSize: 'inherit',
-                          padding: 0,
-                          height: 'auto',
-                          lineHeight: 'inherit'
-                        }}
-                      />
-                    </TitleInputWrapper>
-                  ) : (
-                    <BreadcrumbTitle
-                      onClick={() => handleBreadcrumbClick(item)}
-                      $clickable={item.isFolder && !isLastItem}>
-                      {item.title}
-                    </BreadcrumbTitle>
-                  )}
-                </BreadcrumbItem>
-              )
-            })}
-          </Breadcrumbs>
+              return {
+                title: (
+                  <div key={item.key} className="flex">
+                    {isCurrentNote ? (
+                      <TitleInputWrapper>
+                        <TitleInput
+                          ref={titleInputRef}
+                          value={titleValue}
+                          onChange={handleTitleChange}
+                          onBlur={handleTitleBlur}
+                          onKeyDown={handleTitleKeyDown}
+                          size="small"
+                          variant="borderless"
+                          style={{
+                            fontSize: 'inherit',
+                            padding: 0,
+                            height: 'auto',
+                            lineHeight: 'inherit'
+                          }}
+                        />
+                      </TitleInputWrapper>
+                    ) : (
+                      <BreadcrumbTitle
+                        onClick={() => handleBreadcrumbClick(item)}
+                        $clickable={item.isFolder && !isLastItem}>
+                        {item.title}
+                      </BreadcrumbTitle>
+                    )}
+                  </div>
+                )
+              }
+            })}></Breadcrumb>
         </BreadcrumbsContainer>
       </NavbarCenter>
       <NavbarRight style={{ paddingRight: 0 }}>
@@ -347,13 +347,6 @@ export const BreadcrumbsContainer = styled.div`
     max-width: none !important;
   }
 
-  /* 覆盖 HeroUI BreadcrumbItem 的样式 */
-  & li:last-child [data-slot="item"] {
-    flex: 1 !important;
-    width: 100% !important;
-    max-width: none !important;
-  }
-
   /* 更强的样式覆盖 */
   & li:last-child * {
     max-width: none !important;