overleaf/services/web/frontend/js/features/editor-left-menu/components/download-pdf.tsx
M Fahru 797b9b2532 Migrate download menu in editor left menu to react (#10046)
* Initialize left menu react migration and migration download menu UI to react

* Add test case to DownloadMenu react component

* Update test description and add an href check to one of the download link

* Extract storybook document mock to its own fixture file

* Add mockCompileOnLoad config on storybook editor scope
  - if mockCompileOnLoad: true (default), then the default compile mock will be used
  - If mockCompileOnLoad: false, then we have to provide a compile mock on the storybook component

* Create download menu storybook component

* Use a single "editor-left-menu" controller on the editor left menu migrations

* Remove the form import from the react version of the left menu

* Change inline style to utility class name

GitOrigin-RevId: 5357c7bfc78bf40f52b9b308df8f2b60d793fbf7
2022-10-25 08:04:19 +00:00

33 lines
951 B
TypeScript

import { useTranslation } from 'react-i18next'
import { useDetachCompileContext as useCompileContext } from '../../../shared/context/detach-compile-context'
import Icon from '../../../shared/components/icon'
import Tooltip from '../../../shared/components/tooltip'
export default function DownloadPDF() {
const { t } = useTranslation()
const { pdfDownloadUrl, pdfUrl } = useCompileContext()
if (pdfUrl) {
return (
<a href={pdfDownloadUrl || pdfUrl} target="_blank" rel="noreferrer">
<Icon type="file-pdf-o" modifier="2x" />
<br />
PDF
</a>
)
} else {
return (
<Tooltip
id="disabled-pdf-download"
description={t('please_compile_pdf_before_download')}
overlayProps={{ placement: 'bottom' }}
>
<div className="link-disabled">
<Icon type="file-pdf-o" modifier="2x" />
<br />
PDF
</div>
</Tooltip>
)
}
}