overleaf/services/web/frontend/js/features/pdf-preview/components/compile-timeout-warning.tsx

55 lines
1.6 KiB
TypeScript
Raw Normal View History

import Notification from '@/shared/components/notification'
import StartFreeTrialButton from '@/shared/components/start-free-trial-button'
import { useTranslation } from 'react-i18next'
import { FC } from 'react'
[web] Paywall CTA split-test (#17555) * Fix `{splitTest.requiredCohortSize && (...)}` can display `0` * Get `paywall-cta` assignment in ProjectController.js * CTA change: "Get Dropbox Sync" https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578763286026 * CTA change: "Get GitHub Sync" https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578763286736 * CTA change: "Get Git integration" https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578763286283 * CTA change: "Add more collaborators" https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578763884855 * CTA change: "Get track changes" https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578764030761 * Update wording and position: "Already subscribed? Try refreshing the page." https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578764366969 * Casing update: "Upgrade to track changes" https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578764209961 * CTA changes: "Get Mendeley integration" + "Get Zotero integration" https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578764547424 https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578764547269 * CTA change: "Get full project history" https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578764762005 * Casing update: "full project history" https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578764762280 * CTA change: "Get more compile time" in timeout-upgrade-prompt-new.tsx https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578764762563 * CTA change: "Get more compile time" in compile-timeout-warning.tsx https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578764762726 * CTA change: "Get advanced reference search" https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578764969087 * Update casing and wording: "advanced reference search" https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578764969412 * CTA change: "Get Symbol Palette" https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578765128906 * Update title: "Subscribe to find the symbols you need faster" https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578765289664 * Revert use of `satisfies`: it doesn't work with our version of prettier (https://github.com/prettier/prettier/issues/13516) * CTA change: "Get more compile time" in compile-timeout-changing-soon.tsx ⚠️ not in miro * Rename `paywallCtaAssignment`, remove useless export and comment Addressing Fahru's review * Add alternative texts in `/registration/try-premium` page * CTA change: "Get more compile time" in timeout-upgrade-prompt.jsx https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578764762563 * CTA change: "Get GitHub Sync" in import-project-from-github-modal-content.tsx Not in Miro, but related to: https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578763286736 * CTA change: "Get more compile time" in compile-time-warning.tsx Not in Miro, but related to others * Fix compile-time-warning style (spacings, overflows out of window) * `npm run format:fix` GitOrigin-RevId: 0d8d1808b5901c2761d35494c49713d26721bcfd
2024-04-02 10:06:16 -04:00
import { useSplitTestContext } from '@/shared/context/split-test-context'
export const CompileTimeoutWarning: FC<{
handleDismissWarning: () => void
showNewCompileTimeoutUI?: string
}> = ({ handleDismissWarning, showNewCompileTimeoutUI }) => {
const { t } = useTranslation()
[web] Paywall CTA split-test (#17555) * Fix `{splitTest.requiredCohortSize && (...)}` can display `0` * Get `paywall-cta` assignment in ProjectController.js * CTA change: "Get Dropbox Sync" https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578763286026 * CTA change: "Get GitHub Sync" https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578763286736 * CTA change: "Get Git integration" https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578763286283 * CTA change: "Add more collaborators" https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578763884855 * CTA change: "Get track changes" https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578764030761 * Update wording and position: "Already subscribed? Try refreshing the page." https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578764366969 * Casing update: "Upgrade to track changes" https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578764209961 * CTA changes: "Get Mendeley integration" + "Get Zotero integration" https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578764547424 https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578764547269 * CTA change: "Get full project history" https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578764762005 * Casing update: "full project history" https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578764762280 * CTA change: "Get more compile time" in timeout-upgrade-prompt-new.tsx https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578764762563 * CTA change: "Get more compile time" in compile-timeout-warning.tsx https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578764762726 * CTA change: "Get advanced reference search" https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578764969087 * Update casing and wording: "advanced reference search" https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578764969412 * CTA change: "Get Symbol Palette" https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578765128906 * Update title: "Subscribe to find the symbols you need faster" https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578765289664 * Revert use of `satisfies`: it doesn't work with our version of prettier (https://github.com/prettier/prettier/issues/13516) * CTA change: "Get more compile time" in compile-timeout-changing-soon.tsx ⚠️ not in miro * Rename `paywallCtaAssignment`, remove useless export and comment Addressing Fahru's review * Add alternative texts in `/registration/try-premium` page * CTA change: "Get more compile time" in timeout-upgrade-prompt.jsx https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578764762563 * CTA change: "Get GitHub Sync" in import-project-from-github-modal-content.tsx Not in Miro, but related to: https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578763286736 * CTA change: "Get more compile time" in compile-time-warning.tsx Not in Miro, but related to others * Fix compile-time-warning style (spacings, overflows out of window) * `npm run format:fix` GitOrigin-RevId: 0d8d1808b5901c2761d35494c49713d26721bcfd
2024-04-02 10:06:16 -04:00
const { splitTestVariants } = useSplitTestContext()
const hasNewPaywallCta = splitTestVariants['paywall-cta'] === 'enabled'
return (
<Notification
action={
<StartFreeTrialButton
variant="new-10s"
source="compile-time-warning"
buttonProps={{
className: 'btn-secondary-compile-timeout-override',
}}
>
[web] Paywall CTA split-test (#17555) * Fix `{splitTest.requiredCohortSize && (...)}` can display `0` * Get `paywall-cta` assignment in ProjectController.js * CTA change: "Get Dropbox Sync" https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578763286026 * CTA change: "Get GitHub Sync" https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578763286736 * CTA change: "Get Git integration" https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578763286283 * CTA change: "Add more collaborators" https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578763884855 * CTA change: "Get track changes" https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578764030761 * Update wording and position: "Already subscribed? Try refreshing the page." https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578764366969 * Casing update: "Upgrade to track changes" https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578764209961 * CTA changes: "Get Mendeley integration" + "Get Zotero integration" https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578764547424 https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578764547269 * CTA change: "Get full project history" https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578764762005 * Casing update: "full project history" https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578764762280 * CTA change: "Get more compile time" in timeout-upgrade-prompt-new.tsx https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578764762563 * CTA change: "Get more compile time" in compile-timeout-warning.tsx https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578764762726 * CTA change: "Get advanced reference search" https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578764969087 * Update casing and wording: "advanced reference search" https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578764969412 * CTA change: "Get Symbol Palette" https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578765128906 * Update title: "Subscribe to find the symbols you need faster" https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578765289664 * Revert use of `satisfies`: it doesn't work with our version of prettier (https://github.com/prettier/prettier/issues/13516) * CTA change: "Get more compile time" in compile-timeout-changing-soon.tsx ⚠️ not in miro * Rename `paywallCtaAssignment`, remove useless export and comment Addressing Fahru's review * Add alternative texts in `/registration/try-premium` page * CTA change: "Get more compile time" in timeout-upgrade-prompt.jsx https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578764762563 * CTA change: "Get GitHub Sync" in import-project-from-github-modal-content.tsx Not in Miro, but related to: https://miro.com/app/board/uXjVMFLu5J8=/?openComment=3458764578763286736 * CTA change: "Get more compile time" in compile-time-warning.tsx Not in Miro, but related to others * Fix compile-time-warning style (spacings, overflows out of window) * `npm run format:fix` GitOrigin-RevId: 0d8d1808b5901c2761d35494c49713d26721bcfd
2024-04-02 10:06:16 -04:00
{hasNewPaywallCta
? t('get_more_compile_time')
: t('start_free_trial_without_exclamation')}
</StartFreeTrialButton>
}
ariaLive="polite"
content={
<div>
<div>
<span>{t('your_project_near_compile_timeout_limit')}</span>
</div>
{showNewCompileTimeoutUI === 'active' ? (
<>
<strong>{t('upgrade_for_12x_more_compile_time')}</strong>
{'. '}
</>
) : (
<strong>{t('upgrade_for_plenty_more_compile_time')}</strong>
)}
</div>
}
type="warning"
title={t('took_a_while')}
isActionBelowContent
isDismissible
onDismiss={handleDismissWarning}
/>
)
}