fix: sidebar navigation and active state handling
- 当固定在侧边栏的小程序被打开时,对应图标显示为被选中 - 修复点击两次主题切换按钮会导致当前 Webview 被错误关闭的问题 - 修复当 Webview 处于打开状态,点击侧边栏按钮无法立即跳转到对应界面的问题 - 修复打开帮助文档,其按钮没有显示为被选中的问题 - 修复在设置界面时打开帮助文档,设置按钮继续显示为被选中的问题
This commit is contained in:
parent
30e8cef9cc
commit
fa8bf61532
@ -77,9 +77,11 @@ const Sidebar: FC = () => {
|
|||||||
</AppsContainer>
|
</AppsContainer>
|
||||||
)}
|
)}
|
||||||
</MainMenusContainer>
|
</MainMenusContainer>
|
||||||
<Menus onClick={MinApp.onClose}>
|
<Menus>
|
||||||
<Tooltip title={t('docs.title')} mouseEnterDelay={0.8} placement="right">
|
<Tooltip title={t('docs.title')} mouseEnterDelay={0.8} placement="right">
|
||||||
<Icon onClick={onOpenDocs}>
|
<Icon
|
||||||
|
onClick={onOpenDocs}
|
||||||
|
className={minappShow && MinApp.app?.url === 'https://docs.cherry-ai.com/' ? 'active' : ''}>
|
||||||
<QuestionCircleOutlined />
|
<QuestionCircleOutlined />
|
||||||
</Icon>
|
</Icon>
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
@ -93,8 +95,14 @@ const Sidebar: FC = () => {
|
|||||||
</Icon>
|
</Icon>
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
<Tooltip title={t('settings.title')} mouseEnterDelay={0.8} placement="right">
|
<Tooltip title={t('settings.title')} mouseEnterDelay={0.8} placement="right">
|
||||||
<StyledLink onClick={() => to(isLocalAi ? '/settings/assistant' : '/settings/provider')}>
|
<StyledLink
|
||||||
<Icon className={pathname.startsWith('/settings') ? 'active' : ''}>
|
onClick={async () => {
|
||||||
|
if (minappShow) {
|
||||||
|
await MinApp.close()
|
||||||
|
}
|
||||||
|
await to(isLocalAi ? '/settings/assistant' : '/settings/provider')
|
||||||
|
}}>
|
||||||
|
<Icon className={pathname.startsWith('/settings') && !minappShow ? 'active' : ''}>
|
||||||
<i className="iconfont icon-setting" />
|
<i className="iconfont icon-setting" />
|
||||||
</Icon>
|
</Icon>
|
||||||
</StyledLink>
|
</StyledLink>
|
||||||
@ -108,10 +116,11 @@ const MainMenus: FC = () => {
|
|||||||
const { t } = useTranslation()
|
const { t } = useTranslation()
|
||||||
const { pathname } = useLocation()
|
const { pathname } = useLocation()
|
||||||
const { sidebarIcons } = useSettings()
|
const { sidebarIcons } = useSettings()
|
||||||
|
const { minappShow } = useRuntime()
|
||||||
const navigate = useNavigate()
|
const navigate = useNavigate()
|
||||||
|
|
||||||
const isRoute = (path: string): string => (pathname === path ? 'active' : '')
|
const isRoute = (path: string): string => (pathname === path && !minappShow ? 'active' : '')
|
||||||
const isRoutes = (path: string): string => (pathname.startsWith(path) ? 'active' : '')
|
const isRoutes = (path: string): string => (pathname.startsWith(path) && !minappShow ? 'active' : '')
|
||||||
|
|
||||||
const iconMap = {
|
const iconMap = {
|
||||||
assistants: <i className="iconfont icon-chat" />,
|
assistants: <i className="iconfont icon-chat" />,
|
||||||
@ -139,7 +148,13 @@ const MainMenus: FC = () => {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<Tooltip key={icon} title={t(`${icon}.title`)} mouseEnterDelay={0.8} placement="right">
|
<Tooltip key={icon} title={t(`${icon}.title`)} mouseEnterDelay={0.8} placement="right">
|
||||||
<StyledLink onClick={() => navigate(path)}>
|
<StyledLink
|
||||||
|
onClick={async () => {
|
||||||
|
if (minappShow) {
|
||||||
|
await MinApp.close()
|
||||||
|
}
|
||||||
|
navigate(path)
|
||||||
|
}}>
|
||||||
<Icon className={isActive}>{iconMap[icon]}</Icon>
|
<Icon className={isActive}>{iconMap[icon]}</Icon>
|
||||||
</StyledLink>
|
</StyledLink>
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
@ -150,6 +165,7 @@ const MainMenus: FC = () => {
|
|||||||
const PinnedApps: FC = () => {
|
const PinnedApps: FC = () => {
|
||||||
const { pinned, updatePinnedMinapps } = useMinapps()
|
const { pinned, updatePinnedMinapps } = useMinapps()
|
||||||
const { t } = useTranslation()
|
const { t } = useTranslation()
|
||||||
|
const { minappShow } = useRuntime()
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<DragableList list={pinned} onUpdate={updatePinnedMinapps} listStyle={{ marginBottom: 5 }}>
|
<DragableList list={pinned} onUpdate={updatePinnedMinapps} listStyle={{ marginBottom: 5 }}>
|
||||||
@ -164,11 +180,12 @@ const PinnedApps: FC = () => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
|
const isActive = minappShow && MinApp.app?.id === app.id
|
||||||
return (
|
return (
|
||||||
<Tooltip key={app.id} title={app.name} mouseEnterDelay={0.8} placement="right">
|
<Tooltip key={app.id} title={app.name} mouseEnterDelay={0.8} placement="right">
|
||||||
<StyledLink>
|
<StyledLink>
|
||||||
<Dropdown menu={{ items: menuItems }} trigger={['contextMenu']}>
|
<Dropdown menu={{ items: menuItems }} trigger={['contextMenu']}>
|
||||||
<Icon onClick={() => MinApp.start(app)}>
|
<Icon onClick={() => MinApp.start(app)} className={isActive ? 'active' : ''}>
|
||||||
<MinAppIcon size={20} app={app} style={{ borderRadius: 6 }} />
|
<MinAppIcon size={20} app={app} style={{ borderRadius: 6 }} />
|
||||||
</Icon>
|
</Icon>
|
||||||
</Dropdown>
|
</Dropdown>
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user