mirror of
https://github.com/overleaf/overleaf.git
synced 2024-12-04 22:35:51 -05:00
4a3eed35d6
* Fix accept changes request for new review panel * Implement pessimistic UI updates for new review panel (#20986) * Implement pessimistic UI updates for new review panel * deleteThread, reopenThread handlers * use finally * handleSubmit in useCallback GitOrigin-RevId: 358181a6b5601ad1b3579e001564dfa4da67a81d
156 lines
4.3 KiB
TypeScript
156 lines
4.3 KiB
TypeScript
import {
|
|
createContext,
|
|
FC,
|
|
useContext,
|
|
useEffect,
|
|
useMemo,
|
|
useState,
|
|
} from 'react'
|
|
import useScopeValue from '@/shared/hooks/use-scope-value'
|
|
import { DocumentContainer } from '@/features/ide-react/editor/document-container'
|
|
import {
|
|
Change,
|
|
CommentOperation,
|
|
EditOperation,
|
|
} from '../../../../../types/change'
|
|
import RangesTracker from '@overleaf/ranges-tracker'
|
|
import { rejectChanges } from '@/features/source-editor/extensions/changes/reject-changes'
|
|
import { useCodeMirrorViewContext } from '@/features/source-editor/components/codemirror-context'
|
|
import { postJSON } from '@/infrastructure/fetch-json'
|
|
import { useIdeReactContext } from '@/features/ide-react/context/ide-react-context'
|
|
|
|
export type Ranges = {
|
|
docId: string
|
|
total: number
|
|
changes: Change<EditOperation>[]
|
|
comments: Change<CommentOperation>[]
|
|
}
|
|
|
|
export const RangesContext = createContext<Ranges | undefined>(undefined)
|
|
|
|
type RangesActions = {
|
|
acceptChanges: (...ids: string[]) => void
|
|
rejectChanges: (...ids: string[]) => void
|
|
}
|
|
|
|
const buildRanges = (currentDoc: DocumentContainer | null) => {
|
|
const ranges = currentDoc?.ranges
|
|
|
|
if (!ranges) {
|
|
return undefined
|
|
}
|
|
|
|
const dirtyState = ranges.getDirtyState()
|
|
ranges.resetDirtyState()
|
|
|
|
return {
|
|
changes: ranges.changes.map(change =>
|
|
change.id in dirtyState.change ? { ...change } : change
|
|
),
|
|
comments: ranges.comments.map(comment =>
|
|
comment.id in dirtyState.comment ? { ...comment } : comment
|
|
),
|
|
docId: currentDoc.doc_id,
|
|
total: ranges.changes.length + ranges.comments.length,
|
|
}
|
|
}
|
|
|
|
const RangesActionsContext = createContext<RangesActions | undefined>(undefined)
|
|
|
|
export const RangesProvider: FC = ({ children }) => {
|
|
const view = useCodeMirrorViewContext()
|
|
const { projectId } = useIdeReactContext()
|
|
const [currentDoc] = useScopeValue<DocumentContainer | null>(
|
|
'editor.sharejs_doc'
|
|
)
|
|
|
|
const [ranges, setRanges] = useState<Ranges | undefined>(() =>
|
|
buildRanges(currentDoc)
|
|
)
|
|
|
|
// rebuild the ranges when the current doc changes
|
|
useEffect(() => {
|
|
setRanges(buildRanges(currentDoc))
|
|
}, [currentDoc])
|
|
|
|
useEffect(() => {
|
|
if (currentDoc) {
|
|
const listener = () => {
|
|
setRanges(buildRanges(currentDoc))
|
|
}
|
|
|
|
// currentDoc.on('ranges:clear.cm6', listener)
|
|
currentDoc.on('ranges:redraw.cm6', listener)
|
|
currentDoc.on('ranges:dirty.cm6', listener)
|
|
|
|
return () => {
|
|
// currentDoc.off('ranges:clear.cm6')
|
|
currentDoc.off('ranges:redraw.cm6')
|
|
currentDoc.off('ranges:dirty.cm6')
|
|
}
|
|
}
|
|
}, [currentDoc])
|
|
|
|
// TODO: move this into DocumentContainer?
|
|
useEffect(() => {
|
|
if (currentDoc) {
|
|
const regenerateTrackChangesId = (doc: DocumentContainer) => {
|
|
if (doc.ranges) {
|
|
const inflight = doc.ranges.getIdSeed()
|
|
const pending = RangesTracker.generateIdSeed()
|
|
doc.ranges.setIdSeed(pending)
|
|
doc.setTrackChangesIdSeeds({ pending, inflight })
|
|
}
|
|
}
|
|
|
|
currentDoc.on('flipped_pending_to_inflight', () =>
|
|
regenerateTrackChangesId(currentDoc)
|
|
)
|
|
|
|
regenerateTrackChangesId(currentDoc)
|
|
|
|
return () => {
|
|
currentDoc.off('flipped_pending_to_inflight')
|
|
}
|
|
}
|
|
}, [currentDoc])
|
|
|
|
const actions = useMemo(
|
|
() => ({
|
|
async acceptChanges(...ids: string[]) {
|
|
if (currentDoc?.ranges) {
|
|
const url = `/project/${projectId}/doc/${currentDoc.doc_id}/changes/accept`
|
|
await postJSON(url, { body: { change_ids: ids } })
|
|
currentDoc.ranges.removeChangeIds(ids)
|
|
setRanges(buildRanges(currentDoc))
|
|
}
|
|
},
|
|
rejectChanges(...ids: string[]) {
|
|
if (currentDoc?.ranges) {
|
|
view.dispatch(rejectChanges(view.state, currentDoc.ranges, ids))
|
|
}
|
|
},
|
|
}),
|
|
[currentDoc, projectId, view]
|
|
)
|
|
|
|
return (
|
|
<RangesActionsContext.Provider value={actions}>
|
|
<RangesContext.Provider value={ranges}>{children}</RangesContext.Provider>
|
|
</RangesActionsContext.Provider>
|
|
)
|
|
}
|
|
|
|
export const useRangesContext = () => {
|
|
return useContext(RangesContext)
|
|
}
|
|
|
|
export const useRangesActionsContext = () => {
|
|
const context = useContext(RangesActionsContext)
|
|
if (!context) {
|
|
throw new Error(
|
|
'useRangesActionsContext is only available inside RangesProvider'
|
|
)
|
|
}
|
|
return context
|
|
}
|