|
|
|
|
@ -1,17 +1,18 @@
|
|
|
|
|
'use client'
|
|
|
|
|
import React, { FC } from 'react'
|
|
|
|
|
import type { FC } from 'react'
|
|
|
|
|
import React from 'react'
|
|
|
|
|
import { useTranslation } from 'react-i18next'
|
|
|
|
|
import cn from 'classnames'
|
|
|
|
|
import copy from 'copy-to-clipboard'
|
|
|
|
|
import NoData from './no-data'
|
|
|
|
|
import type { SavedMessage } from '@/models/debug'
|
|
|
|
|
import { Markdown } from '@/app/components/base/markdown'
|
|
|
|
|
import { SimpleBtn, copyIcon } from '@/app/components/app/text-generate/item'
|
|
|
|
|
import copy from 'copy-to-clipboard'
|
|
|
|
|
import Toast from '@/app/components/base/toast'
|
|
|
|
|
import NoData from './no-data'
|
|
|
|
|
|
|
|
|
|
export interface ISavedItemsProps {
|
|
|
|
|
export type ISavedItemsProps = {
|
|
|
|
|
className?: string
|
|
|
|
|
list: SavedMessage[],
|
|
|
|
|
list: SavedMessage[]
|
|
|
|
|
onRemove: (id: string) => void
|
|
|
|
|
onStartCreateContent: () => void
|
|
|
|
|
}
|
|
|
|
|
@ -26,52 +27,54 @@ const SavedItems: FC<ISavedItemsProps> = ({
|
|
|
|
|
className,
|
|
|
|
|
list,
|
|
|
|
|
onRemove,
|
|
|
|
|
onStartCreateContent
|
|
|
|
|
onStartCreateContent,
|
|
|
|
|
}) => {
|
|
|
|
|
const { t } = useTranslation()
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
|
<div className={cn(className, 'space-y-3')}>
|
|
|
|
|
{list.length === 0 ? (
|
|
|
|
|
<div className='px-6'>
|
|
|
|
|
<NoData onStartCreateContent={onStartCreateContent} />
|
|
|
|
|
</div>
|
|
|
|
|
) : (<>
|
|
|
|
|
{list.map(({ id, answer }) => (
|
|
|
|
|
<div
|
|
|
|
|
key={id}
|
|
|
|
|
className='p-4 rounded-xl bg-gray-50'
|
|
|
|
|
style={{
|
|
|
|
|
boxShadow: '0px 1px 2px rgba(16, 24, 40, 0.05)'
|
|
|
|
|
}}
|
|
|
|
|
>
|
|
|
|
|
<Markdown content={answer} />
|
|
|
|
|
<div className='flex items-center justify-between mt-3'>
|
|
|
|
|
<div className='flex items-center space-x-2'>
|
|
|
|
|
<SimpleBtn
|
|
|
|
|
className='space-x-1'
|
|
|
|
|
onClick={() => {
|
|
|
|
|
copy(answer)
|
|
|
|
|
Toast.notify({ type: 'success', message: t('common.actionMsg.copySuccessfully') })
|
|
|
|
|
}}>
|
|
|
|
|
{copyIcon}
|
|
|
|
|
<div>{t('common.operation.copy')}</div>
|
|
|
|
|
</SimpleBtn>
|
|
|
|
|
{list.length === 0
|
|
|
|
|
? (
|
|
|
|
|
<div className='px-6'>
|
|
|
|
|
<NoData onStartCreateContent={onStartCreateContent} />
|
|
|
|
|
</div>
|
|
|
|
|
)
|
|
|
|
|
: (<>
|
|
|
|
|
{list.map(({ id, answer }) => (
|
|
|
|
|
<div
|
|
|
|
|
key={id}
|
|
|
|
|
className='p-4 rounded-xl bg-gray-50'
|
|
|
|
|
style={{
|
|
|
|
|
boxShadow: '0px 1px 2px rgba(16, 24, 40, 0.05)',
|
|
|
|
|
}}
|
|
|
|
|
>
|
|
|
|
|
<Markdown content={answer} />
|
|
|
|
|
<div className='flex items-center justify-between mt-3'>
|
|
|
|
|
<div className='flex items-center space-x-2'>
|
|
|
|
|
<SimpleBtn
|
|
|
|
|
className='space-x-1'
|
|
|
|
|
onClick={() => {
|
|
|
|
|
copy(answer)
|
|
|
|
|
Toast.notify({ type: 'success', message: t('common.actionMsg.copySuccessfully') })
|
|
|
|
|
}}>
|
|
|
|
|
{copyIcon}
|
|
|
|
|
<div>{t('common.operation.copy')}</div>
|
|
|
|
|
</SimpleBtn>
|
|
|
|
|
|
|
|
|
|
<SimpleBtn
|
|
|
|
|
className='space-x-1'
|
|
|
|
|
onClick={() => {
|
|
|
|
|
onRemove(id)
|
|
|
|
|
}}>
|
|
|
|
|
{removeIcon}
|
|
|
|
|
<div>{t('common.operation.remove')}</div>
|
|
|
|
|
</SimpleBtn>
|
|
|
|
|
<SimpleBtn
|
|
|
|
|
className='space-x-1'
|
|
|
|
|
onClick={() => {
|
|
|
|
|
onRemove(id)
|
|
|
|
|
}}>
|
|
|
|
|
{removeIcon}
|
|
|
|
|
<div>{t('common.operation.remove')}</div>
|
|
|
|
|
</SimpleBtn>
|
|
|
|
|
</div>
|
|
|
|
|
<div className='text-xs text-gray-500'>{answer?.length} {t('common.unit.char')}</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div className='text-xs text-gray-500'>{answer?.length} {t('common.unit.char')}</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
))}
|
|
|
|
|
</>)}
|
|
|
|
|
))}
|
|
|
|
|
</>)}
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
)
|
|
|
|
|
|