overleaf/services/web/frontend/js/features/pdf-preview/components/pdf-download-button.js
Alf Eaton f7ef2532e0 Handle PDF preview on toggle between split and full-width views (#5470)
* Only hide the compile logs pane when toggled off
* Handle PDF preview on toggle between split and full-width views

GitOrigin-RevId: 9ceca8a06a22abfa78f245e1ae5d24af98215906
2021-10-18 08:03:26 +00:00

50 lines
1.4 KiB
JavaScript

import { useTranslation } from 'react-i18next'
import { Button, Dropdown } from 'react-bootstrap'
import Icon from '../../../shared/components/icon'
import ControlledDropdown from '../../../shared/components/controlled-dropdown'
import PdfFileList from './pdf-file-list'
import { memo } from 'react'
import { useCompileContext } from '../../../shared/context/compile-context'
function PdfDownloadButton() {
const { compiling, pdfDownloadUrl, fileList } = useCompileContext()
const { t } = useTranslation()
const disabled = compiling || !pdfDownloadUrl
return (
<ControlledDropdown
id="pdf-download-dropdown"
className="toolbar-item"
disabled={disabled}
>
<Button
bsSize="xsmall"
bsStyle="info"
disabled={compiling || !pdfDownloadUrl}
download
href={pdfDownloadUrl || '#'}
>
<Icon type="download" modifier="fw" />
<span className="toolbar-text toolbar-hide-medium toolbar-hide-small">
{t('download_pdf')}
</span>
</Button>
<Dropdown.Toggle
bsSize="xsmall"
bsStyle="info"
className="dropdown-toggle"
aria-label={t('toggle_output_files_list')}
disabled={!fileList}
/>
<Dropdown.Menu id="download-dropdown-list">
<PdfFileList fileList={fileList} />
</Dropdown.Menu>
</ControlledDropdown>
)
}
export default memo(PdfDownloadButton)