From d825dc557906a610dcb471eb697aaff603d29355 Mon Sep 17 00:00:00 2001
From: Dakshesh Jain <65905942+dakshesh14@users.noreply.github.com>
Date: Fri, 18 Aug 2023 17:15:20 +0530
Subject: [PATCH] style: showing first name for bot profile (#1894)

---
 apps/app/components/issues/activity.tsx                |  8 ++++++--
 apps/app/components/issues/comment/comment-card.tsx    | 10 ++++++++--
 .../app/components/notifications/notification-card.tsx | 10 ++++++++--
 3 files changed, 22 insertions(+), 6 deletions(-)

diff --git a/apps/app/components/issues/activity.tsx b/apps/app/components/issues/activity.tsx
index 1b5cd6e4c69..83da7d521c4 100644
--- a/apps/app/components/issues/activity.tsx
+++ b/apps/app/components/issues/activity.tsx
@@ -134,7 +134,9 @@ export const IssueActivitySection: React.FC<Props> = ({ issueId, user }) => {
                               <div
                                 className={`grid h-7 w-7 place-items-center rounded-full border-2 border-white bg-gray-700 text-xs text-white`}
                               >
-                                {activityItem.actor_detail.display_name.charAt(0)}
+                                {activityItem.actor_detail.is_bot
+                                  ? activityItem.actor_detail.first_name.charAt(0)
+                                  : activityItem.actor_detail.display_name.charAt(0)}
                               </div>
                             )}
                           </div>
@@ -153,7 +155,9 @@ export const IssueActivitySection: React.FC<Props> = ({ issueId, user }) => {
                         ) : (
                           <Link href={`/${workspaceSlug}/profile/${activityItem.actor_detail.id}`}>
                             <a className="text-gray font-medium">
-                              {activityItem.actor_detail.display_name}
+                              {activityItem.actor_detail.is_bot
+                                ? activityItem.actor_detail.first_name
+                                : activityItem.actor_detail.display_name}
                             </a>
                           </Link>
                         )}{" "}
diff --git a/apps/app/components/issues/comment/comment-card.tsx b/apps/app/components/issues/comment/comment-card.tsx
index 02dbe9b0b17..4e95e133494 100644
--- a/apps/app/components/issues/comment/comment-card.tsx
+++ b/apps/app/components/issues/comment/comment-card.tsx
@@ -65,7 +65,11 @@ export const CommentCard: React.FC<Props> = ({ comment, onSubmit, handleCommentD
         {comment.actor_detail.avatar && comment.actor_detail.avatar !== "" ? (
           <img
             src={comment.actor_detail.avatar}
-            alt={comment.actor_detail.display_name}
+            alt={
+              comment.actor_detail.is_bot
+                ? comment.actor_detail.first_name + " Bot"
+                : comment.actor_detail.display_name
+            }
             height={30}
             width={30}
             className="grid h-7 w-7 place-items-center rounded-full border-2 border-custom-border-200"
@@ -74,7 +78,9 @@ export const CommentCard: React.FC<Props> = ({ comment, onSubmit, handleCommentD
           <div
             className={`grid h-7 w-7 place-items-center rounded-full border-2 border-white bg-gray-500 text-white`}
           >
-            {comment.actor_detail.display_name.charAt(0)}
+            {comment.actor_detail.is_bot
+              ? comment.actor_detail.first_name.charAt(0)
+              : comment.actor_detail.display_name.charAt(0)}
           </div>
         )}
 
diff --git a/apps/app/components/notifications/notification-card.tsx b/apps/app/components/notifications/notification-card.tsx
index 1987c7155c0..9bb0715a854 100644
--- a/apps/app/components/notifications/notification-card.tsx
+++ b/apps/app/components/notifications/notification-card.tsx
@@ -80,7 +80,9 @@ export const NotificationCard: React.FC<NotificationCardProps> = (props) => {
         ) : (
           <div className="w-12 h-12 bg-custom-background-80 rounded-full flex justify-center items-center">
             <span className="text-custom-text-100 font-medium text-lg">
-              {notification.triggered_by_details.display_name?.[0] ? (
+              {notification.triggered_by_details.is_bot ? (
+                notification.triggered_by_details.first_name?.[0]?.toUpperCase()
+              ) : notification.triggered_by_details.display_name?.[0] ? (
                 notification.triggered_by_details.display_name?.[0]?.toUpperCase()
               ) : (
                 <Icon iconName="person" className="h-6 w-6" />
@@ -91,7 +93,11 @@ export const NotificationCard: React.FC<NotificationCardProps> = (props) => {
       </div>
       <div className="space-y-2.5 w-full overflow-hidden">
         <div className="text-sm w-full break-words">
-          <span className="font-semibold">{notification.triggered_by_details.display_name} </span>
+          <span className="font-semibold">
+            {notification.triggered_by_details.is_bot
+              ? notification.triggered_by_details.first_name
+              : notification.triggered_by_details.display_name}{" "}
+          </span>
           {notification.data.issue_activity.field !== "comment" &&
             notification.data.issue_activity.verb}{" "}
           {notification.data.issue_activity.field === "comment"