overleaf/services/web/frontend/js/shared/components/beta-badge.tsx
Alexandre Bourdin e9e36737e6 Merge pull request #8957 from overleaf/ab-split-test-controls-badge
[web] SplitTestBadge based on split test phase and badge config

GitOrigin-RevId: e178ca864fd6619ff61a2a84fc1ccb5d54e0a814
2022-07-26 08:04:28 +00:00

57 lines
1.1 KiB
TypeScript

import Tooltip from './tooltip'
import { OverlayTriggerProps } from 'react-bootstrap'
type TooltipProps = {
id: string
text: React.ReactNode
placement?: OverlayTriggerProps['placement']
className?: string
}
type BetaBadgeProps = {
tooltip: TooltipProps
url?: string
phase?: string
}
function BetaBadge({
tooltip,
url = '/beta/participate',
phase = 'beta',
}: BetaBadgeProps) {
let badgeClass
switch (phase) {
case 'release':
badgeClass = 'info-badge'
break
case 'alpha':
badgeClass = 'alpha-badge'
break
case 'beta':
default:
badgeClass = 'beta-badge'
}
return (
<Tooltip
id={tooltip.id}
description={tooltip.text}
tooltipProps={{ className: tooltip.className }}
overlayProps={{
placement: tooltip.placement || 'bottom',
delayHide: 100,
}}
>
<a
href={url}
target="_blank"
rel="noopener noreferrer"
className={`badge ${badgeClass}`}
>
<span className="sr-only">{tooltip.text}</span>
</a>
</Tooltip>
)
}
export default BetaBadge