feat(web): create space storage type add recommend

This commit is contained in:
zhaoying
2026-02-27 18:59:58 +08:00
parent dd9be2ed90
commit c99f04314c
4 changed files with 14 additions and 3 deletions

View File

@@ -20,6 +20,7 @@
import { type FC, type Key, type ReactNode, useEffect } from 'react'; import { type FC, type Key, type ReactNode, useEffect } from 'react';
import { type RadioGroupProps } from 'antd'; import { type RadioGroupProps } from 'antd';
import clsx from 'clsx' import clsx from 'clsx'
import { useTranslation } from 'react-i18next';
/** Radio card option interface */ /** Radio card option interface */
interface RadioCardOption { interface RadioCardOption {
@@ -33,6 +34,8 @@ interface RadioCardOption {
icon?: string; icon?: string;
/** Whether the option is disabled */ /** Whether the option is disabled */
disabled?: boolean; disabled?: boolean;
/** Whether the option is recommended */
recommend?: boolean;
/** Additional properties */ /** Additional properties */
[key: string]: string | number | boolean | undefined | null | Key; [key: string]: string | number | boolean | undefined | null | Key;
} }
@@ -63,6 +66,7 @@ const RadioGroupCard: FC<RadioCardProps> = ({
allowClear = true, allowClear = true,
block = false, block = false,
}) => { }) => {
const { t } = useTranslation();
/** Listen to value changes and trigger side effects via onValueChange callback */ /** Listen to value changes and trigger side effects via onValueChange callback */
useEffect(() => { useEffect(() => {
if (onValueChange) { if (onValueChange) {
@@ -91,12 +95,13 @@ const RadioGroupCard: FC<RadioCardProps> = ({
})}> })}>
{/* Render each option as a selectable card */} {/* Render each option as a selectable card */}
{options.map(option => ( {options.map(option => (
<div key={String(option.value)} className={clsx("rb:border rb:rounded-lg rb:w-full rb:p-[20px_12px] rb:text-center rb:cursor-pointer", { <div key={String(option.value)} className={clsx("rb:relative rb:border rb:rounded-lg rb:w-full rb:p-[20px_12px] rb:text-center rb:cursor-pointer", {
'rb:bg-[rgba(21,94,239,0.06)] rb:border-[#155EEF]': option.value === value, 'rb:bg-[rgba(21,94,239,0.06)] rb:border-[#155EEF]': option.value === value,
'rb:border-[#EBEBEB] rb:bg-[#ffffff]': option.value !== value, 'rb:border-[#EBEBEB] rb:bg-[#ffffff]': option.value !== value,
'rb:opacity-[0.75]': option.disabled, 'rb:opacity-[0.75]': option.disabled,
'rb:flex rb:items-center rb:text-left rb:gap-4': block, 'rb:flex rb:items-center rb:text-left rb:gap-4': block,
})} onClick={() => handleChange(option)}> })} onClick={() => handleChange(option)}>
{option.recommend && <div className="rb:absolute rb:right-0 rb:top-0 rb:bg-[#FF5D34] rb:rounded-[0px_7px_0px_8px] rb:text-[12px] rb:text-white rb:font-regular rb:leading-4 rb:p-[4px_8px]">{t('common.recommend')}</div>}
{/* Use custom render or default card layout */} {/* Use custom render or default card layout */}
{itemRender ? itemRender(option) : ( {itemRender ? itemRender(option) : (
<> <>

View File

@@ -452,6 +452,7 @@ export const en = {
nextStep: 'Next Step', nextStep: 'Next Step',
prevStep: 'Previous Step', prevStep: 'Previous Step',
exportSuccess: 'Export successful', exportSuccess: 'Export successful',
recommend: 'Recommend',
}, },
model: { model: {
searchPlaceholder: 'search model…', searchPlaceholder: 'search model…',

View File

@@ -1019,6 +1019,7 @@ export const zh = {
nextStep: '下一步', nextStep: '下一步',
prevStep: '上一步', prevStep: '上一步',
exportSuccess: '导出成功', exportSuccess: '导出成功',
recommend: '推荐',
}, },
model: { model: {
searchPlaceholder: '搜索模型…', searchPlaceholder: '搜索模型…',

View File

@@ -34,8 +34,8 @@ interface SpaceModalProps {
} }
/** Storage types */ /** Storage types */
const types: StorageType[] = [ const types: StorageType[] = [
'rag',
'neo4j', 'neo4j',
'rag',
] ]
/** Type icons mapping */ /** Type icons mapping */
const typeIcons: Record<StorageType, string> = { const typeIcons: Record<StorageType, string> = {
@@ -154,6 +154,9 @@ const SpaceModal = forwardRef<SpaceModalRef, SpaceModalProps>(({
<Form <Form
form={form} form={form}
layout="vertical" layout="vertical"
initialValues={{
storage_type: types[0],
}}
> >
<Form.Item <Form.Item
name="icon" name="icon"
@@ -183,7 +186,8 @@ const SpaceModal = forwardRef<SpaceModalRef, SpaceModalProps>(({
value: type, value: type,
label: t(`space.${type}`), label: t(`space.${type}`),
labelDesc: t(`space.${type}Desc`), labelDesc: t(`space.${type}Desc`),
icon: typeIcons[type] icon: typeIcons[type],
recommend: type === 'neo4j',
}))} }))}
block={true} block={true}
/> />