github/overleaf
1
0
Fork 0
mirror of https://github.com/overleaf/overleaf.git synced 2025-04-22 06:07:59 +00:00
Code Issues Projects Releases Packages Wiki Activity

Merge pull request #22055 from overleaf/ae-restore-review-tooltips

Browse source 
Reapply "Allow position of review tooltip to be calculated automatically (#21803)"

GitOrigin-RevId: b6dff2d12627b04ff1859bd4765be01670256aa4
This commit is contained in:
Alf Eaton 2024-11-21 12:59:51 +00:00 • committed by Copybot
parent 56f6f77ba2
commit 3bbde49781
4 changed files with 52 additions and 36 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

38
package-lock.json generated
View file

@ -3404,13 +3404,14 @@
}
},
"node_modules/@codemirror/lint": {
"version": "6.8.2",
"resolved": "https://registry.npmjs.org/@codemirror/lint/-/lint-6.8.2.tgz",
"integrity": "sha512-PDFG5DjHxSEjOXk9TQYYVjZDqlZTFaDBfhQixHnQOEVDDNHUbEh/hstAjcQJaA6FQdZTD1hquXTK0rVBLADR1g==",
"version": "6.8.3",
"resolved": "https://registry.npmjs.org/@codemirror/lint/-/lint-6.8.3.tgz",
"integrity": "sha512-GSGfKxCo867P7EX1k2LoCrjuQFeqVgPGRRsSl4J4c0KMkD+k1y6WYvTQkzv0iZ8JhLJDujEvlnMchv4CZQLh3Q==",
"dev": true,
"license": "MIT",
"dependencies": {
"@codemirror/state": "^6.0.0",
"@codemirror/view": "^6.0.0",
"@codemirror/view": "^6.35.0",
"crelt": "^1.0.5"
}
},
@ -3432,10 +3433,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.35.0",
"resolved": "https://registry.npmjs.org/@codemirror/view/-/view-6.35.0.tgz",
"integrity": "sha512-I0tYy63q5XkaWsJ8QRv5h6ves7kvtrBWjBcnf/bzohFJQc5c14a1AQRdE8QpPF9eMp5Mq2FMm59TCj1gDfE7kw==",
"dev": true,
"license": "MIT",
"dependencies": {
"@codemirror/state": "^6.4.0",
"style-mod": "^4.1.0",
@ -41493,10 +41495,10 @@
"@codemirror/commands": "^6.6.2",
"@codemirror/lang-markdown": "^6.2.5",
"@codemirror/language": "^6.10.3",
"@codemirror/lint": "^6.8.2",
"@codemirror/lint": "^6.8.3",
"@codemirror/search": "github:overleaf/codemirror-search#94f33f7fa6db95dadd3d7aed05c30cdde550835a",
"@codemirror/state": "^6.4.1",
"@codemirror/view": "^6.34.0",
"@codemirror/view": "^6.35.0",
"@juggle/resize-observer": "^3.3.1",
"@lezer/common": "^1.2.3",
"@lezer/generator": "^1.7.1",
@ -46502,13 +46504,13 @@
}
},
"@codemirror/lint": {
"version": "6.8.2",
"resolved": "https://registry.npmjs.org/@codemirror/lint/-/lint-6.8.2.tgz",
"integrity": "sha512-PDFG5DjHxSEjOXk9TQYYVjZDqlZTFaDBfhQixHnQOEVDDNHUbEh/hstAjcQJaA6FQdZTD1hquXTK0rVBLADR1g==",
"version": "6.8.3",
"resolved": "https://registry.npmjs.org/@codemirror/lint/-/lint-6.8.3.tgz",
"integrity": "sha512-GSGfKxCo867P7EX1k2LoCrjuQFeqVgPGRRsSl4J4c0KMkD+k1y6WYvTQkzv0iZ8JhLJDujEvlnMchv4CZQLh3Q==",
"dev": true,
"requires": {
"@codemirror/state": "^6.0.0",
"@codemirror/view": "^6.0.0",
"@codemirror/view": "^6.35.0",
"crelt": "^1.0.5"
}
},
@ -46530,9 +46532,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.35.0",
"resolved": "https://registry.npmjs.org/@codemirror/view/-/view-6.35.0.tgz",
"integrity": "sha512-I0tYy63q5XkaWsJ8QRv5h6ves7kvtrBWjBcnf/bzohFJQc5c14a1AQRdE8QpPF9eMp5Mq2FMm59TCj1gDfE7kw==",
"dev": true,
"requires": {
"@codemirror/state": "^6.4.0",
@ -51003,10 +51005,10 @@
"@codemirror/commands": "^6.6.2",
"@codemirror/lang-markdown": "^6.2.5",
"@codemirror/language": "^6.10.3",
"@codemirror/lint": "^6.8.2",
"@codemirror/lint": "^6.8.3",
"@codemirror/search": "github:overleaf/codemirror-search#94f33f7fa6db95dadd3d7aed05c30cdde550835a",
"@codemirror/state": "^6.4.1",
"@codemirror/view": "^6.34.0",
"@codemirror/view": "^6.35.0",
"@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 },
}
}

4
services/web/package.json
View file

@ -182,10 +182,10 @@
"@codemirror/commands": "^6.6.2",
"@codemirror/lang-markdown": "^6.2.5",
"@codemirror/language": "^6.10.3",
"@codemirror/lint": "^6.8.2",
"@codemirror/lint": "^6.8.3",
"@codemirror/search": "github:overleaf/codemirror-search#94f33f7fa6db95dadd3d7aed05c30cdde550835a",
"@codemirror/state": "^6.4.1",
"@codemirror/view": "^6.34.0",
"@codemirror/view": "^6.35.0",
"@juggle/resize-observer": "^3.3.1",
"@lezer/common": "^1.2.3",
"@lezer/generator": "^1.7.1",