diff --git a/libs/chatbot/lib/components/ChatBot/ChatBot.tsx b/libs/chatbot/lib/components/ChatBot/ChatBot.tsx index d381352ace..fb44c499c0 100644 --- a/libs/chatbot/lib/components/ChatBot/ChatBot.tsx +++ b/libs/chatbot/lib/components/ChatBot/ChatBot.tsx @@ -26,8 +26,6 @@ const ChatBot = ({ onApiCall, username }: ChatBotProps) => { setConversationId={setConversationId} onClose={() => { setChatbotVisible(false); - setMessages([]); - setConversationId(undefined); }} onApiCall={onApiCall} username={username} diff --git a/libs/chatbot/lib/components/ChatBot/ChatBotWindow.tsx b/libs/chatbot/lib/components/ChatBot/ChatBotWindow.tsx index 38e2b474b5..db64b35847 100644 --- a/libs/chatbot/lib/components/ChatBot/ChatBotWindow.tsx +++ b/libs/chatbot/lib/components/ChatBot/ChatBotWindow.tsx @@ -26,6 +26,7 @@ import { ExternalLinkAltIcon } from '@patternfly-6/react-icons/dist/js/icons/ext import { PlusIcon, TimesIcon } from '@patternfly-6/react-icons'; import BotMessage, { FeedbackRequest } from './BotMessage'; +import ConfirmNewChatModal from './ConfirmNewChatModal'; import AIAvatar from '../../assets/rh-logo.svg'; import UserAvatar from '../../assets/avatarimg.svg'; @@ -96,10 +97,22 @@ const ChatBotWindow = ({ const [isAlertVisible, setIsAlertVisible] = React.useState( localStorage.getItem(CHAT_ALERT_LOCAL_STORAGE_KEY) !== 'true', ); + const [isConfirmModalOpen, setIsConfirmModalOpen] = React.useState(false); const scrollToBottomRef = React.useRef(null); - const handleNewChat = () => { + + const startNewChat = () => { setConversationId(undefined); setMessages([]); + setIsConfirmModalOpen(false); + }; + + const handleNewChat = () => { + // Only show confirmation if there are existing messages + if (messages.length > 0) { + setIsConfirmModalOpen(true); + } else { + startNewChat(); + } }; const scrollToBottom = React.useCallback(() => { @@ -362,6 +375,12 @@ const ChatBotWindow = ({ }} /> + {isConfirmModalOpen && ( + setIsConfirmModalOpen(false)} + /> + )} ); }; diff --git a/libs/chatbot/lib/components/ChatBot/ConfirmNewChatModal.tsx b/libs/chatbot/lib/components/ChatBot/ConfirmNewChatModal.tsx new file mode 100644 index 0000000000..49c895f033 --- /dev/null +++ b/libs/chatbot/lib/components/ChatBot/ConfirmNewChatModal.tsx @@ -0,0 +1,37 @@ +import * as React from 'react'; +import { + Button, + Modal, + ModalBody, + ModalFooter, + ModalHeader, + ModalVariant, +} from '@patternfly-6/react-core'; + +const ConfirmNewChatModal = ({ + onConfirm, + onCancel, +}: { + onConfirm: VoidFunction; + onCancel: VoidFunction; +}) => { + return ( + + + + Starting a new chat will permanently erase your current conversation. If you want to save + any information, please copy it before proceeding. + + + + + + + ); +}; + +export default ConfirmNewChatModal;