overleaf/services/web/frontend/js/features/pdf-preview/components/compile-timeout-warning.tsx
Alf Eaton 0cde5be165 Merge pull request #14709 from overleaf/ae-context-typescript
Convert React context providers to TypeScript [don't squash!]

GitOrigin-RevId: d92a91798286978410956ab791d73c17c5086d86
2024-01-29 09:03:04 +00:00

48 lines
1.3 KiB
TypeScript

import Notification from '@/shared/components/notification'
import StartFreeTrialButton from '@/shared/components/start-free-trial-button'
import { useTranslation } from 'react-i18next'
import { FC } from 'react'
export const CompileTimeoutWarning: FC<{
handleDismissWarning: () => void
showNewCompileTimeoutUI?: string
}> = ({ handleDismissWarning, showNewCompileTimeoutUI }) => {
const { t } = useTranslation()
return (
<Notification
action={
<StartFreeTrialButton
variant="new-10s"
source="compile-time-warning"
buttonProps={{
className: 'btn-secondary-compile-timeout-override',
}}
>
{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}
/>
)
}