1
0
mirror of https://github.com/Unleash/unleash.git synced 2025-06-04 01:18:20 +02:00

change request tooltips (#2555)

This commit is contained in:
Mateusz Kwasniewski 2022-11-29 12:56:19 +01:00 committed by GitHub
parent 9f983f4ed6
commit 87d9466005
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 16 additions and 10 deletions

View File

@ -1,6 +1,7 @@
import { FC } from 'react'; import { FC } from 'react';
import { Box, Button, styled, TextField } from '@mui/material'; import { Box, styled, TextField, Tooltip } from '@mui/material';
import { StyledAvatar } from './StyledAvatar'; import { StyledAvatar } from './StyledAvatar';
import { IUser } from 'interfaces/user';
const AddCommentWrapper = styled(Box)(({ theme }) => ({ const AddCommentWrapper = styled(Box)(({ theme }) => ({
display: 'flex', display: 'flex',
@ -9,13 +10,15 @@ const AddCommentWrapper = styled(Box)(({ theme }) => ({
})); }));
export const AddCommentField: FC<{ export const AddCommentField: FC<{
imageUrl: string; user: IUser | undefined;
commentText: string; commentText: string;
onTypeComment: (text: string) => void; onTypeComment: (text: string) => void;
}> = ({ imageUrl, commentText, onTypeComment, children }) => ( }> = ({ user, commentText, onTypeComment, children }) => (
<> <>
<AddCommentWrapper> <AddCommentWrapper>
<StyledAvatar src={imageUrl} /> <Tooltip title={user?.name || user?.username}>
<StyledAvatar src={user?.imageUrl || ''} />
</Tooltip>
<TextField <TextField
variant="outlined" variant="outlined"
placeholder="Add your comment here" placeholder="Add your comment here"

View File

@ -1,6 +1,6 @@
import { FC } from 'react'; import { FC } from 'react';
import Paper from '@mui/material/Paper'; import Paper from '@mui/material/Paper';
import { Box, styled, Typography } from '@mui/material'; import { Box, styled, Typography, Tooltip } from '@mui/material';
import TimeAgo from 'react-timeago'; import TimeAgo from 'react-timeago';
import { StyledAvatar } from './StyledAvatar'; import { StyledAvatar } from './StyledAvatar';
import { IChangeRequestComment } from '../../changeRequest.types'; import { IChangeRequestComment } from '../../changeRequest.types';
@ -26,7 +26,9 @@ export const ChangeRequestComment: FC<{ comment: IChangeRequestComment }> = ({
comment, comment,
}) => ( }) => (
<ChangeRequestCommentWrapper> <ChangeRequestCommentWrapper>
<Tooltip title={comment.createdBy.username}>
<StyledAvatar src={comment.createdBy.imageUrl} /> <StyledAvatar src={comment.createdBy.imageUrl} />
</Tooltip>
<CommentPaper variant="outlined"> <CommentPaper variant="outlined">
<CommentHeader> <CommentHeader>
<Box> <Box>

View File

@ -1,6 +1,6 @@
import { Box } from '@mui/material'; import { Box } from '@mui/material';
import { FC } from 'react'; import { FC } from 'react';
import { Typography } from '@mui/material'; import { Typography, Tooltip } from '@mui/material';
import TimeAgo from 'react-timeago'; import TimeAgo from 'react-timeago';
import { IChangeRequest } from 'component/changeRequest/changeRequest.types'; import { IChangeRequest } from 'component/changeRequest/changeRequest.types';
import { ChangeRequestStatusBadge } from 'component/changeRequest/ChangeRequestStatusBadge/ChangeRequestStatusBadge'; import { ChangeRequestStatusBadge } from 'component/changeRequest/ChangeRequestStatusBadge/ChangeRequestStatusBadge';
@ -29,7 +29,9 @@ export const ChangeRequestHeader: FC<{ changeRequest: IChangeRequest }> = ({
Created <TimeAgo date={new Date(changeRequest.createdAt)} />{' '} Created <TimeAgo date={new Date(changeRequest.createdAt)} />{' '}
by by
</Typography> </Typography>
<Tooltip title={changeRequest?.createdBy?.username}>
<StyledAvatar src={changeRequest?.createdBy?.imageUrl} /> <StyledAvatar src={changeRequest?.createdBy?.imageUrl} />
</Tooltip>
<Box> <Box>
<StyledCard variant="outlined"> <StyledCard variant="outlined">
<Typography variant="body2"> <Typography variant="body2">

View File

@ -167,7 +167,7 @@ export const ChangeRequestOverview: FC = () => {
/> />
))} ))}
<AddCommentField <AddCommentField
imageUrl={user?.imageUrl || ''} user={user}
commentText={commentText} commentText={commentText}
onTypeComment={setCommentText} onTypeComment={setCommentText}
> >

View File

@ -38,7 +38,6 @@ import { useMediaQuery } from '@mui/material';
import { Search } from 'component/common/Search/Search'; import { Search } from 'component/common/Search/Search';
import { useChangeRequestToggle } from 'hooks/useChangeRequestToggle'; import { useChangeRequestToggle } from 'hooks/useChangeRequestToggle';
import { ChangeRequestDialogue } from 'component/changeRequest/ChangeRequestConfirmDialog/ChangeRequestConfirmDialog'; import { ChangeRequestDialogue } from 'component/changeRequest/ChangeRequestConfirmDialog/ChangeRequestConfirmDialog';
import { CopyStrategyMessage } from '../../../changeRequest/ChangeRequestConfirmDialog/ChangeRequestMessages/CopyStrategyMessage';
import { UpdateEnabledMessage } from '../../../changeRequest/ChangeRequestConfirmDialog/ChangeRequestMessages/UpdateEnabledMessage'; import { UpdateEnabledMessage } from '../../../changeRequest/ChangeRequestConfirmDialog/ChangeRequestMessages/UpdateEnabledMessage';
import { useChangeRequestsEnabled } from 'hooks/useChangeRequestsEnabled'; import { useChangeRequestsEnabled } from 'hooks/useChangeRequestsEnabled';
import { IFeatureToggleListItem } from 'interfaces/featureToggle'; import { IFeatureToggleListItem } from 'interfaces/featureToggle';