feat(ChatbotAttachment): Add AttachmentEdit modal

AttachmentEdit modal needs substantial updates. Wiring this in for functionality demo purposes.
patternfly · Sep 4, 2024 · a8a177b · a8a177b
1 parent efdb070
commit a8a177b
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 1 deletion.
diff --git a/...nt/extensions/virtual-assistant/examples/ChatbotAttachment/ChatbotAttachment.md b/...nt/extensions/virtual-assistant/examples/ChatbotAttachment/ChatbotAttachment.md
@@ -35,6 +35,7 @@ import Message from '@patternfly/virtual-assistant/dist/dynamic/Message';
 import FileDropZone from '@patternfly/virtual-assistant/dist/dynamic/FileDropZone';
 import FileDetailsLabel from '@patternfly/virtual-assistant/dist/dynamic/FileDetailsLabel';
 import PreviewAttachment from '@patternfly/virtual-assistant/dist/dynamic/PreviewAttachment';
+import AttachmentEdit from '@patternfly/virtual-assistant/dist/dynamic/AttachmentEdit';
 
 ### Basic example
 

diff --git a/...ocs/content/extensions/virtual-assistant/examples/ChatbotAttachment/ChatbotAttachment.tsx b/...ocs/content/extensions/virtual-assistant/examples/ChatbotAttachment/ChatbotAttachment.tsx
@@ -11,6 +11,7 @@ import FileDropZone from '@patternfly/virtual-assistant/dist/dynamic/FileDropZon
 import { DropEvent } from '@patternfly/react-core';
 import FileDetailsLabel from '@patternfly/virtual-assistant/dist/dynamic/FileDetailsLabel';
 import PreviewAttachment from '@patternfly/virtual-assistant/dist/dynamic/PreviewAttachment';
+import AttachmentEdit from '@patternfly/virtual-assistant/dist/dynamic/AttachmentEdit';
 
 const footnoteProps = {
   label: 'Lightspeed uses AI. Check for mistakes.',
@@ -73,7 +74,8 @@ export const BasicDemo: React.FunctionComponent = () => {
       onAttachmentClose,
       onAttachmentClick: () => {
         setCurrentModalData({ fileName: 'auth-operator.yml', code: 'test' });
-        setIsPreviewModalOpen(!isPreviewModalOpen);
+        setIsEditModalOpen(false);
+        setIsPreviewModalOpen(true);
       }
     },
     {
@@ -88,6 +90,7 @@ export const BasicDemo: React.FunctionComponent = () => {
   const [isLoadingFile, setIsLoadingFile] = React.useState<boolean>(false);
   const [messages, setMessages] = React.useState<MessageProps[]>(initialMessages);
   const [isPreviewModalOpen, setIsPreviewModalOpen] = React.useState<boolean>(false);
+  const [isEditModalOpen, setIsEditModalOpen] = React.useState<boolean>(false);
   const [currentModalData, setCurrentModalData] = React.useState<ModalData>();
   const handleSend = (message) => alert(message);
 
@@ -151,11 +154,24 @@ export const BasicDemo: React.FunctionComponent = () => {
           isModalOpen={isPreviewModalOpen}
           onEdit={() => {
             setIsPreviewModalOpen(false);
+            setIsEditModalOpen(true);
           }}
           onDismiss={() => setCurrentModalData(undefined)}
           handleModalToggle={() => setIsPreviewModalOpen(false)}
         />
       )}
+      {currentModalData && (
+        <AttachmentEdit
+          code={currentModalData?.code}
+          fileName={currentModalData?.fileName}
+          isModalOpen={isEditModalOpen}
+          onSave={() => {
+            setIsEditModalOpen(false);
+          }}
+          onCancel={() => setCurrentModalData(undefined)}
+          handleModalToggle={() => setIsEditModalOpen(false)}
+        />
+      )}
     </>
   );
 };