Save and restore properties panel scroll position per instance/object

claude · claude · commit f91073b42e6b · 2026-02-27T10:13:49.000Z
- Add GetPersistentUuid to gd::Object (C++ header, IDL bindings, JS types) so objects can be identified by UUID like instances already can. - Call resetPersistentUuid() on objects in all copy/paste/duplicate/add paths (ObjectTreeViewItemContent, CustomObjectExtractor, EditorFunctions, InstallAsset) to ensure copied objects get unique UUIDs. - Rework setEditorStateForProject to accept partial updates (merges into existing state) instead of replacing the entire editor state. This allows propertiesPanelScroll to coexist with editorTabs without overwriting. - Add propertiesPanelScroll to PersistedEditorState, stored as an object keyed by instance/object persistent UUID mapping to scroll position. - In InstanceOrObjectPropertiesEditorContainer, save scroll position (debounced 500ms) and restore it when an instance or object is selected. https://claude.ai/code/session_01UiSsvtAFrmLrqVVPWSWmnu
diff --git a/Core/GDCore/Project/Object.h b/Core/GDCore/Project/Object.h
@@ -242,6 +242,12 @@ class GD_CORE_API Object {
    */
   Object& ResetPersistentUuid();
 
+  /**
+   * \brief Get the persistent UUID used to recognize
+   * the same object between serialization.
+   */
+  const gd::String& GetPersistentUuid() const { return persistentUuid; }
+
   /**
    * \brief Remove the persistent UUID - when the object no
    * longer need to be recognized between serializations.
diff --git a/GDevelop.js/Bindings/Bindings.idl b/GDevelop.js/Bindings/Bindings.idl
@@ -912,6 +912,7 @@ interface gdObject {
     void SerializeTo([Ref] SerializerElement element);
     void UnserializeFrom([Ref] Project project, [Const, Ref] SerializerElement element);
     [Ref] gdObject ResetPersistentUuid();
+    [Const, Ref] DOMString GetPersistentUuid();
     [Ref] gdObject ClearPersistentUuid();
 };
 
diff --git a/GDevelop.js/types/gdobject.js b/GDevelop.js/types/gdobject.js
@@ -20,6 +20,7 @@ declare class gdObject {
   serializeTo(element: gdSerializerElement): void;
   unserializeFrom(project: gdProject, element: gdSerializerElement): void;
   resetPersistentUuid(): gdObject;
+  getPersistentUuid(): string;
   clearPersistentUuid(): gdObject;
   delete(): void;
   ptr: number;
diff --git a/newIDE/app/src/AssetStore/InstallAsset.js b/newIDE/app/src/AssetStore/InstallAsset.js
@@ -285,6 +285,7 @@ export const addAssetToProject = async ({
     );
     // The name was overwritten after unserialization.
     object.setName(newName);
+    object.resetPersistentUuid();
     object.setAssetStoreId(asset.id);
     if (project.hasEventsBasedObject(object.getType())) {
       const customObjectConfiguration = gd.asCustomObjectConfiguration(
diff --git a/newIDE/app/src/EditorFunctions/index.js b/newIDE/app/src/EditorFunctions/index.js
@@ -1084,6 +1084,7 @@ const createOrReplaceObject: EditorFunction = {
         project
       );
       newObject.setName(targetObjectName); // Unserialization has overwritten the name.
+      newObject.resetPersistentUuid();
 
       // Update behaviors shared data for the scene where the object was duplicated.
       if (target_object_scope === 'global') {
diff --git a/newIDE/app/src/MainFrame/EditorTabs/UseEditorTabsStateSaving.js b/newIDE/app/src/MainFrame/EditorTabs/UseEditorTabsStateSaving.js
@@ -93,12 +93,10 @@ const useEditorTabsStateSaving = ({
           })),
       };
 
-      setEditorStateForProject(
-        currentProjectId,
-        editorState.editors.length === 0
-          ? undefined
-          : { editorTabs: editorState }
-      );
+      setEditorStateForProject(currentProjectId, {
+        editorTabs:
+          editorState.editors.length === 0 ? undefined : editorState,
+      });
     },
     [currentProjectId, editorTabs, setEditorStateForProject]
   );
@@ -127,7 +125,8 @@ const useEditorTabsStateSaving = ({
   const hasAPreviousSaveForEditorTabsState = React.useCallback(
     (project: gdProject) => {
       const projectId = project.getProjectUuid();
-      return !!getEditorStateForProject(projectId);
+      const editorState = getEditorStateForProject(projectId);
+      return !!editorState && !!editorState.editorTabs;
     },
     [getEditorStateForProject]
   );
@@ -136,7 +135,7 @@ const useEditorTabsStateSaving = ({
     (project: gdProject): number => {
       const projectId = project.getProjectUuid();
       const editorState = getEditorStateForProject(projectId);
-      if (!editorState) return 0;
+      if (!editorState || !editorState.editorTabs) return 0;
       let shouldOpenSavedCurrentTab = true;
 
       const editorsOpeningOptions = editorState.editorTabs.editors
diff --git a/newIDE/app/src/MainFrame/Preferences/PreferencesContext.js b/newIDE/app/src/MainFrame/Preferences/PreferencesContext.js
@@ -170,6 +170,11 @@ export const allAlertMessages: Array<{
   },
 ];
 
+export type PersistedEditorState = {
+  editorTabs?: EditorTabsPersistedState,
+  propertiesPanelScroll?: { [string]: number },
+};
+
 /**
  * All the preferences of GDevelop. To add a new preference, add it into this
  * type and add a setter into `Preferences` type. Then, update the
@@ -226,7 +231,7 @@ export type PreferencesValues = {|
     [featureId: string]: {| dates: [number] |},
   },
   displaySaveReminder: {| activated: boolean |}, // Store as object in case we need to add options.
-  editorStateByProject: { [string]: { editorTabs: EditorTabsPersistedState } },
+  editorStateByProject: { [string]: PersistedEditorState },
   fetchPlayerTokenForPreviewAutomatically: boolean,
   previewCrashReportUploadLevel: string,
   gamesDashboardOrderBy: GamesDashboardOrderBy,
@@ -344,12 +349,11 @@ export type Preferences = {|
     [featureId: string]: {| dates: [number] |},
   }) => void,
   setDisplaySaveReminder: ({| activated: boolean |}) => void,
-  getEditorStateForProject: (
-    projectId: string
-  ) => ?{| editorTabs: EditorTabsPersistedState |},
+  getEditorStateForProject: (projectId: string) => ?PersistedEditorState,
   setEditorStateForProject: (
     projectId: string,
-    editorState?: {| editorTabs: EditorTabsPersistedState |}
+    // $FlowFixMe[deprecated-utility]
+    editorStateUpdate: $Shape<PersistedEditorState>
   ) => void,
   setFetchPlayerTokenForPreviewAutomatically: (enabled: boolean) => void,
   setPreviewCrashReportUploadLevel: (level: string) => void,
diff --git a/newIDE/app/src/MainFrame/Preferences/PreferencesProvider.js b/newIDE/app/src/MainFrame/Preferences/PreferencesProvider.js
@@ -12,6 +12,7 @@ import {
   type PreferencesValues,
   type EditorMosaicName,
   type ProjectSpecificPreferencesValues,
+  type PersistedEditorState,
 } from './PreferencesContext';
 import type {
   ResourceKind,
@@ -21,7 +22,6 @@ import { type EditorMosaicNode } from '../../UI/EditorMosaic';
 import { type FileMetadataAndStorageProviderName } from '../../ProjectsStorage';
 import defaultShortcuts from '../../KeyboardShortcuts/DefaultShortcuts';
 import { type CommandName } from '../../CommandPalette/CommandsList';
-import { type EditorTabsPersistedState } from '../EditorTabs/EditorTabsHandler';
 import {
   getBrowserLanguageOrLocale,
   setLanguageInDOM,
@@ -1254,16 +1254,19 @@ export default class PreferencesProvider extends React.Component<Props, State> {
 
   _setEditorStateForProject(
     projectId: string,
-    editorState?: {| editorTabs: EditorTabsPersistedState |}
+    // $FlowFixMe[deprecated-utility]
+    editorStateUpdate: $Shape<PersistedEditorState>
   ) {
     this.setState(
       state => ({
         values: {
           ...state.values,
           editorStateByProject: {
             ...state.values.editorStateByProject,
-            // $FlowFixMe[incompatible-type]
-            [projectId]: editorState,
+            [projectId]: {
+              ...state.values.editorStateByProject[projectId],
+              ...editorStateUpdate,
+            },
           },
         },
       }),
diff --git a/newIDE/app/src/ObjectsList/ObjectTreeViewItemContent.js b/newIDE/app/src/ObjectsList/ObjectTreeViewItemContent.js
@@ -161,6 +161,7 @@ export const addSerializedObjectToObjectsContainer = ({
     project
   );
   newObject.setName(newName); // Unserialization has overwritten the name.
+  newObject.resetPersistentUuid();
 
   return { object: newObject, global };
 };
diff --git a/newIDE/app/src/SceneEditor/CustomObjectExtractor/CustomObjectExtractor.js b/newIDE/app/src/SceneEditor/CustomObjectExtractor/CustomObjectExtractor.js
@@ -115,6 +115,7 @@ export const extractAsCustomObject = ({
           'unserializeFrom',
           project
         );
+        childObject.resetPersistentUuid();
       }
     }
     newEventsBasedObject.markAsRenderedIn3D(!!isRenderedIn3D);
diff --git a/newIDE/app/src/SceneEditor/InstanceOrObjectPropertiesEditorContainer.js b/newIDE/app/src/SceneEditor/InstanceOrObjectPropertiesEditorContainer.js
@@ -16,6 +16,9 @@ import { type ResourceManagementProps } from '../ResourcesList/ResourceSource';
 import { CompactLayerPropertiesEditor } from '../LayersList/CompactLayerPropertiesEditor';
 import { CompactEventsBasedObjectVariantPropertiesEditor } from '../SceneEditor/CompactEventsBasedObjectVariantPropertiesEditor';
 import Rectangle from '../Utils/Rectangle';
+import PreferencesContext from '../MainFrame/Preferences/PreferencesContext';
+
+const SCROLL_SAVE_DELAY = 500;
 
 export const styles = {
   paper: {
@@ -96,16 +99,10 @@ export const InstanceOrObjectPropertiesEditorContainer: React.ComponentType<{
 }> = React.forwardRef<Props, InstanceOrObjectPropertiesEditorInterface>(
   (props, ref) => {
     const forceUpdate = useForceUpdate();
-    // $FlowFixMe[incompatible-type]
-    React.useImperativeHandle(ref, () => ({
-      forceUpdate,
-      getEditorTitle: () =>
-        lastSelectionType === 'instance' ? (
-          <Trans>Instance properties</Trans>
-        ) : (
-          <Trans>Object properties</Trans>
-        ),
-    }));
+    const {
+      setEditorStateForProject,
+      getEditorStateForProject,
+    } = React.useContext(PreferencesContext);
 
     const {
       project,
@@ -158,8 +155,105 @@ export const InstanceOrObjectPropertiesEditorContainer: React.ComponentType<{
       globalObjectsContainer,
     } = props;
 
+    // $FlowFixMe[incompatible-type]
+    React.useImperativeHandle(ref, () => ({
+      forceUpdate,
+      getEditorTitle: () =>
+        lastSelectionType === 'instance' ? (
+          <Trans>Instance properties</Trans>
+        ) : (
+          <Trans>Object properties</Trans>
+        ),
+    }));
+
+    // Scroll position save/restore for properties panel.
+    const scrollContainerRef = React.useRef<?HTMLDivElement>(null);
+    const saveTimeoutRef = React.useRef<?TimeoutID>(null);
+
+    const uniqueId =
+      instances.length > 0 && lastSelectionType === 'instance'
+        ? instances[0].getPersistentUuid()
+        : objects.length > 0 && lastSelectionType === 'object'
+        ? objects[0].getPersistentUuid()
+        : null;
+    const projectId = project.getProjectUuid();
+
+    // Find the first scrollable child element (the ScrollView div).
+    const findScrollableChild = React.useCallback(
+      (container: ?HTMLDivElement): ?HTMLElement => {
+        if (!container) return null;
+        const children = container.getElementsByTagName('*');
+        for (let i = 0; i < children.length; i++) {
+          const el = children[i];
+          if (
+            el instanceof HTMLElement &&
+            (el.style.overflowY === 'auto' || el.style.overflowY === 'scroll')
+          ) {
+            return el;
+          }
+        }
+        return null;
+      },
+      []
+    );
+
+    // Set up scroll listener and restore scroll position when entity changes.
+    React.useLayoutEffect(
+      () => {
+        if (!uniqueId) return;
+
+        const scrollable = findScrollableChild(scrollContainerRef.current);
+        if (!scrollable) return;
+
+        // Restore saved scroll position.
+        const editorState = getEditorStateForProject(projectId);
+        const savedScroll =
+          editorState &&
+          editorState.propertiesPanelScroll &&
+          editorState.propertiesPanelScroll[uniqueId];
+        if (savedScroll != null) {
+          scrollable.scrollTop = savedScroll;
+        }
+
+        // Save scroll position on scroll events.
+        const handleScroll = () => {
+          if (saveTimeoutRef.current) clearTimeout(saveTimeoutRef.current);
+          saveTimeoutRef.current = setTimeout(() => {
+            const currentEditorState = getEditorStateForProject(projectId);
+            const currentScrolls =
+              (currentEditorState &&
+                currentEditorState.propertiesPanelScroll) ||
+              {};
+            setEditorStateForProject(projectId, {
+              propertiesPanelScroll: {
+                ...currentScrolls,
+                [uniqueId]: scrollable.scrollTop,
+              },
+            });
+          }, SCROLL_SAVE_DELAY);
+        };
+
+        scrollable.addEventListener('scroll', handleScroll);
+        return () => {
+          scrollable.removeEventListener('scroll', handleScroll);
+          if (saveTimeoutRef.current) clearTimeout(saveTimeoutRef.current);
+        };
+      },
+      // eslint-disable-next-line react-hooks/exhaustive-deps
+      [uniqueId]
+    );
+
     return (
       <Paper background="dark" square style={styles.paper}>
+        <div
+          ref={scrollContainerRef}
+          style={{
+            display: 'flex',
+            flex: 1,
+            minWidth: 0,
+            flexDirection: 'column',
+          }}
+        >
         {!!instances.length && lastSelectionType === 'instance' ? (
           <CompactInstancePropertiesEditor
             instances={instances}
@@ -241,6 +335,7 @@ export const InstanceOrObjectPropertiesEditorContainer: React.ComponentType<{
             </Trans>
           </EmptyMessage>
         )}
+        </div>
       </Paper>
     );
   }

Original file line number	Diff line number	Diff line change
`@@ -115,6 +115,7 @@ export const extractAsCustomObject = ({`
`115`	`115`	`'unserializeFrom',`
`116`	`116`	`project`
`117`	`117`	`);`
	`118`	`+ childObject.resetPersistentUuid();`
`118`	`119`	`}`
`119`	`120`	`}`
`120`	`121`	`newEventsBasedObject.markAsRenderedIn3D(!!isRenderedIn3D);`