overleaf/services/web/frontend/js/shared/context/split-test-context.tsx
Antoine Clausse 6a6f155029 [web] Use React hooks to get split-test variants instead of getSplitTestVariant (getMeta) (#18133)
* Fix split-tests loading in React component: use `useSplitTestContext` instead of `getSplitTestVariant`

* Replace use of `isSplitTestEnabled` by `useSplitTestContext`

* Add SplitTestProvider to roots, and fix tests

* Create `useFeatureFlag` hook

* Use `useFeatureFlag` where applicable

GitOrigin-RevId: 9ff7bb3975d50bc4d07d74d93c482d56dc96f615
2024-05-01 08:04:55 +00:00

46 lines
1.1 KiB
TypeScript

import { createContext, FC, useContext, useMemo } from 'react'
import getMeta from '../../utils/meta'
type SplitTestVariants = Record<string, any>
type SplitTestInfo = Record<string, any>
export const SplitTestContext = createContext<
| {
splitTestVariants: SplitTestVariants
splitTestInfo: SplitTestInfo
}
| undefined
>(undefined)
export const SplitTestProvider: FC = ({ children }) => {
const value = useMemo(
() => ({
splitTestVariants: getMeta('ol-splitTestVariants') || {},
splitTestInfo: getMeta('ol-splitTestInfo') || {},
}),
[]
)
return (
<SplitTestContext.Provider value={value}>
{children}
</SplitTestContext.Provider>
)
}
export function useSplitTestContext() {
const context = useContext(SplitTestContext)
if (!context) {
throw new Error(
'useSplitTestContext is only available within SplitTestProvider'
)
}
return context
}
export function useFeatureFlag(name: string) {
const { splitTestVariants } = useSplitTestContext()
return splitTestVariants[name] === 'enabled'
}