Mercurial

annotate love/epi/src/components/Sidebar/Sidebar.tsx @ 71:75de5903355c

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Giagantic changes that update Dowa library to be more align with stb style array and hashmap. Updated Seobeo to be caching on server side instead of file level caching. Deleted bunch of things I don't really use.
author June Park <parkjune1995@gmail.com>
date Sun, 28 Dec 2025 20:34:22 -0800
parents cf9caa4abc3e
children
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
38
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
1 import { useAtom } from 'jotai';
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
2 import { chatsAtom, currentChatId } from '@/atoms/chatAtoms';
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
3 import type { Chat } from '@/atoms/chatAtoms';
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
4 import { useEffect, useState } from 'react';
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
5 import { Loader2, MessageSquare, Plus, ChevronDown } from 'lucide-react';
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
6 import { apiUrl } from '@/utils';
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
7 import { useNavigate } from '@tanstack/react-router';
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
8
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
9 export function Sidebar() {
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
10 const [chats, setChats] = useAtom(chatsAtom);
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
11 const [loading, setLoading] = useState(true);
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
12 const [loadingMore, setLoadingMore] = useState(false);
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
13 const [error, setError] = useState<string | null>(null);
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
14 const [cursor, setCursor] = useState<string | null>(null);
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
15 const [hasMore, setHasMore] = useState(true);
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
16 const [currentChatIdValue, setCurrentChatId] = useAtom(currentChatId);
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
17 const navigate = useNavigate();
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
18
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
19 const LIMIT = 12;
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
20
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
21 const fetchChats = async (currentCursor: string | null = null, append: boolean = false) => {
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
22 try {
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
23 if (append) {
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
24 setLoadingMore(true);
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
25 } else {
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
26 setLoading(true);
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
27 }
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
28 setError(null);
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
29
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
30 const url = currentCursor
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
31 ? apiUrl(`/chats?limit=${LIMIT}&cursor=${currentCursor}`)
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
32 : apiUrl(`/chats?limit=${LIMIT}`);
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
33
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
34 const res = await fetch(url);
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
35
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
36 if (!res.ok) {
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
37 throw new Error('Failed to fetch chats');
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
38 }
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
39
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
40 const data: Chat[] = (await res.json()).chats;
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
41
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
42 if (data.length < LIMIT) {
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
43 setHasMore(false);
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
44 }
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
45
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
46 if (data.length > 0) {
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
47 setCursor(data[data.length - 1].id);
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
48 }
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
49
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
50 setChats((prev) => ({
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
51 ...prev,
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
52 ...data.reduce((acc, chat) => {
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
53 acc[chat.id] = chat;
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
54 return acc;
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
55 }, {} as Record<string, Chat>),
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
56 }));
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
57 } catch (err) {
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
58 setError(err instanceof Error ? err.message : 'Something went wrong');
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
59 console.error('Error fetching chats:', err);
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
60 } finally {
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
61 setLoading(false);
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
62 setLoadingMore(false);
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
63 }
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
64 };
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
65
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
66 useEffect(() => {
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
67 fetchChats();
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
68 }, []);
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
69
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
70 const loadMore = () => {
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
71 if (!loadingMore && hasMore && cursor) {
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
72 fetchChats(cursor, true);
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
73 }
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
74 };
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
75
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
76 const chatList = Object.values(chats);
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
77
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
78 if (loading) {
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
79 return (
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
80 <div className="w-[35%] h-full border-r border-gray-800 bg-gray-900 flex items-center justify-center">
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
81 <Loader2 className="w-6 h-6 animate-spin text-gray-400" />
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
82 </div>
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
83 );
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
84 }
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
85
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
86 if (error) {
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
87 return (
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
88 <div className="w-[35%] h-full border-r border-gray-800 bg-gray-900 flex flex-col items-center justify-center p-4">
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
89 <p className="text-red-400 text-sm text-center">Error: {error}</p>
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
90 <button
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
91 onClick={() => window.location.reload()}
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
92 className="mt-3 px-4 py-2 text-xs font-medium text-white bg-gray-800 hover:bg-gray-700 rounded-md transition-colors"
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
93 >
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
94 Retry
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
95 </button>
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
96 </div>
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
97 );
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
98 }
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
99
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
100 return (
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
101 <div className="w-[35%] h-full flex flex-col border-r border-gray-800 bg-gray-900 text-gray-100 h-screen">
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
102
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
103 {/* HEADER: Static height, does not scroll */}
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
104 <div className="p-4 border-b border-gray-800 flex justify-between items-center shrink-0">
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
105 <h2 className="text-lg font-semibold text-white tracking-tight">Chats</h2>
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
106 <button
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
107 onClick={() => window.location.replace('/')}
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
108 className="p-1.5 hover:bg-gray-800 rounded-md text-gray-400 hover:text-white transition-colors"
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
109 >
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
110 <Plus className="w-5 h-5" />
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
111 </button>
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
112 </div>
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
113
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
114 <div className="flex-1 overflow-y-scroll">
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
115 {chatList.length === 0 ? (
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
116 <div className="flex flex-col items-center justify-center h-full text-gray-500">
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
117 <MessageSquare className="w-10 h-10 mb-3 opacity-20" />
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
118 <p className="text-sm font-medium">No chats yet</p>
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
119 </div>
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
120 ) : (
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
121 <ul className="flex flex-col p-2 gap-1">
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
122 {chatList.map((chat) => {
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
123 const isActive = currentChatIdValue === chat.id;
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
124 return (
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
125 <li key={chat.id}>
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
126 <button
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
127 onClick={() => {
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
128 navigate(
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
129 { to: '/chat/$chatId', params: { chatId: chat.id } },
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
130 );
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
131 setCurrentChatId(chat.id);
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
132 }}
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
133 className={`w-full text-left px-3 py-3 rounded-lg transition-all h-[8%] duration-200 ease-in-out group ${
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
134 isActive
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
135 ? 'bg-gray-800 text-white'
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
136 : 'text-gray-400 hover:bg-gray-800/50 hover:text-gray-200'
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
137 }`}
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
138 >
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
139 <div className="flex justify-between items-center">
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
140 <div className="flex-1 min-w-0 pr-2">
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
141 <h3 className={`text-sm font-medium truncate ${isActive ? 'text-white' : 'text-gray-300 group-hover:text-white'}`}>
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
142 {chat.title || 'Untitled Chat'}
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
143 </h3>
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
144 </div>
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
145 </div>
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
146 </button>
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
147 </li>
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
148 );
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
149 })}
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
150
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
151 {hasMore && (
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
152 <li className="pt-2 pb-4 px-2">
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
153 <button
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
154 onClick={loadMore}
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
155 disabled={loadingMore}
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
156 className="w-full flex items-center justify-center gap-2 py-2 text-xs font-medium text-gray-500 hover:text-gray-300 transition-colors border border-dashed border-gray-700 rounded-md hover:border-gray-600 disabled:opacity-50 disabled:cursor-not-allowed"
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
157 >
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
158 {loadingMore ? (
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
159 <>
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
160 <Loader2 className="w-3 h-3 animate-spin" />
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
161 Loading...
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
162 </>
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
163 ) : (
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
164 <>
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
165 Load More <ChevronDown className="w-3 h-3" />
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
166 </>
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
167 )}
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
168 </button>
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
169 </li>
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
170 )}
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
171 </ul>
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
172 )}
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
173 </div>
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
174 </div>
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
175 );
cf9caa4abc3e [Love] FE and BE. Can chat and render images. Also created MCP for powerpoint generations.
MrJuneJune <me@mrjunejune.com>
parents:
diff changeset
176 }