chat history enter to save edits

This commit is contained in:
Jing Hua 2023-03-27 23:00:40 +08:00
parent 5f1762f557
commit a0c43a4ac0
2 changed files with 69 additions and 38 deletions

View file

@ -30,18 +30,13 @@ const ChatFolder = ({
const [_folderName, _setFolderName] = useState<string>(folderName);
const [isEdit, setIsEdit] = useState<boolean>(false);
const [isDelete, setIsDelete] = useState<boolean>(false);
// const [isExpanded, setIsExpanded] = useState<boolean>(
// useStore.getState().foldersExpanded[folderIndex]
// );
const [isHover, setIsHover] = useState<boolean>(false);
const handleTick = (e: React.MouseEvent<HTMLButtonElement>) => {
e.stopPropagation();
const editTitle = () => {
const updatedChats: ChatInterface[] = JSON.parse(
JSON.stringify(useStore.getState().chats)
);
if (isEdit) {
updatedChats.forEach((chat) => {
if (chat.folder === folderName) chat.folder = _folderName;
});
@ -53,7 +48,12 @@ const ChatFolder = ({
setFoldersName(updatedFolderNames);
setIsEdit(false);
} else if (isDelete) {
};
const deleteFolder = () => {
const updatedChats: ChatInterface[] = JSON.parse(
JSON.stringify(useStore.getState().chats)
);
updatedChats.forEach((chat) => {
if (chat.folder === folderName) delete chat.folder;
});
@ -63,9 +63,22 @@ const ChatFolder = ({
useStore.getState().foldersName.filter((name) => name !== folderName)
);
setIsDelete(false);
};
const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
if (e.key === 'Enter') {
e.preventDefault();
editTitle();
}
};
const handleTick = (e: React.MouseEvent<HTMLButtonElement>) => {
e.stopPropagation();
if (isEdit) editTitle();
else if (isDelete) deleteFolder();
};
const handleCross = () => {
setIsDelete(false);
setIsEdit(false);
@ -127,6 +140,7 @@ const ChatFolder = ({
_setFolderName(e.target.value);
}}
onClick={(e) => e.stopPropagation()}
onKeyDown={handleKeyDown}
ref={inputRef}
/>
) : (

View file

@ -33,16 +33,19 @@ const ChatHistory = React.memo(
const [_title, _setTitle] = useState<string>(title);
const inputRef = useRef<HTMLInputElement>(null);
const handleTick = (e: React.MouseEvent<HTMLButtonElement>) => {
e.stopPropagation();
const editTitle = () => {
const updatedChats = JSON.parse(
JSON.stringify(useStore.getState().chats)
);
if (isEdit) {
updatedChats[chatIndex].title = _title;
setChats(updatedChats);
setIsEdit(false);
} else if (isDelete) {
};
const deleteChat = () => {
const updatedChats = JSON.parse(
JSON.stringify(useStore.getState().chats)
);
updatedChats.splice(chatIndex, 1);
if (updatedChats.length > 0) {
setCurrentChatIndex(0);
@ -51,9 +54,22 @@ const ChatHistory = React.memo(
initialiseNewChat();
}
setIsDelete(false);
};
const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
if (e.key === 'Enter') {
e.preventDefault();
editTitle();
}
};
const handleTick = (e: React.MouseEvent<HTMLButtonElement>) => {
e.stopPropagation();
if (isEdit) editTitle();
else if (isDelete) deleteChat();
};
const handleCross = () => {
setIsDelete(false);
setIsEdit(false);
@ -94,6 +110,7 @@ const ChatHistory = React.memo(
onChange={(e) => {
_setTitle(e.target.value);
}}
onKeyDown={handleKeyDown}
ref={inputRef}
/>
) : (