From bec4e3365173d427df76c33955914e4e9f389367 Mon Sep 17 00:00:00 2001
From: Steph Milovic <stephanie.milovic@elastic.co>
Date: Fri, 27 Mar 2020 11:25:48 -0600
Subject: [PATCH] [SIEM] [Cases] Fix comments and user (#61642)

---
 .../case/components/user_action_tree/index.tsx  | 17 ++++++++++-------
 .../user_action_tree/user_action_item.tsx       | 12 ++++++------
 .../user_action_tree/user_action_title.tsx      |  6 +++---
 3 files changed, 19 insertions(+), 16 deletions(-)

diff --git a/x-pack/legacy/plugins/siem/public/pages/case/components/user_action_tree/index.tsx b/x-pack/legacy/plugins/siem/public/pages/case/components/user_action_tree/index.tsx
index b3a4b07712857..75013c0afde5d 100644
--- a/x-pack/legacy/plugins/siem/public/pages/case/components/user_action_tree/index.tsx
+++ b/x-pack/legacy/plugins/siem/public/pages/case/components/user_action_tree/index.tsx
@@ -71,14 +71,14 @@ export const UserActionTree = React.memo(
     );
 
     const handleSaveComment = useCallback(
-      (id: string, content: string) => {
+      ({ id, version }: { id: string; version: string }, content: string) => {
         handleManageMarkdownEditId(id);
         patchComment({
           caseId: caseData.id,
           commentId: id,
           commentUpdate: content,
           fetchUserActions,
-          version: caseData.version,
+          version,
           updateCase,
         });
       },
@@ -178,7 +178,7 @@ export const UserActionTree = React.memo(
           markdown={MarkdownDescription}
           onEdit={handleManageMarkdownEditId.bind(null, DESCRIPTION_ID)}
           onQuote={handleManageQuote.bind(null, caseData.description)}
-          userName={caseData.createdBy.username}
+          username={caseData.createdBy.username}
         />
 
         {caseUserActions.map((action, index) => {
@@ -203,13 +203,16 @@ export const UserActionTree = React.memo(
                       content={comment.comment}
                       isEditable={manageMarkdownEditIds.includes(comment.id)}
                       onChangeEditable={handleManageMarkdownEditId}
-                      onSaveContent={handleSaveComment.bind(null, comment.id)}
+                      onSaveContent={handleSaveComment.bind(null, {
+                        id: comment.id,
+                        version: comment.version,
+                      })}
                     />
                   }
                   onEdit={handleManageMarkdownEditId.bind(null, comment.id)}
                   onQuote={handleManageQuote.bind(null, comment.comment)}
                   outlineComment={handleOutlineComment}
-                  userName={comment.createdBy.username}
+                  username={comment.createdBy.username}
                   updatedAt={comment.updatedAt}
                 />
               );
@@ -245,7 +248,7 @@ export const UserActionTree = React.memo(
                   index === lastIndexPushToService &&
                   index < caseUserActions.length - 1
                 }
-                userName={action.actionBy.username}
+                username={action.actionBy.username}
               />
             );
           }
@@ -265,7 +268,7 @@ export const UserActionTree = React.memo(
           isLoading={isLoadingIds.includes(NEW_ID)}
           fullName={currentUser != null ? currentUser.fullName : ''}
           markdown={MarkdownNewComment}
-          userName={currentUser != null ? currentUser.username : ''}
+          username={currentUser != null ? currentUser.username : ''}
         />
       </>
     );
diff --git a/x-pack/legacy/plugins/siem/public/pages/case/components/user_action_tree/user_action_item.tsx b/x-pack/legacy/plugins/siem/public/pages/case/components/user_action_tree/user_action_item.tsx
index c1dbe3b5fdbfa..cc36e791e35b4 100644
--- a/x-pack/legacy/plugins/siem/public/pages/case/components/user_action_tree/user_action_item.tsx
+++ b/x-pack/legacy/plugins/siem/public/pages/case/components/user_action_tree/user_action_item.tsx
@@ -28,11 +28,11 @@ interface UserActionItemProps {
   labelQuoteAction?: string;
   labelTitle?: JSX.Element;
   linkId?: string | null;
-  fullName: string;
+  fullName?: string | null;
   markdown?: React.ReactNode;
   onEdit?: (id: string) => void;
   onQuote?: (id: string) => void;
-  userName: string;
+  username: string;
   updatedAt?: string | null;
   outlineComment?: (id: string) => void;
   showBottomFooter?: boolean;
@@ -125,15 +125,15 @@ export const UserActionItem = ({
   outlineComment,
   showBottomFooter,
   showTopFooter,
-  userName,
+  username,
   updatedAt,
 }: UserActionItemProps) => (
   <UserActionItemContainer gutterSize={'none'} direction="column">
     <EuiFlexItem>
       <EuiFlexGroup gutterSize={'none'}>
         <EuiFlexItem data-test-subj={`user-action-${id}-avatar`} grow={false}>
-          {fullName.length > 0 || userName.length > 0 ? (
-            <UserActionAvatar name={fullName ?? userName} />
+          {(fullName && fullName.length > 0) || username.length > 0 ? (
+            <UserActionAvatar name={fullName ?? username} />
           ) : (
             <EuiLoadingSpinner className="userAction_loadingAvatar" />
           )}
@@ -154,7 +154,7 @@ export const UserActionItem = ({
                 labelQuoteAction={labelQuoteAction}
                 labelTitle={labelTitle ?? <></>}
                 linkId={linkId}
-                userName={userName}
+                username={username}
                 updatedAt={updatedAt}
                 onEdit={onEdit}
                 onQuote={onQuote}
diff --git a/x-pack/legacy/plugins/siem/public/pages/case/components/user_action_tree/user_action_title.tsx b/x-pack/legacy/plugins/siem/public/pages/case/components/user_action_tree/user_action_title.tsx
index 391f54da7e972..94185cb4d130c 100644
--- a/x-pack/legacy/plugins/siem/public/pages/case/components/user_action_tree/user_action_title.tsx
+++ b/x-pack/legacy/plugins/siem/public/pages/case/components/user_action_tree/user_action_title.tsx
@@ -34,7 +34,7 @@ interface UserActionTitleProps {
   labelTitle: JSX.Element;
   linkId?: string | null;
   updatedAt?: string | null;
-  userName: string;
+  username: string;
   onEdit?: (id: string) => void;
   onQuote?: (id: string) => void;
   outlineComment?: (id: string) => void;
@@ -48,7 +48,7 @@ export const UserActionTitle = ({
   labelQuoteAction,
   labelTitle,
   linkId,
-  userName,
+  username,
   updatedAt,
   onEdit,
   onQuote,
@@ -105,7 +105,7 @@ export const UserActionTitle = ({
         <EuiFlexItem grow={false}>
           <EuiFlexGroup alignItems="baseline" gutterSize="xs" component="span">
             <EuiFlexItem grow={false}>
-              <strong>{userName}</strong>
+              <strong>{username}</strong>
             </EuiFlexItem>
             <EuiFlexItem grow={false}>{labelTitle}</EuiFlexItem>
             <EuiFlexItem grow={false}>