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

Move CodeMirror contexts into a separate file (#20643)

Browse source 
GitOrigin-RevId: 8425454a75ff8160a03fda1be5bda2242b41f6cd
This commit is contained in:
Alf Eaton 2024-09-27 11:31:31 +01:00 committed by Copybot
parent ed343e7a16
commit c6633632d6
42 changed files with 88 additions and 83 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
services/web/frontend/js/features/review-panel-new/components/add-comment-tooltip.tsx
View file

@ -5,7 +5,7 @@ import { useTranslation } from 'react-i18next'
import {
useCodeMirrorStateContext,
useCodeMirrorViewContext,
} from '@/features/source-editor/components/codemirror-editor'
} from '@/features/source-editor/components/codemirror-context'
import {
addCommentStateField,
buildAddNewCommentRangeEffect,

2
services/web/frontend/js/features/review-panel-new/components/review-panel-add-comment.tsx
View file

@ -2,7 +2,7 @@ import { FC, FormEventHandler, useCallback, useState, useRef } from 'react'
import {
useCodeMirrorStateContext,
useCodeMirrorViewContext,
} from '@/features/source-editor/components/codemirror-editor'
} from '@/features/source-editor/components/codemirror-context'
import { EditorSelection } from '@codemirror/state'
import { useTranslation } from 'react-i18next'
import { useThreadsActionsContext } from '../context/threads-context'

2
services/web/frontend/js/features/review-panel-new/components/review-panel-container.tsx
View file

@ -1,5 +1,5 @@
import ReactDOM from 'react-dom'
import { useCodeMirrorViewContext } from '../../source-editor/components/codemirror-editor'
import { useCodeMirrorViewContext } from '../../source-editor/components/codemirror-context'
import { memo } from 'react'
import ReviewPanel from './review-panel'
import { useLayoutContext } from '@/shared/context/layout-context'

2
services/web/frontend/js/features/review-panel-new/components/review-panel-current-file.tsx
View file

@ -19,7 +19,7 @@ import {
import {
useCodeMirrorStateContext,
useCodeMirrorViewContext,
} from '@/features/source-editor/components/codemirror-editor'
} from '@/features/source-editor/components/codemirror-context'
import { useRangesContext } from '../context/ranges-context'
import { useThreadsContext } from '../context/threads-context'
import { isDeleteChange, isInsertChange } from '@/utils/operations'

2
services/web/frontend/js/features/review-panel-new/components/review-panel-entry.tsx
View file

@ -3,7 +3,7 @@ import { AnyOperation } from '../../../../../types/change'
import {
useCodeMirrorStateContext,
useCodeMirrorViewContext,
} from '@/features/source-editor/components/codemirror-editor'
} from '@/features/source-editor/components/codemirror-context'
import { isSelectionWithinOp } from '../utils/is-selection-within-op'
import classNames from 'classnames'
import { highlightRanges } from '@/features/source-editor/extensions/ranges'

2
services/web/frontend/js/features/review-panel-new/context/ranges-context.tsx
View file

