style: optimized performance and refined styles
This commit is contained in:
parent
1444739cc6
commit
1f8551135f
@ -8,11 +8,13 @@ import { EVENT_NAMES, EventEmitter } from '@renderer/services/event'
|
|||||||
import { Agent, Assistant } from '@renderer/types'
|
import { Agent, Assistant } from '@renderer/types'
|
||||||
import { uuid } from '@renderer/utils'
|
import { uuid } from '@renderer/utils'
|
||||||
import { Divider, Input, InputRef, Modal, Tag } from 'antd'
|
import { Divider, Input, InputRef, Modal, Tag } from 'antd'
|
||||||
|
import { take } from 'lodash'
|
||||||
import { useEffect, useMemo, useRef, useState } from 'react'
|
import { useEffect, useMemo, useRef, useState } from 'react'
|
||||||
import { useTranslation } from 'react-i18next'
|
import { useTranslation } from 'react-i18next'
|
||||||
import styled from 'styled-components'
|
import styled from 'styled-components'
|
||||||
|
|
||||||
import { HStack } from '../Layout'
|
import { HStack } from '../Layout'
|
||||||
|
import Scrollbar from '../Scrollbar'
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
resolve: (value: Assistant | undefined) => void
|
resolve: (value: Assistant | undefined) => void
|
||||||
@ -93,7 +95,7 @@ const PopupContainer: React.FC<Props> = ({ resolve }) => {
|
|||||||
</HStack>
|
</HStack>
|
||||||
<Divider style={{ margin: 0, borderBlockStartWidth: 0.5 }} />
|
<Divider style={{ margin: 0, borderBlockStartWidth: 0.5 }} />
|
||||||
<Container>
|
<Container>
|
||||||
{agents.map((agent) => (
|
{take(agents, 100).map((agent) => (
|
||||||
<AgentItem
|
<AgentItem
|
||||||
key={agent.id}
|
key={agent.id}
|
||||||
onClick={() => onCreateAssistant(agent)}
|
onClick={() => onCreateAssistant(agent)}
|
||||||
@ -110,14 +112,10 @@ const PopupContainer: React.FC<Props> = ({ resolve }) => {
|
|||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
const Container = styled.div`
|
const Container = styled(Scrollbar)`
|
||||||
padding: 0 12px;
|
padding: 0 12px;
|
||||||
height: 50vh;
|
height: 50vh;
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
overflow-y: auto;
|
|
||||||
&::-webkit-scrollbar {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
`
|
`
|
||||||
|
|
||||||
const AgentItem = styled.div`
|
const AgentItem = styled.div`
|
||||||
|
|||||||
@ -184,18 +184,19 @@ const Tabs = styled(TabsAntd)`
|
|||||||
padding-left: 0 !important;
|
padding-left: 0 !important;
|
||||||
}
|
}
|
||||||
.ant-tabs-nav-list {
|
.ant-tabs-nav-list {
|
||||||
padding: 10px;
|
padding: 10px 8px;
|
||||||
}
|
}
|
||||||
.ant-tabs-nav-operations {
|
.ant-tabs-nav-operations {
|
||||||
display: none !important;
|
display: none !important;
|
||||||
}
|
}
|
||||||
.ant-tabs-tab {
|
.ant-tabs-tab {
|
||||||
margin: 0 !important;
|
margin: 0 !important;
|
||||||
border-radius: 6px;
|
border-radius: 20px;
|
||||||
margin-bottom: 5px !important;
|
margin-bottom: 5px !important;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
&:hover {
|
&:hover {
|
||||||
|
color: var(--color-text) !important;
|
||||||
background-color: var(--color-background-soft);
|
background-color: var(--color-background-soft);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -210,6 +211,14 @@ const Tabs = styled(TabsAntd)`
|
|||||||
.ant-tabs-ink-bar {
|
.ant-tabs-ink-bar {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
.ant-tabs-tab-btn:active {
|
||||||
|
color: var(--color-text) !important;
|
||||||
|
}
|
||||||
|
.ant-tabs-tab-active {
|
||||||
|
.ant-tabs-tab-btn {
|
||||||
|
color: var(--color-text) !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
`
|
`
|
||||||
|
|
||||||
export default AgentsPage
|
export default AgentsPage
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user