Remove disabling update while listening on socket (ignoreUpdates state) since the logic is more complicated that was originally thought and it will be tested/revisited on a different PR

GitOrigin-RevId: 70cee2f0fc565aaebfb3ead2dd1a58fc5371c816

services/web/frontend/js/features/editor-left-menu/context/project-settings-context.tsx

@@ -1,4 +1,4 @@
-import { createContext, useContext, useMemo, useState } from 'react'
+import { createContext, useContext, useMemo } from 'react'
 import type { PropsWithChildren } from 'react'
 import type {
   FontFamily,
@@ -52,8 +52,6 @@ export const ProjectSettingsContext = createContext<
 export function ProjectSettingsProvider({
   children,
 }: PropsWithChildren<Record<string, never>>) {
-  const [ignoreUpdates, setIgnoreUpdates] = useState(false)
-
   const {
     compiler,
     setCompiler,
@@ -63,7 +61,7 @@ export function ProjectSettingsProvider({
     setRootDocId,
     spellCheckLanguage,
     setSpellCheckLanguage,
-  } = useSetProjectWideSettings({ ignoreUpdates })
+  } = useSetProjectWideSettings()
 
   const {
     autoComplete,
@@ -88,9 +86,7 @@ export function ProjectSettingsProvider({
     setPdfViewer,
   } = useUserWideSettings()
 
-  useProjectWideSettingsSocketListener({
+  useProjectWideSettingsSocketListener()
-    onListen: () => setIgnoreUpdates(true),
-  })
 
   const value: ProjectSettingsContextValue = useMemo(
     () => ({

services/web/frontend/js/features/editor-left-menu/hooks/use-project-wide-settings-socket-listener.tsx

@@ -2,51 +2,45 @@ import { useCallback, useEffect } from 'react'
 import { ProjectCompiler } from '../../../../../types/project-settings'
 import { useIdeContext } from '../../../shared/context/ide-context'
 import useScopeValue from '../../../shared/hooks/use-scope-value'
+import type { ProjectSettingsScope } from '../utils/api'
 
-type UseProjectWideSettingsSocketListener = {
+export default function useProjectWideSettingsSocketListener() {
-  onListen: () => void
-}
-
-export default function useProjectWideSettingsSocketListener({
-  onListen,
-}: UseProjectWideSettingsSocketListener) {
   const ide = useIdeContext()
 
-  const [compilerScope, setCompilerScope] =
+  const [projectScope, setProjectScope] = useScopeValue<
-    useScopeValue<ProjectCompiler>('project.compiler')
+    ProjectSettingsScope | undefined
-  const [imageNameScope, setImageNameScope] =
+  >('project', true)
-    useScopeValue<string>('project.imageName')
-  const [spellCheckLanguageScope, setSpellCheckLanguageScope] =
-    useScopeValue<string>('project.spellCheckLanguage')
 
   const setCompiler = useCallback(
     (compiler: ProjectCompiler) => {
-      onListen()
+      if (projectScope) {
-      setCompilerScope(compiler)
+        setProjectScope({ ...projectScope, compiler })
+      }
     },
-    [setCompilerScope, onListen]
+    [projectScope, setProjectScope]
   )
 
   const setImageName = useCallback(
     (imageName: string) => {
-      onListen()
+      if (projectScope) {
-      setImageNameScope(imageName)
+        setProjectScope({ ...projectScope, imageName })
+      }
     },
-    [setImageNameScope, onListen]
+    [projectScope, setProjectScope]
   )
 
   const setSpellCheckLanguage = useCallback(
     (spellCheckLanguage: string) => {
-      onListen()
+      if (projectScope) {
-      setSpellCheckLanguageScope(spellCheckLanguage)
+        setProjectScope({ ...projectScope, spellCheckLanguage })
+      }
     },
-    [setSpellCheckLanguageScope, onListen]
+    [projectScope, setProjectScope]
   )
 
   useEffect(() => {
     // data is not available on initial mounting
-    const dataAvailable =
+    const dataAvailable = !!projectScope
-      compilerScope && imageNameScope && spellCheckLanguageScope
 
     if (dataAvailable && ide?.socket) {
       ide.socket.on('compilerUpdated', setCompiler)
@@ -63,11 +57,9 @@ export default function useProjectWideSettingsSocketListener({
     }
   }, [
     ide?.socket,
-    compilerScope,
+    projectScope,
     setCompiler,
-    imageNameScope,
     setImageName,
-    spellCheckLanguageScope,
     setSpellCheckLanguage,
   ])
 }

services/web/frontend/js/features/editor-left-menu/hooks/use-set-project-wide-settings.tsx

@@ -6,13 +6,7 @@ import { ProjectSettingsScope, saveProjectSettings } from '../utils/api'
 import useSetRootDocId from './use-set-root-doc-id'
 import useSetSpellCheckLanguage from './use-set-spell-check-language'
 
-type UseSetProjectWideSettings = {
+export default function useSetProjectWideSettings() {
-  ignoreUpdates: boolean
-}
-
-export default function useSetProjectWideSettings({
-  ignoreUpdates,
-}: UseSetProjectWideSettings) {
   // The value will be undefined on mount
   const [project, setProject] = useScopeValue<ProjectSettingsScope | undefined>(
     'project',
@@ -22,30 +16,30 @@ export default function useSetProjectWideSettings({
 
   const setCompiler = useCallback(
     (compiler: ProjectCompiler) => {
-      const allowUpdate = !ignoreUpdates && project?.compiler
+      const allowUpdate = project?.compiler
 
       if (allowUpdate) {
         setProject({ ...project, compiler })
         saveProjectSettings({ projectId, compiler })
       }
     },
-    [projectId, project, setProject, ignoreUpdates]
+    [projectId, project, setProject]
   )
 
   const setImageName = useCallback(
     (imageName: string) => {
-      const allowUpdate = !ignoreUpdates && project?.imageName
+      const allowUpdate = project?.imageName
 
       if (allowUpdate) {
         setProject({ ...project, imageName })
         saveProjectSettings({ projectId, imageName })
       }
     },
-    [projectId, project, setProject, ignoreUpdates]
+    [projectId, project, setProject]
   )
 
-  const setRootDocId = useSetRootDocId({ ignoreUpdates })
+  const setRootDocId = useSetRootDocId()
-  const setSpellCheckLanguage = useSetSpellCheckLanguage({ ignoreUpdates })
+  const setSpellCheckLanguage = useSetSpellCheckLanguage()
 
   return {
     compiler: project?.compiler,

services/web/frontend/js/features/editor-left-menu/hooks/use-set-root-doc-id.tsx

@@ -4,11 +4,7 @@ import { useProjectContext } from '../../../shared/context/project-context'
 import useScopeValue from '../../../shared/hooks/use-scope-value'
 import { saveProjectSettings } from '../utils/api'
 
-type UseSetRootDocId = {
+export default function useSetRootDocId() {
-  ignoreUpdates: boolean
-}
-
-export default function useSetRootDocId({ ignoreUpdates }: UseSetRootDocId) {
   const [rootDocIdScope, setRootDocIdScope] =
     useScopeValue<string>('project.rootDoc_id')
   const { permissionsLevel } = useEditorContext()
@@ -17,7 +13,6 @@ export default function useSetRootDocId({ ignoreUpdates }: UseSetRootDocId) {
   const setRootDocId = useCallback(
     async (rootDocId: string) => {
       const allowUpdate =
-        !ignoreUpdates &&
         typeof rootDocIdScope !== 'undefined' &&
         permissionsLevel !== 'readOnly' &&
         rootDocIdScope !== rootDocId
@@ -31,13 +26,7 @@ export default function useSetRootDocId({ ignoreUpdates }: UseSetRootDocId) {
         }
       }
     },
-    [
+    [permissionsLevel, projectId, rootDocIdScope, setRootDocIdScope]
-      permissionsLevel,
-      projectId,
-      rootDocIdScope,
-      setRootDocIdScope,
-      ignoreUpdates,
-    ]
   )
   return setRootDocId
 }

services/web/frontend/js/features/editor-left-menu/hooks/use-set-spell-check-language.tsx

@@ -4,13 +4,7 @@ import { useProjectContext } from '../../../shared/context/project-context'
 import useScopeValue from '../../../shared/hooks/use-scope-value'
 import { saveProjectSettings, saveUserSettings } from '../utils/api'
 
-type UseSetSpellCheckLanguage = {
+export default function useSetSpellCheckLanguage() {
-  ignoreUpdates: boolean
-}
-
-export default function useSetSpellCheckLanguage({
-  ignoreUpdates,
-}: UseSetSpellCheckLanguage) {
   const [spellCheckLanguageScope, setSpellCheckLanguageScope] =
     useScopeValue<string>('project.spellCheckLanguage')
   const { _id: projectId } = useProjectContext()
@@ -18,9 +12,7 @@ export default function useSetSpellCheckLanguage({
   const setSpellCheckLanguage = useCallback(
     (spellCheckLanguage: string) => {
       const allowUpdate =
-        !ignoreUpdates &&
+        spellCheckLanguage && spellCheckLanguage !== spellCheckLanguageScope
-        spellCheckLanguage &&
-        spellCheckLanguage !== spellCheckLanguageScope
 
       if (allowUpdate) {
         sendMB('setting-changed', {
@@ -35,12 +27,7 @@ export default function useSetSpellCheckLanguage({
         saveUserSettings({ spellCheckLanguage })
       }
     },
-    [
+    [projectId, setSpellCheckLanguageScope, spellCheckLanguageScope]
-      projectId,
-      setSpellCheckLanguageScope,
-      spellCheckLanguageScope,
-      ignoreUpdates,
-    ]
   )
 
   return setSpellCheckLanguage