history trial 2

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>