diff --git a/services/web/frontend/js/features/ide-react/context/review-panel/hooks/use-review-panel-state.ts b/services/web/frontend/js/features/ide-react/context/review-panel/hooks/use-review-panel-state.ts index 5f65b1fcb9..92412c1128 100644 --- a/services/web/frontend/js/features/ide-react/context/review-panel/hooks/use-review-panel-state.ts +++ b/services/web/frontend/js/features/ide-react/context/review-panel/hooks/use-review-panel-state.ts @@ -170,9 +170,8 @@ function useReviewPanelState(): ReviewPanelStateReactIde { const openDocId = currentDocumentId const [shouldCollapse, setShouldCollapse] = useState>(true) - const [lineHeight] = useScopeValue( - 'reviewPanel.rendererData.lineHeight' - ) + const [lineHeight, setLineHeight] = + useState>(0) const [formattedProjectMembers, setFormattedProjectMembers] = useState< ReviewPanel.Value<'formattedProjectMembers'> @@ -1163,6 +1162,11 @@ function useReviewPanelState(): ReviewPanelStateReactIde { } } + const editorLineHeightChanged = (payload: typeof lineHeight) => { + setLineHeight(payload) + handleLayoutChange() + } + const editorTrackChangesChanged = async () => { const entries = await updateEntries(currentDocumentId) dispatchReviewPanelEvent('recalculate-screen-positions', { @@ -1315,6 +1319,11 @@ function useReviewPanelState(): ReviewPanelStateReactIde { const { type, payload } = event.detail switch (type) { + case 'line-height': { + editorLineHeightChanged(payload) + break + } + case 'track-changes:changed': { editorTrackChangesChanged() break diff --git a/services/web/frontend/js/features/ide-react/scope-adapters/review-panel-context-adapter.ts b/services/web/frontend/js/features/ide-react/scope-adapters/review-panel-context-adapter.ts index b5fa99d3c0..cd71fb3261 100644 --- a/services/web/frontend/js/features/ide-react/scope-adapters/review-panel-context-adapter.ts +++ b/services/web/frontend/js/features/ide-react/scope-adapters/review-panel-context-adapter.ts @@ -5,7 +5,6 @@ export default function populateReviewPanelScope(store: ReactScopeValueStore) { store.set('reviewPanel.nVisibleSelectedChanges', 0) store.set('users', {}) store.set('reviewPanel.layoutToLeft', false) - store.set('reviewPanel.rendererData.lineHeight', 0) store.set('gotoEntry', () => {}) store.set('addNewComment', () => {}) } 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 ee191d80a1..47752ea02b 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 @@ -36,7 +36,10 @@ import { resetLearnedWords, setSpelling, } from '../extensions/spelling' -import { createChangeManager } from '../extensions/changes/change-manager' +import { + createChangeManager, + dispatchEditorEvent, +} from '../extensions/changes/change-manager' import { setKeybindings } from '../extensions/keybindings' import { Highlight } from '../../../../../types/highlight' import { EditorView } from '@codemirror/view' @@ -171,14 +174,7 @@ function useCodeMirrorScope(view: EditorView) { useEffect(() => { if (lineHeight && fontSize) { - window.dispatchEvent( - new CustomEvent('editor:event', { - detail: { - type: 'line-height', - payload: lineHeights[lineHeight] * fontSize, - }, - }) - ) + dispatchEditorEvent('line-height', lineHeights[lineHeight] * fontSize) } }, [lineHeight, fontSize])