github/overleaf
1
0
Fork 0
mirror of https://github.com/overleaf/overleaf.git synced 2024-11-21 20:47:08 -05:00
Code Issues Projects Releases Packages Wiki Activity

Allow position of review tooltip to be calculated automatically (#21803)

Browse source 
* Remove view from textSelectedEffect
* Upgrade @codemirror/view to 6.34.3

GitOrigin-RevId: 7d285a9c76032a3238422e15a73ae4b819612b31
This commit is contained in:
Alf Eaton 2024-11-20 11:30:13 +00:00 committed by Copybot
parent a5f38a8663
commit 598ccab8b4
4 changed files with 40 additions and 25 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
package-lock.json generated
View file

@ -3432,10 +3432,11 @@
"dev": true
},
"node_modules/@codemirror/view": {
"version": "6.34.0",
"resolved": "https://registry.npmjs.org/@codemirror/view/-/view-6.34.0.tgz",
"integrity": "sha512-2vKJ79tOcVfgPYVJM2XjcL1BH5Bsl7/tgn9ilBj3XWeCS5kTRy/NE4FHEj4aMylOl/D3IPNsmZH0WPlB+DyIdA==",
"version": "6.34.3",
"resolved": "https://registry.npmjs.org/@codemirror/view/-/view-6.34.3.tgz",
"integrity": "sha512-Ph5d+u8DxIeSgssXEakaakImkzBV4+slwIbcxl9oc9evexJhImeu/G8TK7+zp+IFK9KuJ0BdSn6kTBJeH2CHvA==",
"dev": true,
"license": "MIT",
"dependencies": {
"@codemirror/state": "^6.4.0",
"style-mod": "^4.1.0",
@ -41474,7 +41475,7 @@
"@codemirror/lint": "^6.8.2",
"@codemirror/search": "github:overleaf/codemirror-search#94f33f7fa6db95dadd3d7aed05c30cdde550835a",
"@codemirror/state": "^6.4.1",
"@codemirror/view": "^6.34.0",
"@codemirror/view": "^6.34.3",
"@juggle/resize-observer": "^3.3.1",
"@lezer/common": "^1.2.1",
"@lezer/generator": "^1.7.1",
@ -46493,9 +46494,9 @@
"dev": true
},
"@codemirror/view": {
"version": "6.34.0",
"resolved": "https://registry.npmjs.org/@codemirror/view/-/view-6.34.0.tgz",
"integrity": "sha512-2vKJ79tOcVfgPYVJM2XjcL1BH5Bsl7/tgn9ilBj3XWeCS5kTRy/NE4FHEj4aMylOl/D3IPNsmZH0WPlB+DyIdA==",
"version": "6.34.3",
"resolved": "https://registry.npmjs.org/@codemirror/view/-/view-6.34.3.tgz",
"integrity": "sha512-Ph5d+u8DxIeSgssXEakaakImkzBV4+slwIbcxl9oc9evexJhImeu/G8TK7+zp+IFK9KuJ0BdSn6kTBJeH2CHvA==",
"dev": true,
"requires": {
"@codemirror/state": "^6.4.0",
@ -50969,7 +50970,7 @@
"@codemirror/lint": "^6.8.2",
"@codemirror/search": "github:overleaf/codemirror-search#94f33f7fa6db95dadd3d7aed05c30cdde550835a",
"@codemirror/state": "^6.4.1",
"@codemirror/view": "^6.34.0",
"@codemirror/view": "^6.34.3",
"@contentful/rich-text-html-renderer": "^16.0.2",
"@contentful/rich-text-types": "^16.0.2",
"@google-cloud/bigquery": "^6.0.1",

10
services/web/frontend/js/features/source-editor/extensions/index.ts
View file

@ -95,6 +95,16 @@ export const createExtensions = (options: Record<string, any>): Extension[] => [
// to avoid cutting off tooltips which overflow the editor.
tooltips({
parent: document.body,
tooltipSpace(view) {
const { top, bottom } = view.scrollDOM.getBoundingClientRect()
return {
top,
left: 0,
bottom,
right: window.innerWidth,
}
},
}),
keymaps,
goToLinePanel(),

36
services/web/frontend/js/features/source-editor/extensions/review-tooltip.ts
View file

@ -4,6 +4,7 @@ import {
EditorView,
showTooltip,
Tooltip,
TooltipView,
} from '@codemirror/view'
import {
Extension,
@ -11,16 +12,16 @@ import {
StateEffect,
Range,
SelectionRange,
EditorState,
} from '@codemirror/state'
import { isSplitTestEnabled } from '@/utils/splitTestUtils'
import { v4 as uuid } from 'uuid'
import { isCursorNearViewportTop } from '../utils/is-cursor-near-edge'
export const addNewCommentRangeEffect = StateEffect.define<Range<Decoration>>()
export const removeNewCommentRangeEffect = StateEffect.define<Decoration>()
export const textSelectedEffect = StateEffect.define<EditorView>()
export const textSelectedEffect = StateEffect.define<null>()
export const removeReviewPanelTooltipEffect = StateEffect.define()
@ -46,7 +47,7 @@ export const reviewTooltip = (): Extension => {
EditorView.updateListener.of(update => {
if (update.selectionSet && !update.state.selection.main.empty) {
update.view.dispatch({
effects: textSelectedEffect.of(update.view),
effects: textSelectedEffect.of(null),
})
} else if (
!update.startState.selection.main.empty &&
@ -103,7 +104,7 @@ export const reviewTooltipStateField = StateField.define<{
}
if (effect.is(textSelectedEffect)) {
tooltip = buildTooltip(effect.value)
tooltip = buildTooltip(tr.state)
}
if (tooltip && tr.state.selection.main.empty) {
@ -120,22 +121,25 @@ export const reviewTooltipStateField = StateField.define<{
],
})
function buildTooltip(view: EditorView): Tooltip | null {
if (view.state.selection.main.empty) {
function buildTooltip(state: EditorState): Tooltip | null {
if (state.selection.main.empty) {
return null
}
const pos = view.state.selection.main.head
return {
pos,
above: !isCursorNearViewportTop(view, pos, 50),
strictSide: true,
arrow: false,
create() {
const dom = document.createElement('div')
dom.className = 'review-tooltip-menu-container'
return { dom, overlap: true, offset: { x: 0, y: 8 } }
},
pos: state.selection.main.head,
above: true,
create: createReviewTooltipView,
}
}
const createReviewTooltipView = (): TooltipView => {
const dom = document.createElement('div')
dom.className = 'review-tooltip-menu-container'
return {
dom,
overlap: true,
offset: { x: 0, y: 8 },
}
}

2
services/web/package.json
View file

@ -185,7 +185,7 @@
"@codemirror/lint": "^6.8.2",
"@codemirror/search": "github:overleaf/codemirror-search#94f33f7fa6db95dadd3d7aed05c30cdde550835a",
"@codemirror/state": "^6.4.1",
"@codemirror/view": "^6.34.0",
"@codemirror/view": "^6.34.3",
"@juggle/resize-observer": "^3.3.1",
"@lezer/common": "^1.2.1",
"@lezer/generator": "^1.7.1",