overleaf/services/web/frontend/js/features/pdf-preview/components/pdf-logs-button.js
Alf Eaton 73bc3418a2 Add React version of the PDF preview pane (#5135)
GitOrigin-RevId: fcc88a362c3e97c9fddf85d47c3a83a0a0b89432
2021-10-01 08:03:12 +00:00

68 lines
1.5 KiB
JavaScript

import { memo, useCallback, useMemo } from 'react'
import { Button } from 'react-bootstrap'
import { usePdfPreviewContext } from '../contexts/pdf-preview-context'
import { PdfLogsButtonContent } from './pdf-logs-button-content'
import { sendMBOnce } from '../../../infrastructure/event-tracking'
function PdfLogsButton() {
const {
autoCompileLintingError,
stopOnValidationError,
error,
logEntries,
showLogs,
setShowLogs,
} = usePdfPreviewContext()
const buttonStyle = useMemo(() => {
if (showLogs) {
return 'default'
}
if (autoCompileLintingError && stopOnValidationError) {
return 'danger'
}
if (logEntries) {
if (logEntries.errors?.length) {
return 'danger'
}
if (logEntries.warnings?.length) {
return 'warning'
}
}
return 'default'
}, [autoCompileLintingError, logEntries, showLogs, stopOnValidationError])
const handleClick = useCallback(() => {
setShowLogs(value => {
if (!value) {
sendMBOnce('ide-open-logs-once')
}
return !value
})
}, [setShowLogs])
return (
<Button
bsSize="xsmall"
bsStyle={buttonStyle}
disabled={Boolean(error)}
className="btn-toggle-logs toolbar-item"
onClick={handleClick}
>
<PdfLogsButtonContent
showLogs={showLogs}
logEntries={logEntries}
autoCompileLintingError={
autoCompileLintingError && stopOnValidationError
}
/>
</Button>
)
}
export default memo(PdfLogsButton)