From 427030c39010bfce1c9c4e94d73c4d8a816ecaf2 Mon Sep 17 00:00:00 2001
From: Jaanus Sellin <sellinjaanus@gmail.com>
Date: Wed, 12 Apr 2023 09:43:05 +0300
Subject: [PATCH] feat: add username to CR overview and list (#3498)

---
 .../ChangeRequestHeader.tsx                   |  6 +++++
 .../AvatarCell/AvatarCell.tsx                 | 26 ++++++++++++++-----
 .../ChangeRequestsTabs/ChangeRequestsTabs.tsx |  2 +-
 3 files changed, 27 insertions(+), 7 deletions(-)

diff --git a/frontend/src/component/changeRequest/ChangeRequestOverview/ChangeRequestHeader/ChangeRequestHeader.tsx b/frontend/src/component/changeRequest/ChangeRequestOverview/ChangeRequestHeader/ChangeRequestHeader.tsx
index b4a1bdd471..70d1bcfd8c 100644
--- a/frontend/src/component/changeRequest/ChangeRequestOverview/ChangeRequestHeader/ChangeRequestHeader.tsx
+++ b/frontend/src/component/changeRequest/ChangeRequestOverview/ChangeRequestHeader/ChangeRequestHeader.tsx
@@ -45,6 +45,12 @@ export const ChangeRequestHeader: FC<{ changeRequest: IChangeRequest }> = ({
                         />
                     </Tooltip>
                 </Box>
+                <Typography
+                    variant="body2"
+                    sx={theme => ({ marginLeft: theme.spacing(0.5) })}
+                >
+                    {changeRequest?.createdBy?.username}
+                </Typography>
                 <Box sx={theme => ({ marginLeft: theme.spacing(1.5) })}>
                     <StyledCard variant="outlined">
                         <Typography variant="body2" sx={{ lineHeight: 1 }}>
diff --git a/frontend/src/component/changeRequest/ProjectChangeRequests/ChangeRequestsTabs/AvatarCell/AvatarCell.tsx b/frontend/src/component/changeRequest/ProjectChangeRequests/ChangeRequestsTabs/AvatarCell/AvatarCell.tsx
index ae4c5bd50a..29decc66ba 100644
--- a/frontend/src/component/changeRequest/ProjectChangeRequests/ChangeRequestsTabs/AvatarCell/AvatarCell.tsx
+++ b/frontend/src/component/changeRequest/ProjectChangeRequests/ChangeRequestsTabs/AvatarCell/AvatarCell.tsx
@@ -1,13 +1,27 @@
-import { UserAvatar } from '../../../../common/UserAvatar/UserAvatar';
-import { TextCell } from '../../../../common/Table/cells/TextCell/TextCell';
+import { UserAvatar } from 'component/common/UserAvatar/UserAvatar';
+import { TextCell } from 'component/common/Table/cells/TextCell/TextCell';
+import { styled, Typography } from '@mui/material';
+
+const StyledContainer = styled('div')(({ theme }) => ({
+    display: 'flex',
+    flexDirection: 'row',
+    alignItems: 'center',
+    margin: 0,
+}));
 
 export const AvatarCell = ({ value }: any) => {
     return (
         <TextCell>
-            <UserAvatar
-                user={value}
-                sx={{ maxWidth: '30px', maxHeight: '30px', alignSelf: 'left' }}
-            />
+            <StyledContainer>
+                <UserAvatar
+                    user={value}
+                    sx={theme => ({ marginRight: theme.spacing(0.5) })}
+                />
+                <Typography component={'span'} variant={'body2'}>
+                    {' '}
+                    {value?.username}
+                </Typography>
+            </StyledContainer>
         </TextCell>
     );
 };
diff --git a/frontend/src/component/changeRequest/ProjectChangeRequests/ChangeRequestsTabs/ChangeRequestsTabs.tsx b/frontend/src/component/changeRequest/ProjectChangeRequests/ChangeRequestsTabs/ChangeRequestsTabs.tsx
index 769b068801..cb4d2f319f 100644
--- a/frontend/src/component/changeRequest/ProjectChangeRequests/ChangeRequestsTabs/ChangeRequestsTabs.tsx
+++ b/frontend/src/component/changeRequest/ProjectChangeRequests/ChangeRequestsTabs/ChangeRequestsTabs.tsx
@@ -108,7 +108,7 @@ export const ChangeRequestsTabs = ({
             {
                 Header: 'By',
                 accessor: 'createdBy',
-                maxWidth: 50,
+                maxWidth: 100,
                 canSort: false,
                 Cell: AvatarCell,
                 align: 'center',