feat: added hotkey functionality and improved appstorepopover layout

src/renderer/src/components/Popups/AppStorePopover.tsx

@@ -5,6 +5,7 @@ import { Popover } from 'antd'
 import { Empty } from 'antd'
 import { isEmpty } from 'lodash'
 import { FC, useState } from 'react'
+import { useHotkeys } from 'react-hotkeys-hook'
 import styled from 'styled-components'
 
 import Scrollbar from '../Scrollbar'
@@ -17,6 +18,10 @@ const AppStorePopover: FC<Props> = ({ children }) => {
   const [open, setOpen] = useState(false)
   const apps = getAllMinApps()
 
+  useHotkeys('esc', () => {
+    setOpen(false)
+  })
+
   const handleClose = () => {
     setOpen(false)
   }

src/renderer/src/pages/home/Navbar.tsx

@@ -71,12 +71,12 @@ const HeaderNavbar: FC<Props> = ({ activeAssistant }) => {
         </HStack>
         <HStack alignItems="center">
           <AppStorePopover>
-            <NavbarIcon style={{ marginRight: isMac ? 8 : 25, marginLeft: isMac ? 4 : 0 }}>
+            <NavbarIcon>
               <i className="iconfont icon-appstore" />
             </NavbarIcon>
           </AppStorePopover>
           {topicPosition === 'right' && (
-            <NavbarIcon onClick={toggleShowTopics}>
+            <NavbarIcon onClick={toggleShowTopics} style={{ marginLeft: isMac ? 5 : 10 }}>
               <i className={`iconfont icon-${showTopics ? 'show' : 'hide'}-sidebar`} />
             </NavbarIcon>
           )}

src/renderer/src/pages/settings/ProviderSettings/EditModelsPopup.tsx

@@ -6,7 +6,7 @@ import { useProvider } from '@renderer/hooks/useProvider'
 import { fetchModels } from '@renderer/services/ApiService'
 import { Model, Provider } from '@renderer/types'
 import { getDefaultGroupName, isFreeModel, runAsyncFunction } from '@renderer/utils'
-import { Avatar, Button, Empty, Flex, Modal, Tag } from 'antd'
+import { Avatar, Button, Empty, Flex, Modal, Popover, Tag } from 'antd'
 import Search from 'antd/es/input/Search'
 import { groupBy, isEmpty, uniqBy } from 'lodash'
 import { useEffect, useState } from 'react'
@@ -134,7 +134,15 @@ const PopupContainer: React.FC<Props> = ({ provider: _provider, resolve }) => {
                           Free
                         </Tag>
                       )}
-                      {!isEmpty(model.description) && <Question onClick={() => onShowModelInfo(model)} />}
+                      {!isEmpty(model.description) && (
+                        <Popover
+                          trigger="click"
+                          title={model.name}
+                          content={model.description}
+                          overlayStyle={{ maxWidth: 600 }}>
+                          <Question />
+                        </Popover>
+                      )}
                     </ListItemName>
                   </ListItemHeader>
                   {hasModel ? (
@@ -153,16 +161,6 @@ const PopupContainer: React.FC<Props> = ({ provider: _provider, resolve }) => {
   )
 }
 
-const onShowModelInfo = (model: Model) => {
-  window.modal.info({
-    title: model.name,
-    content: model?.description,
-    icon: null,
-    maskClosable: true,
-    width: 600
-  })
-}
-
 const SearchContainer = styled.div`
   display: flex;
   flex-direction: row;