feat(web): memory insight

This commit is contained in:
zhaoying
2026-01-04 18:30:20 +08:00
parent 9dd3fc8d08
commit 4e3b8870c5
3 changed files with 60 additions and 10 deletions

View File

@@ -1,7 +1,8 @@
import { type FC, useEffect, useState, forwardRef, useImperativeHandle } from 'react'
import { useEffect, useState, forwardRef, useImperativeHandle } from 'react'
import clsx from 'clsx'
import { useTranslation } from 'react-i18next'
import { useParams } from 'react-router-dom'
import { Skeleton } from 'antd';
import { Skeleton, Space } from 'antd';
import RbCard from '@/components/RbCard/Card'
import Empty from '@/components/Empty';
import {
@@ -9,11 +10,20 @@ import {
} from '@/api/memory'
import type { MemoryInsightRef } from '../types'
interface Data {
memory_insight?: string;
behavior_pattern?: string;
key_findings?: string[];
growth_trajectory?: string;
updated_at?: number;
is_cached: boolean;
}
const MemoryInsight = forwardRef<MemoryInsightRef>((_props, ref) => {
const { t } = useTranslation()
const { id } = useParams()
const [loading, setLoading] = useState<boolean>(false)
const [report, setReport] = useState<string | null>(null)
const [data, setData] = useState<Data>({} as Data)
useEffect(() => {
if (!id) return
@@ -25,7 +35,7 @@ const MemoryInsight = forwardRef<MemoryInsightRef>((_props, ref) => {
if (!id) return
setLoading(true)
getMemoryInsightReport(id).then((res) => {
setReport((res as { report?: string }).report || null)
setData((res as Data) || {})
setLoading(false)
})
.finally(() => {
@@ -43,10 +53,35 @@ const MemoryInsight = forwardRef<MemoryInsightRef>((_props, ref) => {
>
{loading
? <Skeleton />
: report
? <div className="rb:bg-[#F6F8FC] rb:border rb:border-[#DFE4ED] rb:rounded-lg rb:py-3 rb:px-4 rb:text-[#5B6167] rb:leading-5">
{report || '-'}
</div>
: Object.keys(data).length > 0
? <Space size={16} direction="vertical" className="rb:w-full">
{['memory_insight', 'key_findings', 'behavior_pattern', 'growth_trajectory'].map(key => {
if (data[key as keyof Data]) {
return (
<div key={key} className="rb:bg-[#F6F8FC] rb:border rb:border-[#DFE4ED] rb:rounded-lg rb:py-3 rb:text-[#5B6167] rb:leading-5">
<div className={clsx(`rb:relative rb:before:content-[''] rb:before:block rb:before:h-4 rb:before:absolute rb:before:top-0.5 rb:before:left-0 rb:before:w-1 rb:pl-4 rb:mb-2 rb:font-medium rb:leading-5`, {
'rb:before:bg-[#155EEF]': key === 'memory_insight',
'rb:before:bg-[#369F21]': key !== 'memory_insight'
})}>{t(`userMemory.${key}`)}</div>
<div className="rb:px-4">
{Array.isArray(data[key as keyof Data])
? <>
{(data[key as keyof Data] as string[])?.map((item: string, index: number) => (
<div key={index}>
- {item}
</div>
))}
</>
: data[key as keyof Data] as string
}
</div>
</div>
)
}
return null
})}
</Space>
: <Empty size={80} />
}
</RbCard>