Merge pull request #21687 from overleaf/dp-eq-preview-beta-badge

Update split test badge for math preview tooltip

GitOrigin-RevId: fbdc7b42d3ce51f405f75232fbfd357ee6afc2a3
This commit is contained in:
David 2024-11-07 12:38:38 +00:00 committed by Copybot
parent c6a186d436
commit bd15e3cc5c

View file

@ -12,7 +12,6 @@ import OLModal, {
OLModalTitle, OLModalTitle,
} from '@/features/ui/components/ol/ol-modal' } from '@/features/ui/components/ol/ol-modal'
import MaterialIcon from '@/shared/components/material-icon' import MaterialIcon from '@/shared/components/material-icon'
import SplitTestBadge from '@/shared/components/split-test-badge'
import useEventListener from '@/shared/hooks/use-event-listener' import useEventListener from '@/shared/hooks/use-event-listener'
import { FC, useCallback, useEffect, useRef, useState } from 'react' import { FC, useCallback, useEffect, useRef, useState } from 'react'
import { Trans, useTranslation } from 'react-i18next' import { Trans, useTranslation } from 'react-i18next'
@ -30,6 +29,7 @@ import {
Dropdown as BS3Dropdown, Dropdown as BS3Dropdown,
MenuItem as BS3MenuItem, MenuItem as BS3MenuItem,
} from 'react-bootstrap' } from 'react-bootstrap'
import { useSplitTestContext } from '@/shared/context/split-test-context'
const MathPreviewTooltipContainer: FC = () => { const MathPreviewTooltipContainer: FC = () => {
const state = useCodeMirrorStateContext() const state = useCodeMirrorStateContext()
@ -96,10 +96,8 @@ const MathPreviewTooltip: FC<{ mathContent: HTMLDivElement }> = ({
<> <>
<div className="ol-cm-math-tooltip"> <div className="ol-cm-math-tooltip">
<span ref={mathRef} /> <span ref={mathRef} />
<SplitTestBadge <CustomSplitTestBadge />
displayOnVariants={['enabled']}
splitTestName="math-preview"
/>
<BootstrapVersionSwitcher <BootstrapVersionSwitcher
bs5={ bs5={
<Dropdown align="end"> <Dropdown align="end">
@ -217,4 +215,28 @@ const MathPreviewTooltip: FC<{ mathContent: HTMLDivElement }> = ({
) )
} }
// Temporary SplitTest badge for just this component that always shows
// as in beta and doesn't have a tooltip
const CustomSplitTestBadge: FC = () => {
const { splitTestVariants } = useSplitTestContext()
const variant = splitTestVariants['math-preview']
if (!variant || variant !== 'enabled') {
return null
}
return (
<a
href="https://forms.gle/uDVGSqnBBJQ8fUPt5"
target="_blank"
rel="noopener noreferrer"
>
<BootstrapVersionSwitcher
bs3={<span className="badge beta-badge" />}
bs5={<MaterialIcon type="info" className="align-middle beta-badge" />}
/>
</a>
)
}
export default MathPreviewTooltipContainer export default MathPreviewTooltipContainer