From 64c883153011fdd20b1af2edb3c8d439d5abf3bd Mon Sep 17 00:00:00 2001 From: kangfenmao Date: Wed, 20 Nov 2024 19:09:55 +0800 Subject: [PATCH] style: removed dark theme styles, updated search and ui --- src/renderer/src/context/AntdProvider.tsx | 3 - .../src/pages/home/Messages/Messages.tsx | 2 +- .../src/pages/home/Tabs/AssistantsTab.tsx | 88 ++----------------- 3 files changed, 6 insertions(+), 87 deletions(-) diff --git a/src/renderer/src/context/AntdProvider.tsx b/src/renderer/src/context/AntdProvider.tsx index 1d31dcb5..dce69a6b 100644 --- a/src/renderer/src/context/AntdProvider.tsx +++ b/src/renderer/src/context/AntdProvider.tsx @@ -31,9 +31,6 @@ const AntdProvider: FC = ({ children }) => { Menu: { activeBarBorderWidth: 0, darkItemBg: 'transparent' - }, - Modal: { - colorBgMask: isDarkTheme ? 'rgba(0, 0, 0, 0.85)' : 'rgba(255, 255, 255, 0.8)' } }, token: { diff --git a/src/renderer/src/pages/home/Messages/Messages.tsx b/src/renderer/src/pages/home/Messages/Messages.tsx index fefdbe06..6977b2d7 100644 --- a/src/renderer/src/pages/home/Messages/Messages.tsx +++ b/src/renderer/src/pages/home/Messages/Messages.tsx @@ -44,7 +44,7 @@ const Messages: FC = ({ assistant, topic, setActiveTopic }) => { const showRightTopics = showTopics && topicPosition === 'right' const minusAssistantsWidth = showAssistants ? '- var(--assistants-width)' : '' const minusRightTopicsWidth = showRightTopics ? '- var(--assistants-width)' : '' - return `calc(100vw - var(--sidebar-width) ${minusAssistantsWidth} ${minusRightTopicsWidth} - 5px)` + return `calc(100vw - var(--sidebar-width) ${minusAssistantsWidth} ${minusRightTopicsWidth} - 2px)` }, [showAssistants, showTopics, topicPosition]) const scrollToBottom = useCallback(() => { diff --git a/src/renderer/src/pages/home/Tabs/AssistantsTab.tsx b/src/renderer/src/pages/home/Tabs/AssistantsTab.tsx index e04543d6..3d3cc031 100644 --- a/src/renderer/src/pages/home/Tabs/AssistantsTab.tsx +++ b/src/renderer/src/pages/home/Tabs/AssistantsTab.tsx @@ -8,14 +8,13 @@ import { useAssistant, useAssistants } from '@renderer/hooks/useAssistant' import { useSettings } from '@renderer/hooks/useSettings' import { getDefaultTopic } from '@renderer/services/AssistantService' import { EVENT_NAMES, EventEmitter } from '@renderer/services/EventService' -import { useAppDispatch, useAppSelector } from '@renderer/store' -import { setSearching } from '@renderer/store/runtime' +import { useAppSelector } from '@renderer/store' import { Assistant } from '@renderer/types' import { uuid } from '@renderer/utils' -import { Dropdown, Input, InputRef } from 'antd' +import { Dropdown } from 'antd' import { ItemType } from 'antd/es/menu/interface' -import { isEmpty, last, omit } from 'lodash' -import { FC, useCallback, useEffect, useRef, useState } from 'react' +import { last, omit } from 'lodash' +import { FC, useCallback, useState } from 'react' import { useTranslation } from 'react-i18next' import styled from 'styled-components' @@ -34,13 +33,10 @@ const Assistants: FC = ({ }) => { const { assistants, removeAssistant, addAssistant, updateAssistants } = useAssistants() const generating = useAppSelector((state) => state.runtime.generating) - const [search, setSearch] = useState('') const [dragging, setDragging] = useState(false) const { removeAllTopics } = useAssistant(activeAssistant.id) const { clickAssistantToShowTopic, topicPosition } = useSettings() - const searchRef = useRef(null) const { t } = useTranslation() - const dispatch = useAppDispatch() const { addAgent } = useAgents() const onDelete = useCallback( @@ -138,71 +134,11 @@ const Assistants: FC = ({ [clickAssistantToShowTopic, generating, setActiveAssistant, t, topicPosition] ) - const list = assistants.filter((assistant) => assistant.name?.toLowerCase().includes(search.toLowerCase().trim())) - - const onSearch = (e: React.KeyboardEvent) => { - const isEnterPressed = e.keyCode == 13 - - if (e.key === 'Escape') { - return searchRef.current?.blur() - } - - if (isEnterPressed) { - if (list.length > 0) { - if (list.length === 1) { - onSwitchAssistant(list[0]) - setSearch('') - setTimeout(() => searchRef.current?.blur(), 0) - return - } - const index = list.findIndex((a) => a.id === activeAssistant?.id) - onSwitchAssistant(index === list.length - 1 ? list[0] : list[index + 1]) - } - } - - if ((e.ctrlKey || e.metaKey) && e.key === 'k') { - searchRef.current?.focus() - searchRef.current?.select() - } - } - - // Command or Ctrl + K create new topic - useEffect(() => { - const onKeydown = (e) => { - if ((e.ctrlKey || e.metaKey) && e.key === 'k') { - searchRef.current?.focus() - searchRef.current?.select() - } - } - document.addEventListener('keydown', onKeydown) - return () => document.removeEventListener('keydown', onKeydown) - }, [activeAssistant?.id, list, onSwitchAssistant]) - return ( - {assistants.length >= 10 && ( - - ⌘+K} - value={search} - onChange={(e) => setSearch(e.target.value)} - style={{ borderRadius: 16, borderWidth: 0.5 }} - onKeyDown={onSearch} - ref={searchRef} - onFocus={() => dispatch(setSearching(true))} - onBlur={() => { - dispatch(setSearching(false)) - setSearch('') - }} - allowClear - /> - - )} setDragging(true)} onDragEnd={() => setDragging(false)}> @@ -317,18 +253,4 @@ const TopicCount = styled.div` align-items: center; ` -const SearchContainer = styled.div` - margin: 12px 10px; - margin-top: 2px; -` - -const CommandKey = styled.div` - color: var(--color-text-2); - font-size: 10px; - padding: 2px 5px; - border-radius: 4px; - background-color: var(--color-background); - margin-right: -4px; -` - export default Assistants