From f8e2706d33739e516cba8eeb42d235177d7ee80f Mon Sep 17 00:00:00 2001
From: YasinOnm08 <onmazyasin4@gmail.com>
Date: Tue, 8 Oct 2024 16:47:40 +0200
Subject: [PATCH] history trial 2
---
app/components/History.tsx | 34 ++++++++++++++++++++++++++++++++++
app/hooks/useChatHistory.tsx | 3 ++-
2 files changed, 36 insertions(+), 1 deletion(-)
diff --git a/app/components/History.tsx b/app/components/History.tsx
index 297e638..e4d593a 100644
--- a/app/components/History.tsx
+++ b/app/components/History.tsx
@@ -3,11 +3,30 @@ import { useChatHistory } from '../hooks/useChatHistory';
const History: React.FC = () => {
const [chatHistory, setChatHistory, setSelectedIndex] = useChatHistory()
+ const [isEditing, setIsEditing] = useState(false);
+ const [inputValue, setInputValue] = useState<string>('');
+
+ const handleEditButtonClick = () => {
+ setIsEditing(true);
+ };
+
+ const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+ setInputValue(e.target.value);
+ };
+
+ const handleSaveButtonClick = () => {
+ setIsEditing(false);
+ chatHistory.chats.push({ name: inputValue, messages: [], timestamp: 5 })
+ setInputValue("")
+ };
const handleHistoryClick = (index: number) => {
setSelectedIndex(index)
+ console.log("index",index);
+
}
+
return (
<div className="history-background">
<div className="history">
@@ -18,6 +37,21 @@ const History: React.FC = () => {
<a href="#" onClick={() => handleHistoryClick(index)}>{chatHistory.chats[index].name}</a>
</li>
))}
+ <li>
+ {isEditing ? (
+ <div>
+ <input
+ type="text"
+ value={inputValue}
+ onChange={handleInputChange}
+ placeholder="Enter text"
+ />
+ <button onClick={handleSaveButtonClick}>Save</button>
+ </div>
+ ) : (
+ <button onClick={handleEditButtonClick}>{'New Chat'}</button>
+ )}
+ </li>
</ul>
</div>
</div>
diff --git a/app/hooks/useChatHistory.tsx b/app/hooks/useChatHistory.tsx
index b849d79..e3c550c 100644
--- a/app/hooks/useChatHistory.tsx
+++ b/app/hooks/useChatHistory.tsx
@@ -19,7 +19,8 @@ interface GlobalChatHistory {
let globalChatHistory: GlobalChatHistory = {
chats: [
- { name: "Chat 1", messages: [], timestamp: 4 }
+ { name: "Chat 1", messages: [{role:"system",content:"you are a helpful assistant"},{role:"assistant",content:"how can i help you"}], timestamp: 4 },
+ { name: "Chat 2", messages: [{role:"system",content:"you are a helpful assistant"},{role:"assistant",content:"how can i help you"}], timestamp: 4 },
],
selectedIndex:0
}