diff --git a/services/web/frontend/js/features/source-editor/extensions/changes/change-manager.ts b/services/web/frontend/js/features/source-editor/extensions/changes/change-manager.ts index ea39cf2a82..b26a818e9d 100644 --- a/services/web/frontend/js/features/source-editor/extensions/changes/change-manager.ts +++ b/services/web/frontend/js/features/source-editor/extensions/changes/change-manager.ts @@ -6,7 +6,12 @@ import { updateChangesTopPadding, updateSetsVerticalOverflow, } from '../vertical-overflow' -import { EditorSelection, EditorState } from '@codemirror/state' +import { + EditorSelection, + EditorState, + StateEffect, + TransactionSpec, +} from '@codemirror/state' import { EditorView, ViewUpdate } from '@codemirror/view' import { fullHeightCoordsAtPos } from '../../utils/layer' import { debounce } from 'lodash' @@ -14,6 +19,7 @@ import { Change, EditOperation } from '../../../../../../types/change' import { ThreadId } from '../../../../../../types/review-panel/review-panel' import { isDeleteOperation, isInsertOperation } from '@/utils/operations' import { DocumentContainer } from '@/features/ide-react/editor/document-container' +import { updateHasEffect } from '@/features/source-editor/utils/effects' // With less than this number of entries, don't bother culling to avoid // little UI jumps when scrolling. @@ -597,3 +603,13 @@ export const createChangeManager = ( }, } } + +const reviewPanelToggledEffect = StateEffect.define() + +export const updateHasReviewPanelToggledEffect = updateHasEffect( + reviewPanelToggledEffect +) + +export const reviewPanelToggled = (): TransactionSpec => ({ + effects: reviewPanelToggledEffect.of(null), +}) diff --git a/services/web/frontend/js/features/source-editor/extensions/draw-selection.ts b/services/web/frontend/js/features/source-editor/extensions/draw-selection.ts index 01278316ce..0c7df441e7 100644 --- a/services/web/frontend/js/features/source-editor/extensions/draw-selection.ts +++ b/services/web/frontend/js/features/source-editor/extensions/draw-selection.ts @@ -3,6 +3,7 @@ import { EditorView, layer } from '@codemirror/view' import { rectangleMarkerForRange } from '../utils/layer' import { updateHasMouseDownEffect } from './visual/selection' import browser from './browser' +import { updateHasReviewPanelToggledEffect } from './changes/change-manager' /** * The built-in extension which draws the cursor and selection(s) in layers, @@ -97,7 +98,8 @@ const selectionLayer = layer({ update.docChanged || update.selectionSet || update.viewportChanged || - updateHasMouseDownEffect(update) + updateHasMouseDownEffect(update) || + updateHasReviewPanelToggledEffect(update) ) }, class: 'cm-selectionLayer', diff --git a/services/web/frontend/js/features/source-editor/hooks/use-codemirror-scope.ts b/services/web/frontend/js/features/source-editor/hooks/use-codemirror-scope.ts index 28622cdc01..d9f2bafc85 100644 --- a/services/web/frontend/js/features/source-editor/hooks/use-codemirror-scope.ts +++ b/services/web/frontend/js/features/source-editor/hooks/use-codemirror-scope.ts @@ -43,6 +43,7 @@ import { import { createChangeManager, dispatchEditorEvent, + reviewPanelToggled, } from '../extensions/changes/change-manager' import { setKeybindings } from '../extensions/keybindings' import { Highlight } from '../../../../../types/highlight' @@ -56,6 +57,7 @@ import isValidTexFile from '@/main/is-valid-tex-file' import { captureException } from '@/infrastructure/error-reporter' import grammarlyExtensionPresent from '@/shared/utils/grammarly' import { DocumentContainer } from '@/features/ide-react/editor/document-container' +import { useLayoutContext } from '@/shared/context/layout-context' function useCodeMirrorScope(view: EditorView) { const ide = useIdeContext() @@ -69,6 +71,8 @@ function useCodeMirrorScope(view: EditorView) { const { logEntryAnnotations, editedSinceCompileStarted, compiling } = useCompileContext() + const { reviewPanelOpen, miniReviewPanelVisible } = useLayoutContext() + const [loadingThreads] = useScopeValue('loadingThreads') const [currentDoc] = useScopeValue( @@ -515,6 +519,10 @@ function useCodeMirrorScope(view: EditorView) { }, [view]) useEventListener('learnedWords:reset', handleResetLearnedWords) + + useEffect(() => { + view.dispatch(reviewPanelToggled()) + }, [reviewPanelOpen, miniReviewPanelVisible, view]) } export default useCodeMirrorScope