import { Trans, useTranslation } from 'react-i18next' import { useDetachCompileContext } from '../../../shared/context/detach-compile-context' import StartFreeTrialButton from '../../../shared/components/start-free-trial-button' import { memo, useCallback } from 'react' import PdfLogEntry from './pdf-log-entry' import { useStopOnFirstError } from '../../../shared/hooks/use-stop-on-first-error' import { Button } from 'react-bootstrap' import * as eventTracking from '../../../infrastructure/event-tracking' import { useFeatureFlag } from '@/shared/context/split-test-context' import getMeta from '@/utils/meta' function TimeoutUpgradePromptNew() { const { startCompile, lastCompileOptions, setAnimateCompileDropdownArrow, isProjectOwner, } = useDetachCompileContext() const { enableStopOnFirstError } = useStopOnFirstError({ eventSource: 'timeout-new', }) const handleEnableStopOnFirstErrorClick = useCallback(() => { enableStopOnFirstError() startCompile({ stopOnFirstError: true }) setAnimateCompileDropdownArrow(true) }, [enableStopOnFirstError, startCompile, setAnimateCompileDropdownArrow]) return ( <> {getMeta('ol-ExposedSettings').enableSubscriptions && ( )} ) } type CompileTimeoutProps = { isProjectOwner: boolean } const CompileTimeout = memo(function CompileTimeout({ isProjectOwner, }: CompileTimeoutProps) { const { t } = useTranslation() const hasNewPaywallCta = useFeatureFlag('paywall-cta') return (

{isProjectOwner ? t('your_project_exceeded_compile_timeout_limit_on_free_plan') : t('this_project_exceeded_compile_timeout_limit_on_free_plan')}

{isProjectOwner ? (

{t('upgrade_for_12x_more_compile_time')}{' '} {t( 'plus_additional_collaborators_document_history_track_changes_and_more' )}

) : ( , ]} /> )} {isProjectOwner && (

{hasNewPaywallCta ? t('get_more_compile_time') : t('start_a_free_trial')}

)} ) } // @ts-ignore entryAriaLabel={t('your_compile_timed_out')} level="error" /> ) }) type PreventTimeoutHelpMessageProps = { lastCompileOptions: any handleEnableStopOnFirstErrorClick: () => void isProjectOwner: boolean } const PreventTimeoutHelpMessage = memo(function PreventTimeoutHelpMessage({ lastCompileOptions, handleEnableStopOnFirstErrorClick, isProjectOwner, }: PreventTimeoutHelpMessageProps) { const { t } = useTranslation() function sendInfoClickEvent() { eventTracking.sendMB('paywall-info-click', { 'paywall-type': 'compile-timeout', content: 'blog', }) } const compileTimeoutChangesBlogLink = ( /* eslint-disable-next-line jsx-a11y/anchor-has-content, react/jsx-key */ ) return (

{t('common_causes_of_compile_timeouts_include')}:

  • , ]} />
  • , ]} /> {!lastCompileOptions.stopOnFirstError && ( <> {' '} , // eslint-disable-next-line react/jsx-key , ]} />{' '} )}

, ]} />

<> {isProjectOwner ? ( ) : ( )}

} // @ts-ignore entryAriaLabel={t('reasons_for_compile_timeouts')} level="raw" /> ) }) export default memo(TimeoutUpgradePromptNew)