+ : !collapsed
+ ?
{t('title')}
- : null
+ : null
}
diff --git a/web/src/i18n/en.ts b/web/src/i18n/en.ts
index 4899fadf..9da42348 100644
--- a/web/src/i18n/en.ts
+++ b/web/src/i18n/en.ts
@@ -113,6 +113,7 @@ export const en = {
orderPayment: 'Order Payment',
orderHistory: 'Order History',
spaceConfig: 'Space Configuration',
+ ontology: 'Ontology Engineering',
prompt: 'Prompt Engineering',
},
dashboard: {
@@ -869,7 +870,8 @@ export const en = {
inactive: 'Inactive',
configurationName: 'Configuration Name',
emotionEngine: 'Emotion Engine',
- reflectionEngine: 'Self-Reflection Engine'
+ reflectionEngine: 'Self-Reflection Engine',
+ scene_id: 'Ontology Scenario',
},
member: {
username: 'Username',
@@ -2437,6 +2439,33 @@ Memory Bear: After the rebellion, regional warlordism intensified for several re
summary: 'Core Insights',
none: 'None'
},
+ ontology: {
+ searchPlaceholder: 'Search scenarios',
+ create: 'Create Project',
+ edit: 'Edit Project',
+ scene_name: 'Scenario Name',
+ scene_description: 'Scenario Description',
+ descriptionPlaceholder: 'Describe the purpose of this scenario and the entity types to extract',
+ typeCount: 'types',
+ created_at: 'Created At',
+ updated_at: 'Updated At',
+ entityTypes: 'Entity Types',
+
+ addClass: 'Add Type',
+ class_name: 'Type Name',
+ class_description: 'Type Definition',
+ classDescriptionPlaceholder: 'Describe the meaning and purpose of this type',
+
+ llm_id: 'Select Model',
+ scenario: 'Scenario Description',
+ scenarioPlaceholder: 'Please describe your business requirements',
+ run: 'Inference',
+ loadingConfirm: 'Inferring',
+ extractConfirm: 'Add Selected Types',
+ classType: 'Project Type',
+ extract: 'Project Inference',
+ source: 'Not Added',
+ target: 'Added',
prompt: {
editor: 'Prompt Generator',
history: 'My History',
diff --git a/web/src/i18n/zh.ts b/web/src/i18n/zh.ts
index 3ca8f33c..3ee79e15 100644
--- a/web/src/i18n/zh.ts
+++ b/web/src/i18n/zh.ts
@@ -112,6 +112,7 @@ export const zh = {
orderPayment: '订单支付',
orderHistory: '订单记录',
spaceConfig: '空间配置',
+ ontology: '本体工程',
prompt: '提示词工程',
},
knowledgeBase: {
@@ -1240,7 +1241,8 @@ export const zh = {
inactive: '不活跃',
configurationName: '配置名称',
emotionEngine: '情感引擎',
- reflectionEngine: '反思引擎'
+ reflectionEngine: '反思引擎',
+ scene_id: '本体场景',
},
member: {
username: '用户名',
@@ -2526,6 +2528,34 @@ export const zh = {
summary: '核心洞察',
none: '无'
},
+ ontology: {
+ searchPlaceholder: '搜索场景',
+ create: '新增工程',
+ edit: '编辑工程',
+ scene_name: '场景名称',
+ scene_description: '场景描述',
+ descriptionPlaceholder: '描述该场景的用途和提取的实体类型',
+ typeCount: '个类型',
+ created_at: '创建时间',
+ updated_at: '更新时间',
+ entityTypes: '实体类型',
+
+ addClass: '添加类型',
+ class_name: '类型名称',
+ class_description: '类型定义',
+ classDescriptionPlaceholder: '描述该类型的含义和用途',
+
+ llm_id: '选择模型',
+ scenario: '场景描述',
+ scenarioPlaceholder: '请描述您的业务需求',
+ run: '推理',
+ loadingConfirm: '推断中',
+ extractConfirm: '添加选中类型',
+ classType: '工程类型',
+ extract: '工程推理',
+ source: '未添加项',
+ target: '已添加项',
+ }
prompt: {
editor: '提示词生成器',
history: '我的历史',
diff --git a/web/src/routes/index.tsx b/web/src/routes/index.tsx
index 40461792..21eaeab8 100644
--- a/web/src/routes/index.tsx
+++ b/web/src/routes/index.tsx
@@ -3,6 +3,7 @@ import { createHashRouter, createRoutesFromElements, Route } from 'react-router-
// 导入路由配置JSON
import routesConfig from './routes.json';
+import Ontology from '@/views/Ontology';
// 递归函数，用于生成路由元素
@@ -68,6 +69,8 @@ const componentMap: Record
{item.name[0]}
}
>
{['type', 'source', 'created_at'].map((key, index) => (
-
{t(`application.${key}`)}
{
: key === 'source' && !item.is_shared
? t('application.configuration')
: key === 'created_at'
- ? formatDateTime(item[key as keyof Application], 'YYYY-MM-DD HH:mm:ss')
+ ? formatDateTime(item.created_at, 'YYYY-MM-DD HH:mm:ss')
: t(`application.${item[key as keyof Application]}`)
}
))}
-
+ (({
form.setFieldsValue({
config_name: memory.config_name,
config_desc: memory.config_desc,
+ scene_id: memory.scene_id
});
} else {
form.resetFields();
@@ -102,6 +106,21 @@ const MemoryForm = forwardRef(({
>
+
);
diff --git a/web/src/views/MemoryManagement/index.tsx b/web/src/views/MemoryManagement/index.tsx
index 80d7af16..a81e53d6 100644
--- a/web/src/views/MemoryManagement/index.tsx
+++ b/web/src/views/MemoryManagement/index.tsx
@@ -10,6 +10,7 @@ import { getMemoryConfigList, deleteMemoryConfig } from '@/api/memory'
import BodyWrapper from '@/components/Empty/BodyWrapper'
import { formatDateTime } from '@/utils/format';
import clsx from 'clsx'
+import RbAlert from '@/components/RbAlert'
const MemoryManagement: React.FC = () => {
const { t } = useTranslation();
@@ -98,10 +99,18 @@ const MemoryManagement: React.FC = () => {
+
+
-
} onClick={() => handleDelete(item)}>
diff --git a/web/src/views/ApplicationManagement/types.ts b/web/src/views/ApplicationManagement/types.ts
index 03d8b1b0..baf12b73 100644
--- a/web/src/views/ApplicationManagement/types.ts
+++ b/web/src/views/ApplicationManagement/types.ts
@@ -1,4 +1,7 @@
// 应用数据类型
+export interface Query {
+ search: string;
+}
export interface Application {
id: string;
workspace_id: string;
diff --git a/web/src/views/MemoryManagement/components/MemoryForm.tsx b/web/src/views/MemoryManagement/components/MemoryForm.tsx
index 7eb8f0c9..84b0d9c2 100644
--- a/web/src/views/MemoryManagement/components/MemoryForm.tsx
+++ b/web/src/views/MemoryManagement/components/MemoryForm.tsx
@@ -1,9 +1,12 @@
import { forwardRef, useImperativeHandle, useState } from 'react';
import { Form, Input, App } from 'antd';
import { useTranslation } from 'react-i18next';
+
import type { MemoryFormData, Memory, MemoryFormRef } from '../types';
import RbModal from '@/components/RbModal'
import { createMemoryConfig, updateMemoryConfig } from '@/api/memory'
+import { getOntologyScenesUrl } from '@/api/ontology'
+import CustomSelect from '@/components/CustomSelect';
const FormItem = Form.Item;
@@ -38,6 +41,7 @@ const MemoryForm = forwardRef{item.config_desc}
+ {t('memory.scene_id')}:
+
+ {item.scene_name || '-'}
+
+
+
+
{['memoryExtractionEngine', 'forgottenEngine', 'emotionEngine', 'reflectionEngine'].map((key) => (
-
+
+
+ }
+ />
+
+
+
+
+
+ ))}
+
+
+
+
+ handleClick(item.config_id, key)}
>
{t(`memory.${key}`)}
diff --git a/web/src/views/MemoryManagement/types.ts b/web/src/views/MemoryManagement/types.ts
index 55524462..c632d101 100644
--- a/web/src/views/MemoryManagement/types.ts
+++ b/web/src/views/MemoryManagement/types.ts
@@ -3,6 +3,7 @@ export interface MemoryFormData {
config_id?: number;
config_name: string;
config_desc?: string;
+ scene_id?: string;
}
// 内存数据类型
@@ -29,6 +30,8 @@ export interface Memory {
updated_at: string;
config_desc: string;
workspace_id: string;
+ scene_id: string;
+ scene_name: string;
[key: string]: string | number | boolean;
}
// 定义组件暴露的方法接口
diff --git a/web/src/views/Ontology/components/OntologyClassExtractModal.tsx b/web/src/views/Ontology/components/OntologyClassExtractModal.tsx
new file mode 100644
index 00000000..1aba9c67
--- /dev/null
+++ b/web/src/views/Ontology/components/OntologyClassExtractModal.tsx
@@ -0,0 +1,173 @@
+import { forwardRef, useImperativeHandle, useState } from 'react';
+import { Form, Input, App, Transfer, type TransferProps, Flex } from 'antd';
+import { useTranslation } from 'react-i18next';
+
+import type { OntologyClassData, ExtractData, OntologyClassExtractModalData, OntologyClassExtractModalRef } from '../types'
+import RbModal from '@/components/RbModal'
+import { extractOntologyTypes, createOntologyClass } from '@/api/ontology'
+import CustomSelect from '@/components/CustomSelect';
+import { getModelListUrl } from '@/api/models'
+import RbCard from '@/components/RbCard/Card';
+import Tag from '@/components/Tag';
+
+const FormItem = Form.Item;
+
+interface OntologyClassExtractModalProps {
+ refresh: () => void;
+}
+
+const OntologyClassExtractModal = forwardRef(({
+ refresh
+}, ref) => {
+ const { t } = useTranslation();
+ const { message } = App.useApp();
+ const [visible, setVisible] = useState(false);
+ const [form] = Form.useForm();
+ const [loading, setLoading] = useState(false)
+ const [data, setData] = useState(null)
+ const [extractData, setExtractData] = useState(null)
+ const [targetKeys, setTargetKeys] = useState([]);
+ const [selectedKeys, setSelectedKeys] = useState([]);
+
+ // 封装取消方法，添加关闭弹窗逻辑
+ const handleClose = () => {
+ setVisible(false);
+ form.resetFields();
+ setLoading(false)
+ setData(null)
+ setExtractData(null)
+ };
+
+ const handleOpen = (vo: OntologyClassData) => {
+ form.resetFields();
+ setVisible(true);
+ setData(vo)
+ };
+ // 封装保存方法，添加提交逻辑
+ const handleSave = () => {
+ if (!data?.scene_id) return;
+ form
+ .validateFields()
+ .then((values) => {
+ setLoading(true)
+ extractOntologyTypes({
+ ...values,
+ scene_id: data.scene_id,
+ domain: data.scene_name,
+ }).then((res) => {
+ const response = res as ExtractData
+ setExtractData(response)
+ setSelectedKeys([])
+ setTargetKeys(response.classes.map(vo => vo.id))
+ })
+ .finally(() => {
+ setLoading(false)
+ })
+ })
+ .catch((err) => {
+ console.log('err', err)
+ });
+ }
+
+ const handleConfirm = () => {
+ if (!extractData) {
+ handleSave()
+ } else {
+ if (!data?.scene_id) return;
+ if (!targetKeys || targetKeys.length === 0) {
+ message.warning(t('common.selectPlaceholder', { title: t('ontology.classType') }))
+ return
+ }
+ console.log('targetKeys', targetKeys)
+ createOntologyClass({
+ scene_id: data?.scene_id,
+ classes: extractData.classes.filter(vo => targetKeys?.includes(vo.id)).map(vo => ({ class_name: vo.name, class_description: vo.description }))
+ }).then(() => {
+ message.success(t('common.createSuccess'))
+ refresh()
+ handleClose()
+ }).finally(() => {
+ setLoading(false)
+ })
+ }
+ }
+
+
+ const onChange: TransferProps['onChange'] = (nextTargetKeys) => {
+ setTargetKeys(nextTargetKeys.filter(Boolean));
+ };
+
+ const onSelectChange: TransferProps['onSelectChange'] = (
+ sourceSelectedKeys,
+ targetSelectedKeys,
+ ) => {
+ setSelectedKeys([...sourceSelectedKeys, ...targetSelectedKeys].filter(Boolean));
+ };
+
+ // 暴露给父组件的方法
+ useImperativeHandle(ref, () => ({
+ handleOpen,
+ }));
+
+ return (
+
+
+
+ {extractData &&
+ ({ ...vo, key: vo.id }))}
+ targetKeys={targetKeys}
+ selectedKeys={selectedKeys}
+ onChange={onChange}
+ onSelectChange={onSelectChange}
+ render={(item) => ( }
+
+ );
+});
+
+export default OntologyClassExtractModal;
\ No newline at end of file
diff --git a/web/src/views/Ontology/components/OntologyClassModal.tsx b/web/src/views/Ontology/components/OntologyClassModal.tsx
new file mode 100644
index 00000000..73e45060
--- /dev/null
+++ b/web/src/views/Ontology/components/OntologyClassModal.tsx
@@ -0,0 +1,96 @@
+import { forwardRef, useImperativeHandle, useState } from 'react';
+import { Form, Input, App } from 'antd';
+import { useTranslation } from 'react-i18next';
+
+import type { AddClassItem, OntologyClassModalRef } from '../types'
+import RbModal from '@/components/RbModal'
+import { createOntologyClass } from '@/api/ontology'
+
+const FormItem = Form.Item;
+
+interface OntologyClassModalProps {
+ refresh: () => void;
+}
+
+const OntologyClassModal = forwardRef(({
+ refresh
+}, ref) => {
+ const { t } = useTranslation();
+ const { message } = App.useApp();
+ const [visible, setVisible] = useState(false);
+ const [form] = Form.useForm();
+ const [loading, setLoading] = useState(false)
+ const [scene_id, setSceneId] = useState(null)
+
+ // 封装取消方法，添加关闭弹窗逻辑
+ const handleClose = () => {
+ setVisible(false);
+ form.resetFields();
+ setLoading(false)
+ };
+
+ const handleOpen = (scene_id: string) => {
+ form.resetFields();
+ setVisible(true);
+ setSceneId(scene_id)
+ };
+ // 封装保存方法，添加提交逻辑
+ const handleSave = () => {
+ if (!scene_id) return;
+ form
+ .validateFields()
+ .then((values) => {
+ setLoading(true)
+ createOntologyClass({
+ scene_id: scene_id,
+ classes: [{ ...values }]
+ }).then(() => {
+ message.success(t('common.saveSuccess'));
+ handleClose();
+ refresh();
+ })
+ .finally(() => setLoading(false))
+ })
+ .catch((err) => {
+ console.log('err', err)
+ });
+ }
+
+ // 暴露给父组件的方法
+ useImperativeHandle(ref, () => ({
+ handleOpen,
+ }));
+
+ return (
+
+
+
+ );
+});
+
+export default OntologyClassModal;
\ No newline at end of file
diff --git a/web/src/views/Ontology/components/OntologyModal.tsx b/web/src/views/Ontology/components/OntologyModal.tsx
new file mode 100644
index 00000000..82eebbd2
--- /dev/null
+++ b/web/src/views/Ontology/components/OntologyModal.tsx
@@ -0,0 +1,99 @@
+import { forwardRef, useImperativeHandle, useState } from 'react';
+import { Form, Input, App } from 'antd';
+import { useTranslation } from 'react-i18next';
+
+import type { OntologyItem, OntologyModalData, OntologyModalRef } from '../types'
+import RbModal from '@/components/RbModal'
+import { createOntologyScene, updateOntologyScene } from '@/api/ontology'
+
+const FormItem = Form.Item;
+
+interface OntologyModalProps {
+ refresh: () => void;
+}
+
+const OntologyModal = forwardRef(({
+ refresh
+}, ref) => {
+ const { t } = useTranslation();
+ const { message } = App.useApp();
+ const [visible, setVisible] = useState(false);
+ const [editVo, setEditVo] = useState(null)
+ const [form] = Form.useForm();
+ const [loading, setLoading] = useState(false)
+
+ // 封装取消方法，添加关闭弹窗逻辑
+ const handleClose = () => {
+ setVisible(false);
+ form.resetFields();
+ setLoading(false)
+ setEditVo(null)
+ };
+
+ const handleOpen = (vo?: OntologyItem) => {
+ if (vo) {
+ setEditVo(vo);
+ form.setFieldsValue(vo);
+ } else {
+ form.resetFields();
+ }
+ setVisible(true);
+ };
+ // 封装保存方法，添加提交逻辑
+ const handleSave = () => {
+ form
+ .validateFields()
+ .then((values) => {
+ setLoading(true)
+ const request = editVo?.scene_id ? updateOntologyScene(editVo.scene_id, values) : createOntologyScene(values)
+ request
+ .then(() => {
+ message.success(t('common.saveSuccess'));
+ handleClose();
+ refresh();
+ })
+ .finally(() => setLoading(false))
+ })
+ .catch((err) => {
+ console.log('err', err)
+ });
+ }
+
+ // 暴露给父组件的方法
+ useImperativeHandle(ref, () => ({
+ handleOpen,
+ }));
+
+ return (
+
+
+
+ );
+});
+
+export default OntologyModal;
\ No newline at end of file
diff --git a/web/src/views/Ontology/components/PageHeader.tsx b/web/src/views/Ontology/components/PageHeader.tsx
new file mode 100644
index 00000000..81009596
--- /dev/null
+++ b/web/src/views/Ontology/components/PageHeader.tsx
@@ -0,0 +1,45 @@
+import { type FC, type ReactNode } from 'react';
+import { useNavigate } from 'react-router-dom';
+import { Layout, Button } from 'antd';
+import { useTranslation } from 'react-i18next';
+import logoutIcon from '@/assets/images/logout_hover.svg'
+
+const { Header } = Layout;
+
+interface ConfigHeaderProps {
+ name?: string;
+ subTitle?: ReactNode | string;
+ extra?: ReactNode;
+}
+const PageHeader: FC = ({
+ name,
+ subTitle,
+ extra
+}) => {
+ const { t } = useTranslation();
+ const navigate = useNavigate();
+
+ const goBack = () => {
+ navigate(-1)
+ }
+ return (
+
+
+ );
+};
+
+export default PageHeader;
\ No newline at end of file
diff --git a/web/src/views/Ontology/index.tsx b/web/src/views/Ontology/index.tsx
new file mode 100644
index 00000000..4d32dfa6
--- /dev/null
+++ b/web/src/views/Ontology/index.tsx
@@ -0,0 +1,133 @@
+import { type FC, useState, useRef, type MouseEvent } from 'react';
+import { useNavigate } from 'react-router-dom';
+import { useTranslation } from 'react-i18next';
+import { Row, Col, Button, Flex, Divider, Space, App, Tooltip } from 'antd'
+
+import SearchInput from '@/components/SearchInput';
+import OntologyModal from './components/OntologyModal'
+import type { OntologyModalRef, OntologyItem, Query } from './types'
+import RbCard from '@/components/RbCard/Card'
+import Tag from '@/components/Tag'
+import PageScrollList, { type PageScrollListRef } from '@/components/PageScrollList'
+import { getOntologyScenesUrl, deleteOntologyScene } from '@/api/ontology'
+import { formatDateTime } from '@/utils/format'
+
+const Ontology: FC = () => {
+ const { t } = useTranslation();
+ const navigate = useNavigate()
+ const { modal, message } = App.useApp();
+ const [query, setQuery] = useState({});
+ const scrollListRef = useRef(null)
+ const entityModalRef = useRef(null)
+
+ const handleCreate = () => {
+ entityModalRef.current?.handleOpen()
+ }
+ const handleEdit = (record: OntologyItem, e: MouseEvent) => {
+ e.preventDefault();
+ e.stopPropagation();
+ entityModalRef.current?.handleOpen(record)
+ }
+ const handleDelete = (item: OntologyItem, e: MouseEvent) => {
+ e.preventDefault();
+ e.stopPropagation();
+ modal.confirm({
+ title: t('common.confirmDeleteDesc', { name: item.scene_name }),
+ okText: t('common.delete'),
+ cancelText: t('common.cancel'),
+ okType: 'danger',
+ onOk: () => {
+ deleteOntologyScene(item.scene_id)
+ .then(() => {
+ message.success(t('common.deleteSuccess'))
+ scrollListRef.current?.refresh()
+ })
+ }
+ })
+ }
+ const handleJump = (record: OntologyItem) => {
+ navigate(`/ontology/${record.scene_id}`)
+ }
+
+ return (
+ <>
+
+ setQuery({ scene_name: value })}
+ className="rb:w-full!"
+ />
+
+
+
+
+ ref={scrollListRef}
+ url={getOntologyScenesUrl}
+ query={query}
+ column={3}
+ renderItem={(item) =>(
+ {item.type_num} {t('ontology.typeCount')}}
+ onClick={() => handleJump(item)}
+ className="rb:cursor-pointer"
+ >
+
+ {type}
+ ))}
+ {item.type_num > 3 && (
+ +{item.type_num - 3}
+ )}
+
+
+
+ )}
+ />
+
+ scrollListRef.current?.refresh()}
+ />
+
+ )
+}
+
+export default Ontology
\ No newline at end of file
diff --git a/web/src/views/Ontology/pages/Detail.tsx b/web/src/views/Ontology/pages/Detail.tsx
new file mode 100644
index 00000000..b7123c5c
--- /dev/null
+++ b/web/src/views/Ontology/pages/Detail.tsx
@@ -0,0 +1,122 @@
+import { type FC, useEffect, useState, useRef } from 'react'
+import { useParams } from 'react-router-dom';
+import { useTranslation } from 'react-i18next';
+import { App, Row, Col, Tooltip, Space, Button } from 'antd'
+
+import PageHeader from '../components/PageHeader'
+import { getOntologyClassList, deleteOntologyClass } from '@/api/ontology'
+import type { OntologyClassData, OntologyClassModalRef, OntologyClassExtractModalRef, OntologyClassItem } from '@/views/Ontology/types'
+import RbCard from '@/components/RbCard/Card';
+import OntologyClassModal from '../components/OntologyClassModal'
+import SearchInput from '@/components/SearchInput';
+import OntologyClassExtractModal from '../components/OntologyClassExtractModal'
+import BodyWrapper from '@/components/Empty/BodyWrapper'
+
+const Detail: FC = () => {
+ const { t } = useTranslation();
+ const { id } = useParams()
+ const { modal, message } = App.useApp()
+ const ontologyClassModalRef = useRef(null)
+ const ontologyClassExtractModalRef = useRef(null)
+ const [query, setQuery] = useState<{
+ class_name?: string;
+ }>({});
+ const [loading, setLoading] = useState(false)
+ const [data, setData] = useState({} as OntologyClassData)
+
+ useEffect(() => {
+ getData()
+ }, [id, query])
+
+ const getData = () => {
+ if (!id) return;
+ setLoading(true)
+ getOntologyClassList({
+ ...query,
+ scene_id: id
+ })
+ .then(res => {
+ setData(res as OntologyClassData)
+ })
+ .finally(() => {
+ setLoading(false)
+ })
+ }
+ const handleDelete = (item: OntologyClassItem) => {
+ modal.confirm({
+ title: t('common.confirmDeleteDesc', { name: item.class_name }),
+ okText: t('common.delete'),
+ cancelText: t('common.cancel'),
+ okType: 'danger',
+ onOk: () => {
+ deleteOntologyClass(item.class_id)
+ .then(() => {
+ getData();
+ message.success(t('common.deleteSuccess'))
+ })
+ }
+ })
+ }
+ const handleAdd = () => {
+ ontologyClassModalRef.current?.handleOpen(data.scene_id)
+ }
+ const handleExtract = () => {
+ ontologyClassExtractModalRef.current?.handleOpen(data)
+ }
+
+ return (
+ <>
+ {data.scene_description}
}
+ extra={
+ {item.name}
+ {item.examples.map((vo, index) => {vo} )}
+
)}
+ listStyle={{ width: '400px', height: '100%' }}
+ />
+
+
+
+
+ {name}
+
+ {subTitle}
+
+
+ {extra}
+
+
+ {t(`ontology.scene_description`)}
+
+ {item.scene_description}
+
+
+ {(['created_at', 'updated_at'] as const).map(key => (
+
+ {t(`ontology.${key}`)}
+ {formatDateTime(item[key])}
+
+ ))}
+ {t('ontology.entityTypes')}:
+ {item.entity_type?.map((type, i) => (
+
+
+
+
+ handleEdit(item, e)}
+ >
+ handleDelete(item, e)}
+ >
+
+
+ setQuery({ class_name: value })}
+ className="rb:w-full!"
+ />
+
+
+
+
+ {data.items?.map(item => (
+ handleDelete(item)}
+ >
}
+ className="rb:bg-transparent!"
+ >
+ {item.class_description}
+