github/DB-GPT
1
0
Fork 0
mirror of https://github.com/csunny/DB-GPT.git synced 2025-09-16 14:40:56 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(web): Unified frontend code style (#1923)

Browse Source 
Co-authored-by: Fangyin Cheng <staneyffer@gmail.com>
Co-authored-by: 谨欣 <echo.cmy@antgroup.com>
Co-authored-by: 严志勇 <yanzhiyong@tiansuixiansheng.com>
Co-authored-by: yanzhiyong <932374019@qq.com>
This commit is contained in:
Dreammy23
2024-08-30 14:03:06 +08:00
committed by GitHub
parent f866580703
commit 471689ba20
247 changed files with 4960 additions and 4546 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
web/new-components/chat/input/ToolsBar.tsx
View File

@@ -23,7 +23,6 @@ interface ToolsConfig {
const ToolsBar: React.FC<{
ctrl: AbortController;
}> = ({ ctrl }) => {
const { t } = useTranslation();
const {
@@ -48,7 +47,7 @@ const ToolsBar: React.FC<{
// 左边工具栏动态可用key
const paramKey: string[] = useMemo(() => {
return appInfo.param_need?.map((i) => i.type) || [];
return appInfo.param_need?.map(i => i.type) || [];
}, [appInfo.param_need]);
const rightToolsConfig: ToolsConfig[] = useMemo(() => {
@@ -75,12 +74,15 @@ const ToolsBar: React.FC<{
can_use: !replyLoading && history.length > 0,
key: 'redo',
onClick: async () => {
const lastHuman = history.filter((i) => i.role === 'human')?.slice(-1)?.[0];
const lastHuman = history.filter(i => i.role === 'human')?.slice(-1)?.[0];
handleChat(lastHuman?.context || '', {
app_code: appInfo.app_code,
...(paramKey.includes('temperature') && { temperature: temperatureValue }),
...(paramKey.includes('resource') && {
select_param: typeof resourceValue === 'string' ? resourceValue : JSON.stringify(resourceValue) || currentDialogue.select_param,
select_param:
typeof resourceValue === 'string'
? resourceValue
: JSON.stringify(resourceValue) || currentDialogue.select_param,
}),
});
setTimeout(() => {
@@ -93,7 +95,11 @@ const ToolsBar: React.FC<{
},
{
tip: t('erase_memory'),
icon: clsLoading ? <Spin spinning={clsLoading} indicator={<LoadingOutlined style={{ fontSize: 20 }} />} /> : <ClearOutlined />,
icon: clsLoading ? (
<Spin spinning={clsLoading} indicator={<LoadingOutlined style={{ fontSize: 20 }} />} />
) : (
<ClearOutlined />
),
can_use: history.length > 0,
key: 'clear',
onClick: async () => {
@@ -131,8 +137,8 @@ const ToolsBar: React.FC<{
const returnTools = (config: ToolsConfig[]) => {
return (
<>
{config.map((item) => (
<Tooltip key={item.key} title={item.tip} arrow={false} placement="bottom">
{config.map(item => (
<Tooltip key={item.key} title={item.tip} arrow={false} placement='bottom'>
<div
className={`flex w-8 h-8 items-center justify-center rounded-md hover:bg-[rgb(221,221,221,0.6)] text-lg ${
item.can_use ? 'cursor-pointer' : 'opacity-30 cursor-not-allowed'
@@ -152,27 +158,29 @@ const ToolsBar: React.FC<{
const fileName = useMemo(() => {
try {
return JSON.parse(currentDialogue.select_param).file_name;
} catch (error) {
} catch {
return '';
}
}, [currentDialogue.select_param]);
return (
<div className="flex flex-col mb-2">
<div className="flex items-center justify-between h-full w-full">
<div className="flex gap-3 text-lg">
<div className='flex flex-col mb-2'>
<div className='flex items-center justify-between h-full w-full'>
<div className='flex gap-3 text-lg'>
<ModelSwitcher />
<Resource fileList={fileList} setFileList={setFileList} setLoading={setLoading} fileName={fileName} />
<Temperature temperatureValue={temperatureValue} setTemperatureValue={setTemperatureValue} />
</div>
<div className="flex gap-1">{returnTools(rightToolsConfig)}</div>
<div className='flex gap-1'>{returnTools(rightToolsConfig)}</div>
</div>
{(fileName || fileList[0]?.name) && (
<div className="group/item flex mt-2">
<div className="flex items-center justify-between w-64 border border-[#e3e4e6] dark:border-[rgba(255,255,255,0.6)] rounded-lg p-2">
<div className="flex items-center">
<Image src={`/icons/chat/excel.png`} width={20} height={20} alt="file-icon" className="mr-2" />
<span className="text-sm text-[#1c2533] dark:text-white line-clamp-1">{fileName || fileList[0]?.name}</span>
<div className='group/item flex mt-2'>
<div className='flex items-center justify-between w-64 border border-[#e3e4e6] dark:border-[rgba(255,255,255,0.6)] rounded-lg p-2'>
<div className='flex items-center'>
<Image src={`/icons/chat/excel.png`} width={20} height={20} alt='file-icon' className='mr-2' />
<span className='text-sm text-[#1c2533] dark:text-white line-clamp-1'>
{fileName || fileList[0]?.name}
</span>
</div>
<Spin spinning={loading} indicator={<LoadingOutlined style={{ fontSize: 24 }} spin />} />
</div>