[web] Recreate workbench with Overleaf styles (#29651)

GitOrigin-RevId: 52ca336f70b29edf6e39cf95aa164f3ae32c0a79

services/web/frontend/js/shared/context/editor-selection-context.tsx

@@ -0,0 +1,47 @@
+import {
+  createContext,
+  type Dispatch,
+  type FC,
+  type PropsWithChildren,
+  type SetStateAction,
+  useContext,
+  useMemo,
+  useState,
+} from 'react'
+import type { EditorSelection } from '@codemirror/state'
+
+export const EditorSelectionContext = createContext<
+  | {
+      editorSelection: EditorSelection | undefined
+      setEditorSelection: Dispatch<SetStateAction<EditorSelection | undefined>>
+    }
+  | undefined
+>(undefined)
+
+export const EditorSelectionProvider: FC<PropsWithChildren> = ({
+  children,
+}) => {
+  const [editorSelection, setEditorSelection] = useState<EditorSelection>()
+
+  const value = useMemo(() => {
+    return { editorSelection, setEditorSelection }
+  }, [editorSelection])
+
+  return (
+    <EditorSelectionContext.Provider value={value}>
+      {children}
+    </EditorSelectionContext.Provider>
+  )
+}
+
+export const useEditorSelectionContext = () => {
+  const context = useContext(EditorSelectionContext)
+
+  if (!context) {
+    throw new Error(
+      'useEditorSelectionContext is only available inside EditorSelectionProvider'
+    )
+  }
+
+  return context
+}