diff --git a/public/app/features/stars/StarToolbarButton.tsx b/public/app/features/stars/StarToolbarButton.tsx
index fe29cd9da0c..7a4b61afa0a 100644
--- a/public/app/features/stars/StarToolbarButton.tsx
+++ b/public/app/features/stars/StarToolbarButton.tsx
@@ -7,12 +7,10 @@ import { Icon, ToolbarButton } from '@grafana/ui';
import { useStarItem, useStarredItems } from './hooks';
const getStarTooltips = (title: string) => ({
- star: t('stars.mark-as-starred', 'Mark "{{title}}" as favorite', {
- title,
- }),
- unstar: t('stars.unmark-as-starred', 'Unmark "{{title}}" as favorite', {
- title,
- }),
+ star: t('stars.mark-as-starred', 'Mark as favorite'),
+ starWithTitle: t('stars.mark-as-starred-with-title', 'Mark "{{title}}" as favorite', { title }),
+ unstar: t('stars.unmark-as-starred', 'Unmark as favorite'),
+ unstarWithTitle: t('stars.unmark-as-starred-with-title', 'Unmark "{{title}}" as favorite', { title }),
});
type Props = {
@@ -51,18 +49,21 @@ export function StarToolbarButton({ title, group, kind, id, onStarChange }: Prop
return { name: 'star', type: 'default' } as const;
})();
- const tooltip = (() => {
+ const tooltipAndLabel = (() => {
if (isLoading) {
- return undefined;
+ return {};
}
- return isStarred ? tooltips.unstar : tooltips.star;
+ return isStarred
+ ? { tooltip: tooltips.unstar, label: tooltips.unstarWithTitle }
+ : { tooltip: tooltips.star, label: tooltips.starWithTitle };
})();
const icon = ;
return (