feat: added minapp event handling and sidebar menu interactions #50

- Added functionality for handling MinApp window closure and provided a default close event handler.
- Added event listeners to Sidebar menus to interact with MinApp.
This commit is contained in:
kangfenmao 2024-09-19 23:27:50 +08:00
parent 60e87e8a22
commit 372224469d
2 changed files with 7 additions and 2 deletions

View File

@ -30,6 +30,8 @@ const PopupContainer: React.FC<Props> = ({ app, resolve }) => {
setTimeout(() => resolve({}), 300) setTimeout(() => resolve({}), 300)
} }
MinApp.onClose = onClose
const onReload = () => { const onReload = () => {
if (webviewRef.current) { if (webviewRef.current) {
webviewRef.current.src = app.url webviewRef.current.src = app.url
@ -163,6 +165,7 @@ const Button = styled.div`
export default class MinApp { export default class MinApp {
static topviewId = 0 static topviewId = 0
static onClose = () => {}
static close() { static close() {
TopView.hide('MinApp') TopView.hide('MinApp')
store.dispatch(setMinappShow(false)) store.dispatch(setMinappShow(false))

View File

@ -10,6 +10,7 @@ import { useTranslation } from 'react-i18next'
import { useLocation, useNavigate } from 'react-router-dom' import { useLocation, useNavigate } from 'react-router-dom'
import styled from 'styled-components' import styled from 'styled-components'
import MinApp from '../MinApp'
import UserPopup from '../Popups/UserPopup' import UserPopup from '../Popups/UserPopup'
const Sidebar: FC = () => { const Sidebar: FC = () => {
@ -45,7 +46,7 @@ const Sidebar: FC = () => {
<Container style={{ backgroundColor: minappShow ? 'var(--navbar-background)' : sidebarBgColor }}> <Container style={{ backgroundColor: minappShow ? 'var(--navbar-background)' : sidebarBgColor }}>
<AvatarImg src={avatar || UserAvatar} draggable={false} className="nodrag" onClick={onEditUser} /> <AvatarImg src={avatar || UserAvatar} draggable={false} className="nodrag" onClick={onEditUser} />
<MainMenus> <MainMenus>
<Menus> <Menus onClick={MinApp.onClose}>
<StyledLink onClick={onToggleShowAssistants}> <StyledLink onClick={onToggleShowAssistants}>
<Icon className={isRoute('/')}> <Icon className={isRoute('/')}>
<i className="iconfont icon-chat"></i> <i className="iconfont icon-chat"></i>
@ -73,7 +74,7 @@ const Sidebar: FC = () => {
</StyledLink> </StyledLink>
</Menus> </Menus>
</MainMenus> </MainMenus>
<Menus> <Menus onClick={MinApp.onClose}>
<StyledLink onClick={() => to(isLocalAi ? '/settings/assistant' : '/settings/provider')}> <StyledLink onClick={() => to(isLocalAi ? '/settings/assistant' : '/settings/provider')}>
<Icon className={pathname.startsWith('/settings') ? 'active' : ''}> <Icon className={pathname.startsWith('/settings') ? 'active' : ''}>
<i className="iconfont icon-setting"></i> <i className="iconfont icon-setting"></i>
@ -96,6 +97,7 @@ const Container = styled.div`
border-right: 0.5px solid var(--color-border); border-right: 0.5px solid var(--color-border);
margin-top: ${isMac ? 'var(--navbar-height)' : 0}; margin-top: ${isMac ? 'var(--navbar-height)' : 0};
transition: background-color 0.3s ease; transition: background-color 0.3s ease;
z-index: 10000;
` `
const AvatarImg = styled(Avatar)` const AvatarImg = styled(Avatar)`