overleaf/services/web/frontend/js/features/pdf-preview/components/switch-to-editor-button.tsx
ilkin-overleaf 35728d7681 Merge pull request #20436 from overleaf/ii-bs5-editor-toolbar
[web] BS5 editor toolbar

GitOrigin-RevId: a517fd52d648d165e89231d6f5551c026a951c43
2024-10-01 08:04:42 +00:00

44 lines
1.1 KiB
TypeScript

import { useTranslation } from 'react-i18next'
import Icon from '../../../shared/components/icon'
import MaterialIcon from '@/shared/components/material-icon'
import OLButton from '@/features/ui/components/ol/ol-button'
import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
import { useLayoutContext } from '../../../shared/context/layout-context'
function SwitchToEditorButton() {
const { pdfLayout, setView, detachRole } = useLayoutContext()
const { t } = useTranslation()
if (detachRole) {
return null
}
if (pdfLayout === 'sideBySide') {
return null
}
function handleClick() {
setView('editor')
}
return (
<OLButton
variant="secondary"
size="small"
onClick={handleClick}
bs3Props={{
bsSize: 'xsmall',
className: 'switch-to-editor-btn toolbar-btn-secondary',
}}
>
<BootstrapVersionSwitcher
bs3={<Icon type="code" className="toolbar-btn-secondary-icon" />}
bs5={<MaterialIcon type="code" />}
/>
{t('switch_to_editor')}
</OLButton>
)
}
export default SwitchToEditorButton