paulononato/backstage
1
0
Fork 0
Code Issues Pull Requests Actions 13 Packages Projects Releases Wiki Activity

Adding tooltip to like dislike feedback buttons

Browse Source 
Signed-off-by: AmbrishRamachandiran <ambrish.r@infosys.com>
This commit is contained in:
AmbrishRamachandiran
2023-10-16 11:48:00 +05:30
parent 431de8acbc
commit 48c8b93e98
2 changed files with 30 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.changeset/long-flies-battle.md
+5
View File
@@ -0,0 +1,5 @@
---
'@backstage/plugin-entity-feedback': patch
---
Added tooltip to like dislike buttons
plugins/entity-feedback/src/components/LikeDislikeButtons/LikeDislikeButtons.tsx
+25 -20
View File
@@ -24,6 +24,7 @@ import {
} from '@backstage/core-plugin-api';
import { useAsyncEntity } from '@backstage/plugin-catalog-react';
import { IconButton } from '@material-ui/core';
import Tooltip from '@material-ui/core/Tooltip';
import ThumbDownIcon from '@material-ui/icons/ThumbDown';
import ThumbUpIcon from '@material-ui/icons/ThumbUp';
import ThumbDownOutlinedIcon from '@material-ui/icons/ThumbDownOutlined';
@@ -122,26 +123,30 @@ export const LikeDislikeButtons = (props: LikeDislikeButtonsProps) => {
return (
<>
<IconButton
data-testid="entity-feedback-like-button"
onClick={() => applyRating(FeedbackRatings.like)}
>
{rating === FeedbackRatings.like ? (
<ThumbUpIcon fontSize="small" />
) : (
<ThumbUpOutlinedIcon fontSize="small" />
)}
</IconButton>
<IconButton
data-testid="entity-feedback-dislike-button"
onClick={() => applyRating(FeedbackRatings.dislike)}
>
{rating === FeedbackRatings.dislike ? (
<ThumbDownIcon fontSize="small" />
) : (
<ThumbDownOutlinedIcon fontSize="small" />
)}
</IconButton>
<Tooltip title="Like">
<IconButton
data-testid="entity-feedback-like-button"
onClick={() => applyRating(FeedbackRatings.like)}
>
{rating === FeedbackRatings.like ? (
<ThumbUpIcon fontSize="small" />
) : (
<ThumbUpOutlinedIcon fontSize="small" />
)}
</IconButton>
</Tooltip>
<Tooltip title="Dislike">
<IconButton
data-testid="entity-feedback-dislike-button"
onClick={() => applyRating(FeedbackRatings.dislike)}
>
{rating === FeedbackRatings.dislike ? (
<ThumbDownIcon fontSize="small" />
) : (
<ThumbDownOutlinedIcon fontSize="small" />
)}
</IconButton>
</Tooltip>
<FeedbackResponseDialog
entity={entity!}
open={openFeedbackDialog}