Hide most toolbar buttons for non-latex documents (#13725)

GitOrigin-RevId: 3bf487d86d1a465a1653b40891277380270ea7ff
This commit is contained in:
Alf Eaton 2023-07-11 14:28:53 +01:00 committed by Copybot
parent 5236cb0ca1
commit 34fa28c90b
4 changed files with 147 additions and 124 deletions

View file

@ -20,6 +20,7 @@ import DetachCompileButtonWrapper from '../../pdf-preview/components/detach-comp
import getMeta from '../../../utils/meta' import getMeta from '../../../utils/meta'
import { isVisual } from '../extensions/visual/visual' import { isVisual } from '../extensions/visual/visual'
import SplitTestBadge from '../../../shared/components/split-test-badge' import SplitTestBadge from '../../../shared/components/split-test-badge'
import { language } from '@codemirror/language'
export const CodeMirrorToolbar = () => { export const CodeMirrorToolbar = () => {
const view = useCodeMirrorViewContext() const view = useCodeMirrorViewContext()
@ -44,6 +45,8 @@ const Toolbar = memo(function Toolbar() {
const overflowBeforeRef = useRef<HTMLDivElement>(null) const overflowBeforeRef = useRef<HTMLDivElement>(null)
const overflowedItemsRef = useRef<Set<string>>(new Set()) const overflowedItemsRef = useRef<Set<string>>(new Set())
const languageName = state.facet(language)?.name
const { const {
open: overflowOpen, open: overflowOpen,
onToggle: setOverflowOpen, onToggle: setOverflowOpen,
@ -97,7 +100,7 @@ const Toolbar = memo(function Toolbar() {
return ( return (
<div className="ol-cm-toolbar toolbar-editor" ref={resizeRef}> <div className="ol-cm-toolbar toolbar-editor" ref={resizeRef}>
{showSourceToolbar && <EditorSwitch />} {showSourceToolbar && <EditorSwitch />}
<ToolbarItems state={state} /> <ToolbarItems state={state} languageName={languageName} />
<div <div
className="ol-cm-toolbar-button-group ol-cm-toolbar-stretch" className="ol-cm-toolbar-button-group ol-cm-toolbar-stretch"
ref={overflowBeforeRef} ref={overflowBeforeRef}
@ -109,7 +112,11 @@ const Toolbar = memo(function Toolbar() {
setOverflowOpen={setOverflowOpen} setOverflowOpen={setOverflowOpen}
overflowRef={overflowRef} overflowRef={overflowRef}
> >
<ToolbarItems state={state} overflowed={overflowedItemsRef.current} /> <ToolbarItems
state={state}
overflowed={overflowedItemsRef.current}
languageName={languageName}
/>
</ToolbarOverflow> </ToolbarOverflow>
<div className="formatting-buttons-wrapper" /> <div className="formatting-buttons-wrapper" />
</div> </div>
@ -121,7 +128,7 @@ const Toolbar = memo(function Toolbar() {
active={searchPanelOpen(state)} active={searchPanelOpen(state)}
icon="search" icon="search"
/> />
{!isVisual(view) && ( {languageName === 'latex' && !isVisual(view) && (
<SplitTestBadge <SplitTestBadge
splitTestName="source-editor-toolbar" splitTestName="source-editor-toolbar"
displayOnVariants={['enabled']} displayOnVariants={['enabled']}

View file

@ -23,7 +23,8 @@ const isMac = /Mac/.test(window.navigator?.platform)
export const ToolbarItems: FC<{ export const ToolbarItems: FC<{
state: EditorState state: EditorState
overflowed?: Set<string> overflowed?: Set<string>
}> = memo(function ToolbarItems({ state, overflowed }) { languageName?: string
}> = memo(function ToolbarItems({ state, overflowed, languageName }) {
const { t } = useTranslation() const { t } = useTranslation()
const { toggleSymbolPalette, showSymbolPalette } = useEditorContext() const { toggleSymbolPalette, showSymbolPalette } = useEditorContext()
const isActive = withinFormattingCommand(state) const isActive = withinFormattingCommand(state)
@ -70,6 +71,8 @@ export const ToolbarItems: FC<{
/> />
</div> </div>
)} )}
{languageName === 'latex' && (
<>
{showGroup('group-section') && ( {showGroup('group-section') && (
<div <div
className="ol-cm-toolbar-button-group" className="ol-cm-toolbar-button-group"
@ -99,7 +102,10 @@ export const ToolbarItems: FC<{
</div> </div>
)} )}
{showGroup('group-math') && ( {showGroup('group-math') && (
<div className="ol-cm-toolbar-button-group" data-overflow="group-math"> <div
className="ol-cm-toolbar-button-group"
data-overflow="group-math"
>
<MathDropdown /> <MathDropdown />
{symbolPaletteAvailable && ( {symbolPaletteAvailable && (
<ToolbarButton <ToolbarButton
@ -115,7 +121,10 @@ export const ToolbarItems: FC<{
</div> </div>
)} )}
{showGroup('group-misc') && ( {showGroup('group-misc') && (
<div className="ol-cm-toolbar-button-group" data-overflow="group-misc"> <div
className="ol-cm-toolbar-button-group"
data-overflow="group-misc"
>
<ToolbarButton <ToolbarButton
id="toolbar-href" id="toolbar-href"
label={t('toolbar_insert_link')} label={t('toolbar_insert_link')}
@ -162,7 +171,10 @@ export const ToolbarItems: FC<{
</div> </div>
)} )}
{showGroup('group-list') && ( {showGroup('group-list') && (
<div className="ol-cm-toolbar-button-group" data-overflow="group-list"> <div
className="ol-cm-toolbar-button-group"
data-overflow="group-list"
>
<ToolbarButton <ToolbarButton
id="toolbar-bullet-list" id="toolbar-bullet-list"
label={t('toolbar_bullet_list')} label={t('toolbar_bullet_list')}
@ -194,5 +206,7 @@ export const ToolbarItems: FC<{
</div> </div>
)} )}
</> </>
)}
</>
) )
}) })

View file

@ -3,6 +3,7 @@ import { parser } from '../../lezer-bibtex/bibtex.mjs'
import { bibtexEntryCompletions } from './completions/snippets' import { bibtexEntryCompletions } from './completions/snippets'
export const BibTeXLanguage = LRLanguage.define({ export const BibTeXLanguage = LRLanguage.define({
name: 'bibtex',
parser, parser,
languageData: { languageData: {
autocomplete: bibtexEntryCompletions, autocomplete: bibtexEntryCompletions,

View file

@ -48,6 +48,7 @@ const typeMap: Record<string, string[]> = {
} }
export const LaTeXLanguage = LRLanguage.define({ export const LaTeXLanguage = LRLanguage.define({
name: 'latex',
parser: parser.configure({ parser: parser.configure({
props: [ props: [
foldNodeProp.add({ foldNodeProp.add({