1
0
mirror of https://github.com/Unleash/unleash.git synced 2025-05-31 01:16:01 +02:00
unleash.unleash/frontend/src/component/common/TooltipResolver/TooltipResolver.tsx
Nuno Góis 4518ed6642
Fix plan upgrade tooltip (#2549)
Related: https://github.com/Unleash/unleash/pull/2544
From:
https://linear.app/unleash/issue/1-414/add-a-badge-for-oss-users-on-the-projects-page-to-see-that-extra

Includes some fixes and suggestions:
 - Should only show when OSS (icon was showing every time);
 - Link now works correctly, opens on new tab;
- Improves styling to be more aligned with original design:
https://www.figma.com/file/qdwpPfuitJUNinm6mvmCmG/Unleash-application?node-id=6961%3A38443&t=zsXNAnOurapoLm9j-0;
 - Fixes text to be like in the design;
- Improves `HtmlTooltip` look and behaviour: white arrow, custom width,
etc;
 - Some refactoring and cleanup;
 
Let me know if I should change anything 👍
2022-11-29 10:06:29 +02:00

36 lines
859 B
TypeScript

import { ReactNode } from 'react';
import { Tooltip, TooltipProps } from '@mui/material';
import { HtmlTooltip } from '../HtmlTooltip/HtmlTooltip';
export interface ITooltipResolverProps extends Omit<TooltipProps, 'title'> {
title?: string;
titleComponent?: ReactNode;
variant?: 'default' | 'custom';
}
export const TooltipResolver = ({
title,
children,
variant = 'default',
titleComponent,
...rest
}: ITooltipResolverProps) => {
if (!title && !titleComponent) {
return children;
}
if (variant === 'custom') {
return (
<HtmlTooltip {...rest} title={title || titleComponent} arrow>
{children}
</HtmlTooltip>
);
}
return (
<Tooltip {...rest} title={title || titleComponent} arrow>
{children}
</Tooltip>
);
};