overleaf/services/web/frontend/js/features/pdf-preview/components/pdf-expand-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

32 lines
942 B
JavaScript

import { Button, OverlayTrigger, Tooltip } from 'react-bootstrap'
import { useTranslation } from 'react-i18next'
import Icon from '../../../shared/components/icon'
import { memo, useMemo } from 'react'
import { useLayoutContext } from '../../../shared/context/layout-context'
function PdfExpandButton() {
const { pdfLayout, switchLayout } = useLayoutContext()
const { t } = useTranslation()
const text = useMemo(() => {
return pdfLayout === 'sideBySide' ? t('full_screen') : t('split_screen')
}, [pdfLayout, t])
return (
<OverlayTrigger
placement="left"
overlay={<Tooltip id="expand-pdf-btn">{text}</Tooltip>}
>
<Button
onClick={switchLayout}
className="toolbar-pdf-expand-btn toolbar-item"
aria-label={text}
>
<Icon type={pdfLayout === 'sideBySide' ? 'expand' : 'compress'} />
</Button>
</OverlayTrigger>
)
}
export default memo(PdfExpandButton)