diff --git a/src/main/config.ts b/src/main/config.ts index 84dc1b846d..32665a55b8 100644 --- a/src/main/config.ts +++ b/src/main/config.ts @@ -11,13 +11,13 @@ if (isDev) { export const DATA_PATH = getDataPath() export const titleBarOverlayDark = { - height: 40, + height: 42, color: 'rgba(255,255,255,0)', symbolColor: '#fff' } export const titleBarOverlayLight = { - height: 40, + height: 42, color: 'rgba(255,255,255,0)', symbolColor: '#000' } diff --git a/src/main/services/WindowService.ts b/src/main/services/WindowService.ts index 1ae16d5556..3f0cb8f84a 100644 --- a/src/main/services/WindowService.ts +++ b/src/main/services/WindowService.ts @@ -56,14 +56,14 @@ export class WindowService { minHeight: 600, show: false, autoHideMenuBar: true, - transparent: isMac, + transparent: false, vibrancy: 'sidebar', visualEffectState: 'active', titleBarStyle: 'hidden', titleBarOverlay: nativeTheme.shouldUseDarkColors ? titleBarOverlayDark : titleBarOverlayLight, backgroundColor: isMac ? undefined : nativeTheme.shouldUseDarkColors ? '#181818' : '#FFFFFF', darkTheme: nativeTheme.shouldUseDarkColors, - trafficLightPosition: { x: 15, y: 12 }, + trafficLightPosition: { x: 12, y: 12 }, ...(isLinux ? { icon } : {}), webPreferences: { preload: join(__dirname, '../preload/index.js'), diff --git a/src/renderer/src/assets/styles/color.scss b/src/renderer/src/assets/styles/color.scss index e5a7930a11..ef6d1d143f 100644 --- a/src/renderer/src/assets/styles/color.scss +++ b/src/renderer/src/assets/styles/color.scss @@ -29,7 +29,7 @@ --color-text-secondary: rgba(235, 235, 245, 0.7); --color-icon: #ffffff99; --color-icon-white: #ffffff; - --color-border: #000; + --color-border: #383838; --color-border-soft: #ffffff10; --color-border-mute: #ffffff05; --color-error: #f44336; @@ -56,7 +56,7 @@ --navbar-background-mac: rgba(20, 20, 20, 0.55); --navbar-background: #1f1f1f; - --navbar-height: 45px; + --navbar-height: 42px; --sidebar-width: 50px; --status-bar-height: 40px; --input-bar-height: 100px; diff --git a/src/renderer/src/components/app/MainNavbar.tsx b/src/renderer/src/components/app/MainNavbar.tsx index 3a8eb23f72..8ec6bd06a5 100644 --- a/src/renderer/src/components/app/MainNavbar.tsx +++ b/src/renderer/src/components/app/MainNavbar.tsx @@ -1,16 +1,27 @@ +import { isMac } from '@renderer/config/constant' import { EVENT_NAMES, EventEmitter } from '@renderer/services/EventService' import { Tooltip } from 'antd' import { t } from 'i18next' -import { MessageSquareDiff } from 'lucide-react' +import { MessageSquareDiff, Search } from 'lucide-react' import { FC } from 'react' import styled from 'styled-components' +import SearchPopup from '../Popups/SearchPopup' + interface Props {} const HeaderNavbar: FC = () => { return ( -
+
+ {!isMac && ( + + SearchPopup.show()}> + + + + )} +
EventEmitter.emit(EVENT_NAMES.ADD_NEW_TOPIC)} style={{ marginRight: 5 }}> @@ -32,6 +43,7 @@ const Container = styled.div` min-height: var(--navbar-height); background-color: transparent; -webkit-app-region: drag; + padding-left: ${isMac ? '75px' : '0'}; ` export const NavbarIcon = styled.div` @@ -69,4 +81,10 @@ export const NavbarIcon = styled.div` } ` +const NarrowIcon = styled(NavbarIcon)` + @media (max-width: 1000px) { + display: none; + } +` + export default HeaderNavbar diff --git a/src/renderer/src/components/app/MainSidebar.tsx b/src/renderer/src/components/app/MainSidebar.tsx index bc8a1a640b..79bd2885fb 100644 --- a/src/renderer/src/components/app/MainSidebar.tsx +++ b/src/renderer/src/components/app/MainSidebar.tsx @@ -15,14 +15,13 @@ import { Bot, ChevronDown, ChevronRight, + Compass, FileSearch, Folder, Languages, - LayoutGrid, MessageSquare, Moon, Palette, - Sparkle, SquareTerminal, Sun, SunMoon @@ -48,7 +47,6 @@ const MainSidebar: FC = () => { const [isAppMenuExpanded, setIsAppMenuExpanded] = useState(false) const location = useLocation() - const state = location.state const { pathname } = location const { activeAssistant, activeTopic, setActiveAssistant, setActiveTopic } = useChat() @@ -59,10 +57,9 @@ const MainSidebar: FC = () => { }, [navigate]) useEffect(() => { - state?.assistant && setActiveAssistant(state?.assistant) - state?.topic && setActiveTopic(state?.topic) - // eslint-disable-next-line react-hooks/exhaustive-deps - }, [state]) + const unsubscribe = EventEmitter.on(EVENT_NAMES.SHOW_TOPIC_SIDEBAR, () => setTab('topic')) + return () => unsubscribe() + }, []) useEffect(() => { const unsubscribe = EventEmitter.on(EVENT_NAMES.SWITCH_ASSISTANT, (assistantId: string) => { @@ -78,7 +75,7 @@ const MainSidebar: FC = () => { }, [assistants, setActiveAssistant]) useEffect(() => { - const canMinimize = topicPosition == 'left' ? !showAssistants : !showAssistants && !showTopics + const canMinimize = !showAssistants && !showTopics window.api.window.setMinimumSize(canMinimize ? 520 : 1080, 600) return () => { @@ -86,6 +83,10 @@ const MainSidebar: FC = () => { } }, [showAssistants, showTopics, topicPosition]) + useEffect(() => { + setIsAppMenuExpanded(false) + }, [activeAssistant.id, activeTopic.id]) + const onAvatarClick = () => { navigate('/settings/provider') } @@ -96,14 +97,15 @@ const MainSidebar: FC = () => { } const appMenuItems = [ - { icon: , text: t('agents.title'), path: '/agents' }, + // { icon: , text: t('agents.title'), path: '/agents' }, + { icon: , text: t('discover.title'), path: '/discover' }, { icon: , text: t('translate.title'), path: '/translate' }, { icon: , text: t('paintings.title'), path: `/paintings/${defaultPaintingProvider}` }, - { icon: , text: t('minapp.title'), path: '/apps' }, + // { icon: , text: t('minapp.title'), path: '/apps' }, { icon: , text: t('knowledge.title'), path: '/knowledge' }, { icon: , text: t('common.mcp'), path: '/mcp-servers' }, { icon: , text: t('files.title'), path: '/files' } @@ -111,10 +113,6 @@ const MainSidebar: FC = () => { const isRoutes = (path: string): boolean => pathname.startsWith(path) - if (location.pathname !== '/') { - return null - } - const onChageTab = (tab: Tab) => { setTab(tab) setIsAppMenuExpanded(false) @@ -124,6 +122,10 @@ const MainSidebar: FC = () => { return null } + if (location.pathname !== '/') { + return null + } + return ( @@ -187,7 +189,6 @@ const MainSidebar: FC = () => { activeTopic={activeTopic} setActiveAssistant={setActiveAssistant} setActiveTopic={setActiveTopic} - position="left" /> diff --git a/src/renderer/src/components/app/Navbar.tsx b/src/renderer/src/components/app/Navbar.tsx index 7dfe28452a..547d269caf 100644 --- a/src/renderer/src/components/app/Navbar.tsx +++ b/src/renderer/src/components/app/Navbar.tsx @@ -1,7 +1,7 @@ import { isLinux, isMac, isWindows } from '@renderer/config/constant' import { useFullscreen } from '@renderer/hooks/useFullscreen' import { Button } from 'antd' -import { X } from 'lucide-react' +import { ChevronDown, X } from 'lucide-react' import type { FC, PropsWithChildren } from 'react' import type { HTMLAttributes } from 'react' import { useNavigate } from 'react-router-dom' @@ -28,16 +28,46 @@ export const NavbarRight: FC = ({ children, ...props }) => { export const NavbarMain: FC = ({ children, ...props }) => { const isFullscreen = useFullscreen() - const navigate = useNavigate() return ( + {children} - + ) } +const CloseIconMac = () => { + const navigate = useNavigate() + + if (!isMac) { + return null + } + + return + - - - - - - + + + ) }