import { memo, useState, useEffect, useRef } from 'react' import { ButtonToolbar } from 'react-bootstrap' import { useTranslation } from 'react-i18next' import { useLayoutContext } from '../../../shared/context/layout-context' import PdfCompileButton from './pdf-compile-button' import PdfExpandButton from './pdf-expand-button' import PdfHybridLogsButton from './pdf-hybrid-logs-button' import PdfHybridDownloadButton from './pdf-hybrid-download-button' import PdfHybridSafariWarning from './pdf-hybrid-safari-warning' import PdfHybridCodeCheckButton from './pdf-hybrid-code-check-button' import PdfOrphanRefreshButton from './pdf-orphan-refresh-button' import { DetachedSynctexControl } from './detach-synctex-control' import Icon from '../../../shared/components/icon' const ORPHAN_UI_TIMEOUT_MS = 5000 function PdfPreviewHybridToolbar() { const { detachRole, detachIsLinked } = useLayoutContext() const uiTimeoutRef = useRef() const [orphanPdfTabAfterDelay, setOrphanPdfTabAfterDelay] = useState(false) const orphanPdfTab = !detachIsLinked && detachRole === 'detached' useEffect(() => { if (uiTimeoutRef.current) { clearTimeout(uiTimeoutRef.current) } if (orphanPdfTab) { uiTimeoutRef.current = setTimeout(() => { setOrphanPdfTabAfterDelay(true) }, ORPHAN_UI_TIMEOUT_MS) } else { setOrphanPdfTabAfterDelay(false) } }, [orphanPdfTab]) let ToolbarInner = null if (orphanPdfTabAfterDelay) { // when the detached tab has been orphan for a while ToolbarInner = } else if (orphanPdfTab) { ToolbarInner = } else { // tab is not detached or not orphan ToolbarInner = } return ( {ToolbarInner} ) } function PdfPreviewHybridToolbarInner() { return ( <>
{!window.showPdfDetach && }
) } function PdfPreviewHybridToolbarOrphanInner() { const { t } = useTranslation() return ( <>
{t('tab_no_longer_connected')}
) } function PdfPreviewHybridToolbarConnectingInner() { const { t } = useTranslation() return ( <>
{t('tab_connecting')}…
) } export default memo(PdfPreviewHybridToolbar)