diff --git a/services/web/frontend/js/features/history/components/change-list/owner-paywall-prompt.tsx b/services/web/frontend/js/features/history/components/change-list/owner-paywall-prompt.tsx index 3248d98eb8..27304d9e04 100644 --- a/services/web/frontend/js/features/history/components/change-list/owner-paywall-prompt.tsx +++ b/services/web/frontend/js/features/history/components/change-list/owner-paywall-prompt.tsx @@ -4,7 +4,7 @@ import { useCallback, useEffect, useState } from 'react' import * as eventTracking from '../../../../infrastructure/event-tracking' import StartFreeTrialButton from '../../../../shared/components/start-free-trial-button' import { paywallPrompt } from '../../../../main/account-upgrade' -import { useSplitTestContext } from '@/shared/context/split-test-context' +import { useFeatureFlag } from '@/shared/context/split-test-context' function FeatureItem({ text }: { text: string }) { return ( @@ -18,8 +18,7 @@ export function OwnerPaywallPrompt() { const { t } = useTranslation() const [clickedFreeTrialButton, setClickedFreeTrialButton] = useState(false) - const { splitTestVariants } = useSplitTestContext() - const hasNewPaywallCta = splitTestVariants['paywall-cta'] === 'enabled' + const hasNewPaywallCta = useFeatureFlag('paywall-cta') useEffect(() => { eventTracking.send('subscription-funnel', 'editor-click-feature', 'history') diff --git a/services/web/frontend/js/features/history/components/diff-view/toolbar/toolbar.tsx b/services/web/frontend/js/features/history/components/diff-view/toolbar/toolbar.tsx index b5b1bca00f..261608b863 100644 --- a/services/web/frontend/js/features/history/components/diff-view/toolbar/toolbar.tsx +++ b/services/web/frontend/js/features/history/components/diff-view/toolbar/toolbar.tsx @@ -6,7 +6,7 @@ import ToolbarFileInfo from './toolbar-file-info' import ToolbarRestoreFileButton from './toolbar-restore-file-button' import { isFileRemoved } from '../../../utils/file-diff' import ToolbarRevertFileButton from './toolbar-revert-file-button' -import { useSplitTestContext } from '@/shared/context/split-test-context' +import { useFeatureFlag } from '@/shared/context/split-test-context' type ToolbarProps = { diff: Nullable @@ -14,13 +14,13 @@ type ToolbarProps = { } export default function Toolbar({ diff, selection }: ToolbarProps) { - const { splitTestVariants } = useSplitTestContext() + const hasRevertFiles = useFeatureFlag('revert-files') const showRestoreFileButton = selection.selectedFile && isFileRemoved(selection.selectedFile) const showRevertFileButton = - splitTestVariants['revert-file'] === 'enabled' && + hasRevertFiles && selection.selectedFile && !isFileRemoved(selection.selectedFile) diff --git a/services/web/frontend/js/features/pdf-preview/components/compile-time-warning-upgrade-prompt-inner.tsx b/services/web/frontend/js/features/pdf-preview/components/compile-time-warning-upgrade-prompt-inner.tsx index 0e957c9b6e..1cf62883d0 100644 --- a/services/web/frontend/js/features/pdf-preview/components/compile-time-warning-upgrade-prompt-inner.tsx +++ b/services/web/frontend/js/features/pdf-preview/components/compile-time-warning-upgrade-prompt-inner.tsx @@ -2,15 +2,14 @@ import Notification from '@/shared/components/notification' import StartFreeTrialButton from '@/shared/components/start-free-trial-button' import { useTranslation } from 'react-i18next' import { FC } from 'react' -import { useSplitTestContext } from '@/shared/context/split-test-context' +import { useFeatureFlag } from '@/shared/context/split-test-context' export const CompileTimeWarningUpgradePromptInner: FC<{ handleDismissWarning: () => void }> = ({ handleDismissWarning }) => { const { t } = useTranslation() - const { splitTestVariants } = useSplitTestContext() - const hasNewPaywallCta = splitTestVariants['paywall-cta'] === 'enabled' + const hasNewPaywallCta = useFeatureFlag('paywall-cta') return ( } = - useSplitTestContext() + const hasWritefullOauthPromotion = useFeatureFlag('writefull-oauth-promotion') // even if they arent in the split test, if they have it enabled let them toggle it off const user = getMeta('ol-user') const shouldLoadWritefull = - (splitTestVariants['writefull-oauth-promotion'] === 'enabled' || - user.writefull?.enabled === true) && + (hasWritefullOauthPromotion || user.writefull?.enabled === true) && !window.writefull // check if the writefull extension is installed, in which case we dont handle the integration const haslangFeedbackLinkingWidgets = diff --git a/services/web/frontend/js/features/share-project-modal/components/add-collaborators-upgrade.tsx b/services/web/frontend/js/features/share-project-modal/components/add-collaborators-upgrade.tsx index b6f9528212..c4bf09d98f 100644 --- a/services/web/frontend/js/features/share-project-modal/components/add-collaborators-upgrade.tsx +++ b/services/web/frontend/js/features/share-project-modal/components/add-collaborators-upgrade.tsx @@ -5,16 +5,14 @@ import { useUserContext } from '../../../shared/context/user-context' import { upgradePlan } from '../../../main/account-upgrade' import StartFreeTrialButton from '../../../shared/components/start-free-trial-button' import Icon from '../../../shared/components/icon' -import { useSplitTestContext } from '../../../shared/context/split-test-context' +import { useFeatureFlag } from '../../../shared/context/split-test-context' export default function AddCollaboratorsUpgrade() { const { t } = useTranslation() const user = useUserContext() const [startedFreeTrial, setStartedFreeTrial] = useState(false) - const { splitTestVariants } = useSplitTestContext() - - const hasNewPaywallCta = splitTestVariants['paywall-cta'] === 'enabled' + const hasNewPaywallCta = useFeatureFlag('paywall-cta') return (
diff --git a/services/web/frontend/js/features/source-editor/components/review-panel/upgrade-track-changes-modal.tsx b/services/web/frontend/js/features/source-editor/components/review-panel/upgrade-track-changes-modal.tsx index 68768f9121..eda891f009 100644 --- a/services/web/frontend/js/features/source-editor/components/review-panel/upgrade-track-changes-modal.tsx +++ b/services/web/frontend/js/features/source-editor/components/review-panel/upgrade-track-changes-modal.tsx @@ -6,7 +6,7 @@ import { useProjectContext } from '../../../../shared/context/project-context' import { useUserContext } from '../../../../shared/context/user-context' import { startFreeTrial, upgradePlan } from '../../../../main/account-upgrade' import { memo } from 'react' -import { useSplitTestContext } from '@/shared/context/split-test-context' +import { useFeatureFlag } from '@/shared/context/split-test-context' type UpgradeTrackChangesModalProps = { show: boolean @@ -21,8 +21,7 @@ function UpgradeTrackChangesModal({ const project = useProjectContext() const user = useUserContext() - const { splitTestVariants } = useSplitTestContext() - const hasNewPaywallCta = splitTestVariants['paywall-cta'] === 'enabled' + const hasNewPaywallCta = useFeatureFlag('paywall-cta') return ( setShow(false)}> diff --git a/services/web/frontend/js/features/source-editor/components/table-generator/promotion/popover.tsx b/services/web/frontend/js/features/source-editor/components/table-generator/promotion/popover.tsx index ff46ff5b9e..3b89530a8d 100644 --- a/services/web/frontend/js/features/source-editor/components/table-generator/promotion/popover.tsx +++ b/services/web/frontend/js/features/source-editor/components/table-generator/promotion/popover.tsx @@ -14,7 +14,7 @@ import { Button, Overlay, Popover } from 'react-bootstrap' import Close from '../../../../../shared/components/close' import { postJSON } from '../../../../../infrastructure/fetch-json' import { sendMB } from '../../../../../infrastructure/event-tracking' -import { useSplitTestContext } from '../../../../../shared/context/split-test-context' +import { useFeatureFlag } from '../../../../../shared/context/split-test-context' import { User } from '../../../../../../../types/user' import { useUserContext } from '../../../../../shared/context/user-context' import grammarlyExtensionPresent from '../../../../../shared/utils/grammarly' @@ -30,10 +30,8 @@ export const PromotionOverlay: FC = ({ children }) => { const { inactiveTutorials, currentPopup, setCurrentPopup } = useEditorContext() - const { - splitTestVariants, - }: { splitTestVariants: Record } = - useSplitTestContext() + + const hasTableGeneratorPromotion = useFeatureFlag('table-generator-promotion') const user = useUserContext() as User | undefined @@ -50,7 +48,7 @@ export const PromotionOverlay: FC = ({ children }) => { currentPopup && currentPopup !== 'table-generator-promotion' const showPromotion = - splitTestVariants['table-generator-promotion'] === 'enabled' && + hasTableGeneratorPromotion && !popupPresent && !inactiveTutorials.includes('table-generator-promotion') && !hideBecauseNewUser diff --git a/services/web/frontend/js/features/subscription/components/dashboard/root.tsx b/services/web/frontend/js/features/subscription/components/dashboard/root.tsx index e4553066cc..0a1608405a 100644 --- a/services/web/frontend/js/features/subscription/components/dashboard/root.tsx +++ b/services/web/frontend/js/features/subscription/components/dashboard/root.tsx @@ -1,6 +1,7 @@ import { SubscriptionDashboardProvider } from '../../context/subscription-dashboard-context' import useWaitForI18n from '../../../../shared/hooks/use-wait-for-i18n' import SubscriptionDashboard from './subscription-dashboard' +import { SplitTestProvider } from '@/shared/context/split-test-context' function Root() { const { isReady } = useWaitForI18n() @@ -10,9 +11,11 @@ function Root() { } return ( - - - + + + + + ) } diff --git a/services/web/frontend/js/features/subscription/components/successful-subscription/root.tsx b/services/web/frontend/js/features/subscription/components/successful-subscription/root.tsx index 3fa8fbb0f3..f7ef400ded 100644 --- a/services/web/frontend/js/features/subscription/components/successful-subscription/root.tsx +++ b/services/web/frontend/js/features/subscription/components/successful-subscription/root.tsx @@ -1,6 +1,7 @@ import useWaitForI18n from '../../../../shared/hooks/use-wait-for-i18n' import { SubscriptionDashboardProvider } from '../../context/subscription-dashboard-context' import SuccessfulSubscription from './successful-subscription' +import { SplitTestProvider } from '@/shared/context/split-test-context' function Root() { const { isReady } = useWaitForI18n() @@ -10,9 +11,11 @@ function Root() { } return ( - - - + + + + + ) } diff --git a/services/web/frontend/js/features/subscription/context/subscription-dashboard-context.tsx b/services/web/frontend/js/features/subscription/context/subscription-dashboard-context.tsx index b8d905df86..000a7f3de1 100644 --- a/services/web/frontend/js/features/subscription/context/subscription-dashboard-context.tsx +++ b/services/web/frontend/js/features/subscription/context/subscription-dashboard-context.tsx @@ -30,7 +30,7 @@ import { import { isRecurlyLoaded } from '../util/is-recurly-loaded' import { SubscriptionDashModalIds } from '../../../../../types/subscription/dashboard/modal-ids' import { debugConsole } from '@/utils/debugging' -import { getSplitTestVariant } from '@/utils/splitTestUtils' +import { useFeatureFlag } from '@/shared/context/split-test-context' import { formatCurrencyLocalized } from '@/shared/utils/currency' type SubscriptionDashboardContextValue = { @@ -80,11 +80,6 @@ export const SubscriptionDashboardContext = createContext< SubscriptionDashboardContextValue | undefined >(undefined) -const getFormatCurrencies = () => - getSplitTestVariant('local-ccy-format-v2') === 'enabled' - ? formatCurrencyLocalized - : formatCurrencyDefault - export function SubscriptionDashboardProvider({ children, }: { @@ -150,6 +145,10 @@ export function SubscriptionDashboardProvider({ memberGroupSubscriptions?.length > 0 ) + const formatCurrency = useFeatureFlag('local-ccy-format-v2') + ? formatCurrencyLocalized + : formatCurrencyDefault + useEffect(() => { if (!isRecurlyLoaded()) { setRecurlyLoadError(true) @@ -164,7 +163,6 @@ export function SubscriptionDashboardProvider({ plansWithoutDisplayPrice && personalSubscription?.recurly ) { - const formatCurrency = getFormatCurrencies() const { currency, taxRate } = personalSubscription.recurly const fetchPlansDisplayPrices = async () => { for (const plan of plansWithoutDisplayPrice) { @@ -192,7 +190,12 @@ export function SubscriptionDashboardProvider({ } fetchPlansDisplayPrices().catch(debugConsole.error) } - }, [personalSubscription, plansWithoutDisplayPrice, i18n.language]) + }, [ + personalSubscription, + plansWithoutDisplayPrice, + i18n.language, + formatCurrency, + ]) useEffect(() => { if ( @@ -209,7 +212,6 @@ export function SubscriptionDashboardProvider({ setGroupPlanToChangeToPriceError(false) let priceData try { - const formatCurrency = getFormatCurrencies() priceData = await loadGroupDisplayPriceWithTaxPromise( groupPlanToChangeToCode, currency, @@ -233,6 +235,7 @@ export function SubscriptionDashboardProvider({ groupPlanToChangeToSize, personalSubscription, groupPlanToChangeToCode, + formatCurrency, i18n.language, ]) diff --git a/services/web/frontend/js/shared/context/local-compile-context.tsx b/services/web/frontend/js/shared/context/local-compile-context.tsx index 5364be93f4..b84a15d11a 100644 --- a/services/web/frontend/js/shared/context/local-compile-context.tsx +++ b/services/web/frontend/js/shared/context/local-compile-context.tsx @@ -34,7 +34,7 @@ import { useUserContext } from './user-context' import { useFileTreeData } from '@/shared/context/file-tree-data-context' import { useFileTreePathContext } from '@/features/file-tree/contexts/file-tree-path' import { useUserSettingsContext } from '@/shared/context/user-settings-context' -import { useSplitTestContext } from '@/shared/context/split-test-context' +import { useFeatureFlag } from '@/shared/context/split-test-context' type PdfFile = Record @@ -342,7 +342,7 @@ export const LocalCompileProvider: FC = ({ children }) => { } }, [compiling, isProjectOwner, hasShortCompileTimeout]) - const { splitTestVariants } = useSplitTestContext() + const hasCompileLogsEvents = useFeatureFlag('compile-log-events') // handle the data returned from a compile request // note: this should _only_ run when `data` changes, @@ -401,7 +401,7 @@ export const LocalCompileProvider: FC = ({ children }) => { ) } - if (splitTestVariants['compile-log-events'] === 'enabled') { + if (hasCompileLogsEvents) { sendMB('compile-log-entries', { status: data.status, stopOnFirstError: data.options.stopOnFirstError, @@ -479,6 +479,7 @@ export const LocalCompileProvider: FC = ({ children }) => { }, [ data, ide, + hasCompileLogsEvents, hasPremiumCompile, isProjectOwner, projectId, @@ -487,7 +488,6 @@ export const LocalCompileProvider: FC = ({ children }) => { setLogEntries, setLogEntryAnnotations, setPdfFile, - splitTestVariants, ]) // switch to logs if there's an error diff --git a/services/web/frontend/js/shared/context/split-test-context.tsx b/services/web/frontend/js/shared/context/split-test-context.tsx index 3cd5d5a98b..8d78534d68 100644 --- a/services/web/frontend/js/shared/context/split-test-context.tsx +++ b/services/web/frontend/js/shared/context/split-test-context.tsx @@ -39,3 +39,8 @@ export function useSplitTestContext() { return context } + +export function useFeatureFlag(name: string) { + const { splitTestVariants } = useSplitTestContext() + return splitTestVariants[name] === 'enabled' +} diff --git a/services/web/test/frontend/features/subscription/components/dashboard/group-subscription-memberships.test.tsx b/services/web/test/frontend/features/subscription/components/dashboard/group-subscription-memberships.test.tsx index e13045bd3a..2dc18ebbc5 100644 --- a/services/web/test/frontend/features/subscription/components/dashboard/group-subscription-memberships.test.tsx +++ b/services/web/test/frontend/features/subscription/components/dashboard/group-subscription-memberships.test.tsx @@ -17,6 +17,7 @@ import { } from '../../fixtures/subscriptions' import * as useLocationModule from '../../../../../../frontend/js/shared/hooks/use-location' import { UserId } from '../../../../../../types/user' +import { SplitTestProvider } from '@/shared/context/split-test-context' const userId = 'fff999fff999' const memberGroupSubscriptions: MemberGroupSubscription[] = [ @@ -58,9 +59,11 @@ describe('', function () { it('renders all group subscriptions not managed', function () { render( - - - + + + + + ) const elements = screen.getAllByText('You are on our', { @@ -83,9 +86,11 @@ describe('', function () { }) render( - - - + + + + + ) const leaveGroupButton = screen.getByText('Leave group') @@ -130,9 +135,11 @@ describe('', function () { window.metaAttributesCache.set('ol-memberGroupSubscriptions', undefined) render( - - - + + + + + ) const elements = screen.queryAllByText('You are on our', { exact: false, diff --git a/services/web/test/frontend/features/subscription/components/dashboard/managed-institutions.test.tsx b/services/web/test/frontend/features/subscription/components/dashboard/managed-institutions.test.tsx index bffb5e1455..1dbd604497 100644 --- a/services/web/test/frontend/features/subscription/components/dashboard/managed-institutions.test.tsx +++ b/services/web/test/frontend/features/subscription/components/dashboard/managed-institutions.test.tsx @@ -5,6 +5,7 @@ import ManagedInstitutions, { } from '../../../../../../frontend/js/features/subscription/components/dashboard/managed-institutions' import { SubscriptionDashboardProvider } from '../../../../../../frontend/js/features/subscription/context/subscription-dashboard-context' import fetchMock from 'fetch-mock' +import { SplitTestProvider } from '@/shared/context/split-test-context' const userId = 'fff999fff999' const institution1 = { @@ -45,9 +46,11 @@ describe('', function () { it('renders all managed institutions', function () { render( - - - + + + + + ) const elements = screen.getAllByText('You are a', { @@ -90,9 +93,11 @@ describe('', function () { }) render( - - - + + + + + ) const unsubscribeLink = screen.getByText('Unsubscribe') @@ -114,9 +119,11 @@ describe('', function () { }) render( - - - + + + + + ) const subscribeLink = screen.getByText('Subscribe') @@ -132,9 +139,11 @@ describe('', function () { window.metaAttributesCache.set('ol-managedInstitutions', undefined) render( - - - + + + + + ) const elements = screen.queryAllByText('You are a', { exact: false, diff --git a/services/web/test/frontend/features/subscription/components/dashboard/managed-publishers.test.tsx b/services/web/test/frontend/features/subscription/components/dashboard/managed-publishers.test.tsx index 14bc0308a0..bc665440ba 100644 --- a/services/web/test/frontend/features/subscription/components/dashboard/managed-publishers.test.tsx +++ b/services/web/test/frontend/features/subscription/components/dashboard/managed-publishers.test.tsx @@ -5,6 +5,7 @@ import fetchMock from 'fetch-mock' import ManagedPublishers, { Publisher, } from '../../../../../../frontend/js/features/subscription/components/dashboard/managed-publishers' +import { SplitTestProvider } from '@/shared/context/split-test-context' const userId = 'fff999fff999' const publisher1 = { @@ -36,9 +37,11 @@ describe('', function () { it('renders all managed publishers', function () { render( - - - + + + + + ) const elements = screen.getAllByText('You are a', { @@ -63,9 +66,11 @@ describe('', function () { window.metaAttributesCache.set('ol-managedPublishers', undefined) render( - - - + + + + + ) const elements = screen.queryAllByText('You are a', { exact: false, diff --git a/services/web/test/frontend/features/subscription/helpers/render-with-subscription-dash-context.tsx b/services/web/test/frontend/features/subscription/helpers/render-with-subscription-dash-context.tsx index 593d095577..c3babdf3eb 100644 --- a/services/web/test/frontend/features/subscription/helpers/render-with-subscription-dash-context.tsx +++ b/services/web/test/frontend/features/subscription/helpers/render-with-subscription-dash-context.tsx @@ -3,6 +3,7 @@ import _ from 'lodash' import { SubscriptionDashboardProvider } from '../../../../../frontend/js/features/subscription/context/subscription-dashboard-context' import { groupPriceByUsageTypeAndSize, plans } from '../fixtures/plans' import fetchMock from 'fetch-mock' +import { SplitTestProvider } from '@/shared/context/split-test-context' export function renderWithSubscriptionDashContext( component: React.ReactElement, @@ -21,7 +22,9 @@ export function renderWithSubscriptionDashContext( }: { children: React.ReactNode }) => ( - {children} + + {children} + ) window.metaAttributesCache = new Map()