@ -15,7 +15,7 @@ import {
} 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-editor'
import { useCodeMirrorViewContext } from '@/features/source-editor/components/codemirror-context'
export type Ranges = {
docId: string

2
services/web/frontend/js/features/review-panel-new/hooks/use-review-panel-styles.ts
View file

@ -1,5 +1,5 @@
import { CSSProperties, useCallback, useEffect, useState } from 'react'
import { useCodeMirrorViewContext } from '@/features/source-editor/components/codemirror-editor'
import { useCodeMirrorViewContext } from '@/features/source-editor/components/codemirror-context'
export const useReviewPanelStyles = (mini: boolean) => {
const view = useCodeMirrorViewContext()

2
services/web/frontend/js/features/source-editor/components/codemirror-command-tooltip.tsx
View file

@ -2,7 +2,7 @@ import { memo, useEffect } from 'react'
import {
useCodeMirrorStateContext,
useCodeMirrorViewContext,
} from './codemirror-editor'
} from './codemirror-context'
import {
closeCommandTooltip,
commandTooltipState,

35
services/web/frontend/js/features/source-editor/components/codemirror-context.ts Normal file
View file

@ -0,0 +1,35 @@
import { createContext, useContext } from 'react'
import { EditorView } from '@codemirror/view'
import { EditorState } from '@codemirror/state'
export const CodeMirrorStateContext = createContext<EditorState | undefined>(
undefined
)
export const CodeMirrorViewContext = createContext<EditorView | undefined>(
undefined
)
export const useCodeMirrorStateContext = (): EditorState => {
const context = useContext(CodeMirrorStateContext)
if (!context) {
throw new Error(
'useCodeMirrorStateContext is only available inside CodeMirrorStateContext.Provider'
)
}
return context
}
export const useCodeMirrorViewContext = (): EditorView => {
const context = useContext(CodeMirrorViewContext)
if (!context) {
throw new Error(
'useCodeMirrorViewContext is only available inside CodeMirrorViewContext.Provider'
)
}
return context
}

50
services/web/frontend/js/features/source-editor/components/codemirror-editor.tsx
View file

@ -1,11 +1,4 @@
import {
createContext,
ElementType,
memo,
useContext,
useRef,
useState,
} from 'react'
import { ElementType, memo, useRef, useState } from 'react'
import useIsMounted from '../../../shared/hooks/use-is-mounted'
import { EditorView } from '@codemirror/view'
import { EditorState } from '@codemirror/state'
@ -21,6 +14,13 @@ import { ReviewPanelProviders } from '@/features/review-panel-new/context/review
import { ReviewPanelMigration } from '@/features/source-editor/components/review-panel/review-panel-migration'
import AddCommentTooltip from '@/features/review-panel-new/components/add-comment-tooltip'
import { useFeatureFlag } from '@/shared/context/split-test-context'
import {
CodeMirrorStateContext,
CodeMirrorViewContext,
} from './codemirror-context'
// TODO: remove this when definitely no longer used
export * from './codemirror-context'
const sourceEditorComponents = importOverleafModules(
'sourceEditorComponents'
@ -64,7 +64,7 @@ function CodeMirrorEditor() {
return (
<CodeMirrorStateContext.Provider value={state}>
<CodeMirrorViewContextProvider value={viewRef.current}>
<CodeMirrorViewContext.Provider value={viewRef.current}>
<ReviewPanelProviders>
<CodemirrorOutline />
<CodeMirrorView />
@ -87,39 +87,9 @@ function CodeMirrorEditor() {
)
)}
</ReviewPanelProviders>
</CodeMirrorViewContextProvider>
</CodeMirrorViewContext.Provider>
</CodeMirrorStateContext.Provider>
)
}
export default memo(CodeMirrorEditor)
const CodeMirrorStateContext = createContext<EditorState | undefined>(undefined)
export const useCodeMirrorStateContext = (): EditorState => {
const context = useContext(CodeMirrorStateContext)
if (!context) {
throw new Error(
'useCodeMirrorStateContext is only available inside CodeMirrorEditor'
)
}
return context
}
const CodeMirrorViewContext = createContext<EditorView | undefined>(undefined)
export const CodeMirrorViewContextProvider = CodeMirrorViewContext.Provider
export const useCodeMirrorViewContext = (): EditorView => {
const context = useContext(CodeMirrorViewContext)
if (!context) {
throw new Error(
'useCodeMirrorViewContext is only available inside CodeMirrorViewContextProvider'
)
}
return context
}

2
services/web/frontend/js/features/source-editor/components/codemirror-outline.tsx
View file

@ -1,4 +1,4 @@
import { useCodeMirrorStateContext } from './codemirror-editor'
import { useCodeMirrorStateContext } from './codemirror-context'
import React, { useEffect } from 'react'
import { documentOutline } from '../languages/latex/document-outline'
import { ProjectionStatus } from '../utils/tree-operations/projection'

2
services/web/frontend/js/features/source-editor/components/codemirror-search-form.tsx
View file

@ -1,7 +1,7 @@
import {
useCodeMirrorStateContext,
useCodeMirrorViewContext,
} from './codemirror-editor'
} from './codemirror-context'
import { FC, useCallback, useEffect, useMemo, useRef, useState } from 'react'
import { runScopeHandlers } from '@codemirror/view'
import {

2
services/web/frontend/js/features/source-editor/components/codemirror-search.tsx
View file

@ -1,6 +1,6 @@
import { createPortal } from 'react-dom'
import CodeMirrorSearchForm from './codemirror-search-form'
import { useCodeMirrorViewContext } from './codemirror-editor'
import { useCodeMirrorViewContext } from './codemirror-context'
import { getPanel } from '@codemirror/view'
import { createSearchPanel } from '@codemirror/search'

2
services/web/frontend/js/features/source-editor/components/codemirror-toolbar.tsx
View file

@ -3,7 +3,7 @@ import { createPortal } from 'react-dom'
import {
useCodeMirrorStateContext,
useCodeMirrorViewContext,
} from './codemirror-editor'
} from './codemirror-context'
import { searchPanelOpen } from '@codemirror/search'
import { useResizeObserver } from '../../../shared/hooks/use-resize-observer'
import { ToolbarButton } from './toolbar/toolbar-button'

