pengjunjie/ragflow
1
0
Fork 1
mirror of https://github.com/infiniflow/ragflow.git synced 2026-01-04 03:25:30 +08:00
Code Issues Packages Projects Releases Wiki Activity

Feat: Render dialog list #3221 (#9249)

Browse Source 
### What problem does this PR solve?

Feat: Render dialog list #3221

### Type of change


- [x] New Feature (non-breaking change which adds functionality)
This commit is contained in:
balibabu
2025-08-05 17:47:44 +08:00
committed by GitHub
parent e6bad45c6d
commit a264c629b5
11 changed files with 321 additions and 71 deletions
Download Patch File Download Diff File Expand all files Collapse all files

69
web/src/pages/next-chats/chat-card.tsx
View File

@ -1,52 +1,45 @@
import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar';
import { Button } from '@/components/ui/button';
import { MoreButton } from '@/components/more-button';
import { RAGFlowAvatar } from '@/components/ragflow-avatar';
import { Card, CardContent } from '@/components/ui/card';
import { useNavigatePage } from '@/hooks/logic-hooks/navigate-hooks';
import { IDialog } from '@/interfaces/database/chat';
import { formatPureDate } from '@/utils/date';
import { ChevronRight, Trash2 } from 'lucide-react';
import { formatDate } from '@/utils/date';
import { ChatDropdown } from './chat-dropdown';
import { useRenameChat } from './hooks/use-rename-chat';
interface IProps {
export type IProps = {
data: IDialog;
}
} & Pick<ReturnType<typeof useRenameChat>, 'showChatRenameModal'>;
export function ChatCard({ data }: IProps) {
export function ChatCard({ data, showChatRenameModal }: IProps) {
const { navigateToChat } = useNavigatePage();
return (
<Card className="bg-colors-background-inverse-weak border-colors-outline-neutral-standard">
<CardContent className="p-4">
<div className="flex justify-between mb-4">
{data.icon ? (
<div
className="w-[70px] h-[70px] rounded-xl bg-cover"
style={{ backgroundImage: `url(${data.icon})` }}
/>
) : (
<Avatar className="w-[70px] h-[70px]">
<AvatarImage src="https://github.com/shadcn.png" />
<AvatarFallback>CN</AvatarFallback>
</Avatar>
)}
</div>
<h3 className="text-xl font-bold mb-2">{data.name}</h3>
<p>An app that does things An app that does things</p>
<section className="flex justify-between pt-3">
<div>
Search app
<p className="text-sm opacity-80">
{formatPureDate(data.update_time)}
<Card key={data.id} className="w-40" onClick={navigateToChat(data.id)}>
<CardContent className="p-2.5 pt-2 group">
<section className="flex justify-between mb-2">
<div className="flex gap-2 items-center">
<RAGFlowAvatar
className="size-6 rounded-lg"
avatar={data.icon}
name={data.name || 'CN'}
></RAGFlowAvatar>
</div>
<ChatDropdown chat={data} showChatRenameModal={showChatRenameModal}>
<MoreButton></MoreButton>
</ChatDropdown>
</section>
<div className="flex justify-between items-end">
<div className="w-full">
<h3 className="text-lg font-semibold mb-2 line-clamp-1">
{data.name}
</h3>
<p className="text-xs text-text-sub-title">{data.description}</p>
<p className="text-xs text-text-sub-title">
{formatDate(data.update_time)}
</p>
</div>
<div className="space-x-2">
<Button variant="icon" size="icon" onClick={navigateToChat}>
<ChevronRight className="h-6 w-6" />
</Button>
<Button variant="icon" size="icon">
<Trash2 />
</Button>
</div>
</section>
</div>
</CardContent>
</Card>
);