2
services/web/frontend/js/features/source-editor/components/codemirror-view.tsx
View file

@ -1,5 +1,5 @@
import { memo, useCallback, useEffect } from 'react'
import { useCodeMirrorViewContext } from './codemirror-editor'
import { useCodeMirrorViewContext } from './codemirror-context'
import useCodeMirrorScope from '../hooks/use-codemirror-scope'
import useScopeValueSetterOnly from '@/shared/hooks/use-scope-value-setter-only'

2
services/web/frontend/js/features/source-editor/components/command-tooltip/href-tooltip.tsx
View file

@ -3,7 +3,7 @@ import { useTranslation } from 'react-i18next'
import {
useCodeMirrorStateContext,
useCodeMirrorViewContext,
} from '../codemirror-editor'
} from '../codemirror-context'
import {
closeCommandTooltip,
resolveCommandNode,

2
services/web/frontend/js/features/source-editor/components/command-tooltip/ref-tooltip.tsx
View file

@ -3,7 +3,7 @@ import { useTranslation } from 'react-i18next'
import {
useCodeMirrorStateContext,
useCodeMirrorViewContext,
} from '../codemirror-editor'
} from '../codemirror-context'
import { Button } from 'react-bootstrap'
import { resolveCommandNode } from '../../extensions/command-tooltip'
import {

2
services/web/frontend/js/features/source-editor/components/command-tooltip/url-tooltip.tsx
View file

@ -1,6 +1,6 @@
import { FC } from 'react'
import { useTranslation } from 'react-i18next'
import { useCodeMirrorStateContext } from '../codemirror-editor'
import { useCodeMirrorStateContext } from '../codemirror-context'
import { Button } from 'react-bootstrap'
import { resolveCommandNode } from '../../extensions/command-tooltip'
import {

2
services/web/frontend/js/features/source-editor/components/figure-modal/figure-modal.tsx
View file

@ -8,7 +8,7 @@ import {
} from './figure-modal-context'
import { FigureModalFooter } from './figure-modal-footer'
import { lazy, memo, Suspense, useCallback, useEffect } from 'react'
import { useCodeMirrorViewContext } from '../codemirror-editor'
import { useCodeMirrorViewContext } from '../codemirror-context'
import { ChangeSpec } from '@codemirror/state'
import { snippet } from '@codemirror/autocomplete'
import {

2
services/web/frontend/js/features/source-editor/components/figure-modal/file-sources/figure-modal-other-project-source.tsx
View file

@ -21,7 +21,7 @@ import { useProjectContext } from '../../../../../shared/context/project-context
import { FileRelocator } from '../file-relocator'
import { useTranslation } from 'react-i18next'
import { waitForFileTreeUpdate } from '../../../extensions/figure-modal'
import { useCodeMirrorViewContext } from '../../codemirror-editor'
import { useCodeMirrorViewContext } from '../../codemirror-context'
import getMeta from '@/utils/meta'
function suggestName(path: string) {

2
services/web/frontend/js/features/source-editor/components/figure-modal/file-sources/figure-modal-upload-source.tsx
View file

@ -14,7 +14,7 @@ import classNames from 'classnames'
import { Button } from 'react-bootstrap'
import { FileRelocator } from '../file-relocator'
import { useTranslation } from 'react-i18next'
import { useCodeMirrorViewContext } from '../../codemirror-editor'
import { useCodeMirrorViewContext } from '../../codemirror-context'
import { waitForFileTreeUpdate } from '../../../extensions/figure-modal'
import getMeta from '@/utils/meta'

2
services/web/frontend/js/features/source-editor/components/figure-modal/file-sources/figure-modal-url-source.tsx
View file

@ -6,7 +6,7 @@ import { File } from '../../../utils/file'
import { useCurrentProjectFolders } from '../../../hooks/use-current-project-folders'
import { FileRelocator } from '../file-relocator'
import { useTranslation } from 'react-i18next'
import { useCodeMirrorViewContext } from '../../codemirror-editor'
import { useCodeMirrorViewContext } from '../../codemirror-context'
import { EditorView } from '@codemirror/view'
import { waitForFileTreeUpdate } from '../../../extensions/figure-modal'

2
services/web/frontend/js/features/source-editor/components/review-panel/editor-widgets/editor-widgets.tsx
View file

@ -9,7 +9,7 @@ import {
useReviewPanelValueContext,
} from '../../../context/review-panel/review-panel-context'
import { useEditorContext } from '@/shared/context/editor-context'
import { useCodeMirrorViewContext } from '../../codemirror-editor'
import { useCodeMirrorViewContext } from '../../codemirror-context'
import Modal, { useBulkActionsModal } from '../entries/bulk-actions-entry/modal'
import getMeta from '../../../../../utils/meta'
import useScopeEventListener from '@/shared/hooks/use-scope-event-listener'

2
services/web/frontend/js/features/source-editor/components/review-panel/editor-widgets/toggle-widget.tsx
View file

@ -1,6 +1,6 @@
import { Trans } from 'react-i18next'
import { useReviewPanelUpdaterFnsContext } from '../../../context/review-panel/review-panel-context'
import { useCodeMirrorStateContext } from '../../codemirror-editor'
import { useCodeMirrorStateContext } from '../../codemirror-context'
import { EditorView } from '@codemirror/view'
import classnames from 'classnames'
import { memo } from 'react'

2
services/web/frontend/js/features/source-editor/components/review-panel/review-panel.tsx
View file

@ -1,5 +1,5 @@
import ReactDOM from 'react-dom'
import { useCodeMirrorViewContext } from '../codemirror-editor'
import { useCodeMirrorViewContext } from '../codemirror-context'
import { ReviewPanelProvider } from '../../context/review-panel/review-panel-context'
import { memo } from 'react'
import ReviewPanelContent from '@/features/source-editor/components/review-panel/review-panel-content'

2
services/web/frontend/js/features/source-editor/components/table-generator/cell.tsx
View file

@ -11,7 +11,7 @@ import { typesetNodeIntoElement } from '../../extensions/visual/utils/typeset-co
import { parser } from '../../lezer-latex/latex.mjs'
import { useTableContext } from './contexts/table-context'
import { CellInput, CellInputRef } from './cell-input'
import { useCodeMirrorViewContext } from '../codemirror-editor'
import { useCodeMirrorViewContext } from '../codemirror-context'
export const Cell: FC<{
cellData: CellData

2
services/web/frontend/js/features/source-editor/components/table-generator/contexts/editing-context.tsx
View file

@ -1,5 +1,5 @@
import { FC, createContext, useCallback, useContext, useState } from 'react'
import { useCodeMirrorViewContext } from '../../codemirror-editor'
import { useCodeMirrorViewContext } from '../../codemirror-context'
import { useTableContext } from './table-context'
import { TableSelection } from './selection-context'
import { debugConsole } from '@/utils/debugging'

2
services/web/frontend/js/features/source-editor/components/table-generator/table.tsx
View file

@ -15,7 +15,7 @@ import {
} from './contexts/selection-context'
import { useEditingContext } from './contexts/editing-context'
import { useTableContext } from './contexts/table-context'
import { useCodeMirrorViewContext } from '../codemirror-editor'
import { useCodeMirrorViewContext } from '../codemirror-context'
import { undo, redo } from '@codemirror/commands'
import { ChangeSpec } from '@codemirror/state'
import { startCompileKeypress } from '@/features/pdf-preview/hooks/use-compile-triggers'

8
services/web/frontend/js/features/source-editor/components/table-generator/tabular.tsx
View file

@ -17,9 +17,9 @@ import { ErrorBoundary } from 'react-error-boundary'
import { Alert, Button } from 'react-bootstrap'
import { EditorSelection } from '@codemirror/state'
import {
CodeMirrorViewContextProvider,
CodeMirrorViewContext,
useCodeMirrorViewContext,
} from '../codemirror-editor'
} from '../codemirror-context'
import { TableProvider } from './contexts/table-context'
import { TabularProvider, useTabularContext } from './contexts/tabular-context'
import Icon from '../../../../shared/components/icon'
@ -244,7 +244,7 @@ export const Tabular: FC<{
)}
>
<SplitTestProvider>
<CodeMirrorViewContextProvider value={view}>
<CodeMirrorViewContext.Provider value={view}>
<TabularProvider>
<TableProvider
tabularNode={tabularNode}
@ -262,7 +262,7 @@ export const Tabular: FC<{
</TableProvider>
<TableGeneratorHelpModal />
</TabularProvider>
</CodeMirrorViewContextProvider>
</CodeMirrorViewContext.Provider>
</SplitTestProvider>
</ErrorBoundary>
)

2
services/web/frontend/js/features/source-editor/components/table-generator/toolbar/column-width-modal/modal.tsx
View file

@ -16,7 +16,7 @@ import { useSelectionContext } from '../../contexts/selection-context'
import { useTableContext } from '../../contexts/table-context'
import { setColumnWidth } from '../commands'
import { UNITS, WidthSelection, WidthUnit } from './column-width'
import { useCodeMirrorViewContext } from '../../../codemirror-editor'
import { useCodeMirrorViewContext } from '../../../codemirror-context'
import { CopyToClipboard } from '@/shared/components/copy-to-clipboard'
import Tooltip from '@/shared/components/tooltip'
import Icon from '@/shared/components/icon'

2
services/web/frontend/js/features/source-editor/components/table-generator/toolbar/toolbar-button.tsx
View file

@ -3,7 +3,7 @@ import classNames from 'classnames'
import { memo, useCallback } from 'react'
import Tooltip from '../../../../../shared/components/tooltip'
import MaterialIcon from '../../../../../shared/components/material-icon'
import { useCodeMirrorViewContext } from '../../codemirror-editor'
import { useCodeMirrorViewContext } from '../../codemirror-context'
import { emitTableGeneratorEvent } from '../analytics'
export const ToolbarButton = memo<{

2
services/web/frontend/js/features/source-editor/components/table-generator/toolbar/toolbar-dropdown.tsx
View file

@ -5,7 +5,7 @@ import MaterialIcon from '../../../../../shared/components/material-icon'
import Tooltip from '../../../../../shared/components/tooltip'
import { useTabularContext } from '../contexts/tabular-context'
import { emitTableGeneratorEvent } from '../analytics'
import { useCodeMirrorViewContext } from '../../codemirror-editor'
import { useCodeMirrorViewContext } from '../../codemirror-context'
import classNames from 'classnames'
export const ToolbarDropdown: FC<{

2
services/web/frontend/js/features/source-editor/components/table-generator/toolbar/toolbar.tsx
View file

@ -18,7 +18,7 @@ import {
setBorders,
unmergeCells,
} from './commands'
import { useCodeMirrorViewContext } from '../../codemirror-editor'
import { useCodeMirrorViewContext } from '../../codemirror-context'
import { useTableContext } from '../contexts/table-context'
import { useTabularContext } from '../contexts/tabular-context'
import { useTranslation } from 'react-i18next'

2
services/web/frontend/js/features/source-editor/components/toolbar/button-menu.tsx
View file

@ -5,7 +5,7 @@ import useDropdown from '../../../../shared/hooks/use-dropdown'
import Tooltip from '../../../../shared/components/tooltip'
import { EditorView } from '@codemirror/view'
import { emitToolbarEvent } from '../../extensions/toolbar/utils/analytics'
import { useCodeMirrorViewContext } from '../codemirror-editor'
import { useCodeMirrorViewContext } from '../codemirror-context'
import MaterialIcon from '../../../../shared/components/material-icon'
export const ToolbarButtonMenu: FC<{

2
services/web/frontend/js/features/source-editor/components/toolbar/insert-figure-dropdown.tsx
View file

@ -5,7 +5,7 @@ import { memo, useCallback } from 'react'
import { FigureModalSource } from '../figure-modal/figure-modal-context'
import { useTranslation } from 'react-i18next'
import { emitToolbarEvent } from '../../extensions/toolbar/utils/analytics'
import { useCodeMirrorViewContext } from '../codemirror-editor'
import { useCodeMirrorViewContext } from '../codemirror-context'
import { insertFigure } from '../../extensions/toolbar/commands'
import getMeta from '@/utils/meta'

2
services/web/frontend/js/features/source-editor/components/toolbar/math-dropdown.tsx
View file

@ -3,7 +3,7 @@ import { ToolbarButtonMenu } from './button-menu'
import { emitToolbarEvent } from '../../extensions/toolbar/utils/analytics'
import MaterialIcon from '../../../../shared/components/material-icon'
import { useTranslation } from 'react-i18next'
import { useCodeMirrorViewContext } from '../codemirror-editor'
import { useCodeMirrorViewContext } from '../codemirror-context'
import {
wrapInDisplayMath,
wrapInInlineMath,

2
services/web/frontend/js/features/source-editor/components/toolbar/overflow.tsx
View file

@ -2,7 +2,7 @@ import { FC, LegacyRef, useRef } from 'react'
import { Button, Overlay, Popover } from 'react-bootstrap'
import classnames from 'classnames'
import Icon from '../../../../shared/components/icon'
import { useCodeMirrorViewContext } from '../codemirror-editor'
import { useCodeMirrorViewContext } from '../codemirror-context'
export const ToolbarOverflow: FC<{
overflowed: boolean

2
services/web/frontend/js/features/source-editor/components/toolbar/section-heading-dropdown.tsx
View file

@ -2,7 +2,7 @@ import classnames from 'classnames'
import {
useCodeMirrorStateContext,
useCodeMirrorViewContext,
} from '../codemirror-editor'
} from '../codemirror-context'
import {
findCurrentSectionHeadingLevel,
setSectionHeadingLevel,

2
services/web/frontend/js/features/source-editor/components/toolbar/table-inserter-dropdown.tsx
View file

@ -3,7 +3,7 @@ import * as commands from '../../extensions/toolbar/commands'
import { useTranslation } from 'react-i18next'
import useDropdown from '../../../../shared/hooks/use-dropdown'
import { Button, Overlay, Popover } from 'react-bootstrap'
import { useCodeMirrorViewContext } from '../codemirror-editor'
import { useCodeMirrorViewContext } from '../codemirror-context'
import Tooltip from '../../../../shared/components/tooltip'
import MaterialIcon from '../../../../shared/components/material-icon'
import classNames from 'classnames'

2
services/web/frontend/js/features/source-editor/components/toolbar/toolbar-button.tsx
View file

@ -1,6 +1,6 @@
import { memo, useCallback } from 'react'
import { EditorView } from '@codemirror/view'
import { useCodeMirrorViewContext } from '../codemirror-editor'
import { useCodeMirrorViewContext } from '../codemirror-context'
import { Button } from 'react-bootstrap'
import classnames from 'classnames'
import Tooltip from '../../../../shared/components/tooltip'

2
services/web/frontend/js/features/source-editor/hooks/use-codemirror-measurement.ts
View file

@ -1,5 +1,5 @@
import { useCallback, useState } from 'react'
import { useCodeMirrorViewContext } from '../components/codemirror-editor'
import { useCodeMirrorViewContext } from '../components/codemirror-context'
import { EditorView } from '@codemirror/view'
import useEventListener from '../../../shared/hooks/use-event-listener'

2
services/web/frontend/js/features/source-editor/hooks/use-included-file.ts
View file

@ -1,4 +1,4 @@
import { useCodeMirrorStateContext } from '@/features/source-editor/components/codemirror-editor'
import { useCodeMirrorStateContext } from '@/features/source-editor/components/codemirror-context'
import { useFileTreePathContext } from '@/features/file-tree/contexts/file-tree-path'
import { useEditorManagerContext } from '@/features/ide-react/context/editor-manager-context'
import { useCallback } from 'react'