Show scene properties and variables in the side panel

GDevelop.js/Bindings/Bindings.idl

@@ -846,6 +846,9 @@ interface BehaviorsSharedData {
     boolean UpdateProperty([Const] DOMString name, [Const] DOMString value);
     void InitializeContent();
 
+    boolean IsFolded();
+    void SetFolded(boolean folded);
+
     [Ref] QuickCustomizationVisibilitiesContainer GetPropertiesQuickCustomizationVisibilities();
 };
 

GDevelop.js/types.d.ts

@@ -742,6 +742,8 @@ export class BehaviorsSharedData extends EmscriptenObject {
   getProperties(): MapStringPropertyDescriptor;
   updateProperty(name: string, value: string): boolean;
   initializeContent(): void;
+  isFolded(): boolean;
+  setFolded(folded: boolean): void;
   getPropertiesQuickCustomizationVisibilities(): QuickCustomizationVisibilitiesContainer;
 }
 

GDevelop.js/types/gdbehaviorsshareddata.js

@@ -7,6 +7,8 @@ declare class gdBehaviorsSharedData {
   getProperties(): gdMapStringPropertyDescriptor;
   updateProperty(name: string, value: string): boolean;
   initializeContent(): void;
+  isFolded(): boolean;
+  setFolded(folded: boolean): void;
   getPropertiesQuickCustomizationVisibilities(): gdQuickCustomizationVisibilitiesContainer;
   delete(): void;
   ptr: number;

newIDE/app/src/EventsSheet/index.js

@@ -541,7 +541,7 @@ export class EventsSheetComponentWithoutHandle extends React.Component<
         onToggleSearchPanel={this._toggleSearchPanel}
         canMoveEventsIntoNewGroup={hasSomethingSelected(this.state.selection)}
         moveEventsIntoNewGroup={this.moveEventsIntoNewGroup}
-        onOpenSceneVariables={this.editLayoutVariables}
+        onOpenSceneVariables={this.openSceneVariables}
       />
     );
   }
@@ -856,7 +856,7 @@ export class EventsSheetComponentWithoutHandle extends React.Component<
     });
   };
 
-  editLayoutVariables = (open: boolean = true) => {
+  openSceneVariables = (open: boolean = true) => {
     this.setState({ layoutVariablesDialogOpen: open });
   };
 
@@ -2765,8 +2765,8 @@ export class EventsSheetComponentWithoutHandle extends React.Component<
           <GlobalAndSceneVariablesDialog
             projectScopedContainersAccessor={projectScopedContainersAccessor}
             open
-            onCancel={() => this.editLayoutVariables(false)}
-            onApply={() => this.editLayoutVariables(false)}
+            onCancel={() => this.openSceneVariables(false)}
+            onApply={() => this.openSceneVariables(false)}
             hotReloadPreviewButtonProps={hotReloadPreviewButtonProps}
             isListLocked={false}
           />

newIDE/app/src/LayersList/CompactLayerPropertiesEditor/index.js

@@ -221,7 +221,6 @@ export const CompactLayerPropertiesEditor = ({
                     schema={layerPropertiesSchema}
                     instances={[layer]}
                     onInstancesModified={onLayersModified}
-                    // $FlowFixMe[incompatible-type]
                     onRefreshAllFields={forceRecomputeSchema}
                   />
                 </ColumnStackLayout>

newIDE/app/src/ObjectEditor/CompactObjectPropertiesEditor/ChildObjectPropertiesEditor.js

@@ -89,7 +89,6 @@ export const ChildObjectPropertiesEditor = ({
         onInstancesModified={() => {
           // TODO: undo/redo?
         }}
-        // $FlowFixMe[incompatible-type]
         onRefreshAllFields={forceRecomputeSchema}
         placeholder={<Trans>This object has no properties.</Trans>}
         customizeBasicSchema={schema =>

newIDE/app/src/ObjectEditor/CompactObjectPropertiesEditor/CompactBehaviorPropertiesEditor.js

@@ -124,8 +124,6 @@ export const CompactBehaviorPropertiesEditor = ({
   onBehaviorUpdated,
   resourceManagementProps,
 }: CompactBehaviorPropertiesEditorProps): React.Node => {
-  const fullEditorLabel = behaviorMetadata.getOpenFullEditorLabel();
-
   const [schemaRecomputeTrigger, forceRecomputeSchema] = useForceRecompute();
 
   const propertiesSchema = React.useMemo(
@@ -194,13 +192,12 @@ export const CompactBehaviorPropertiesEditor = ({
             ? schema =>
                 getSchemaWithOpenFullEditorButton({
                   schema,
-                  fullEditorLabel,
+                  fullEditorLabel: behaviorMetadata.getOpenFullEditorLabel(),
                   behavior,
                   onOpenFullEditor,
                 })
             : null
         }
-        // $FlowFixMe[incompatible-type]
         onRefreshAllFields={forceRecomputeSchema}
       />
     </ColumnStackLayout>

newIDE/app/src/ObjectEditor/CompactObjectPropertiesEditor/CompactBehaviorPropertiesEditorProps.flow.js

@@ -8,7 +8,7 @@ export type CompactBehaviorPropertiesEditorProps = {|
   project: gdProject,
   behaviorMetadata: gdBehaviorMetadata,
   behavior: gdBehavior,
-  object: gdObject,
+  object: gdObject | null,
   behaviorOverriding: gdBehavior | null,
   initialInstance: gdInitialInstance | null,
   onOpenFullEditor?: () => void,

newIDE/app/src/ObjectEditor/CompactObjectPropertiesEditor/index.js

@@ -605,7 +605,6 @@ export const CompactObjectPropertiesEditor = ({
                       onEditObject,
                     })
                   }
-                  // $FlowFixMe[incompatible-type]
                   onRefreshAllFields={forceRecomputeSchema}
                 />
                 {shouldDisplayVariant && (

newIDE/app/src/ProjectManager/SceneTreeViewItemContent.js

@@ -52,7 +52,7 @@ export type SceneTreeViewItemProps = {|
   ...SceneTreeViewItemCommonProps,
   project: gdProject,
   onOpenLayoutProperties: (layout: ?gdLayout) => void,
-  onOpenLayoutVariables: (layout: ?gdLayout) => void,
+  openSceneVariables: (layout: ?gdLayout) => void,
 |};
 
 export const getSceneTreeViewItemId = (scene: gdLayout): string => {
@@ -153,7 +153,7 @@ export class SceneTreeViewItemContent implements TreeViewItemContent {
       {
         label: i18n._(t`Edit scene variables`),
         enabled: true,
-        click: () => this.props.onOpenLayoutVariables(this.scene),
+        click: () => this.props.openSceneVariables(this.scene),
       },
       {
         label: i18n._(t`Set as start scene`),

newIDE/app/src/ProjectManager/index.js

@@ -600,7 +600,7 @@ const ProjectManager = React.forwardRef<Props, ProjectManagerInterface>(
     const onOpenLayoutProperties = React.useCallback((layout: ?gdLayout) => {
       setEditedPropertiesLayout(layout);
     }, []);
-    const onOpenLayoutVariables = React.useCallback((layout: ?gdLayout) => {
+    const openSceneVariables = React.useCallback((layout: ?gdLayout) => {
       setEditedVariablesLayout(layout);
     }, []);
 
@@ -906,7 +906,7 @@ const ProjectManager = React.forwardRef<Props, ProjectManagerInterface>(
               onRenameLayout,
               onOpenLayout,
               onOpenLayoutProperties,
-              onOpenLayoutVariables,
+              openSceneVariables,
             }
           : null,
       [
@@ -924,7 +924,7 @@ const ProjectManager = React.forwardRef<Props, ProjectManagerInterface>(
         onRenameLayout,
         onOpenLayout,
         onOpenLayoutProperties,
-        onOpenLayoutVariables,
+        openSceneVariables,
       ]
     );
 
@@ -1480,7 +1480,7 @@ const ProjectManager = React.forwardRef<Props, ProjectManagerInterface>(
                         }}
                         onClose={() => onOpenLayoutProperties(null)}
                         onEditVariables={() => {
-                          onOpenLayoutVariables(editedPropertiesLayout);
+                          openSceneVariables(editedPropertiesLayout);
                           onOpenLayoutProperties(null);
                         }}
                         resourceManagementProps={resourceManagementProps}
@@ -1497,10 +1497,10 @@ const ProjectManager = React.forwardRef<Props, ProjectManagerInterface>(
                       open
                       project={project}
                       layout={editedVariablesLayout}
-                      onCancel={() => onOpenLayoutVariables(null)}
+                      onCancel={() => openSceneVariables(null)}
                       onApply={() => {
                         triggerUnsavedChanges();
-                        onOpenLayoutVariables(null);
+                        openSceneVariables(null);
                       }}
                       hotReloadPreviewButtonProps={hotReloadPreviewButtonProps}
                       isListLocked={false}

newIDE/app/src/QuickCustomization/QuickBehaviorsTweaker.js

@@ -61,7 +61,6 @@ const QuickBehaviorPropertiesEditor = ({
         instances={[behavior]}
         onInstancesModified={onBehaviorUpdated}
         resourceManagementProps={resourceManagementProps}
-        // $FlowFixMe[incompatible-type]
         onRefreshAllFields={forceRecomputeSchema}
       />
     </Column>

newIDE/app/src/SceneEditor/CompactScenePropertiesEditor/CompactBehaviorSharedDataPropertiesEditor.js

@@ -0,0 +1,63 @@
+// @flow
+import * as React from 'react';
+import { ColumnStackLayout } from '../../UI/Layout';
+import { Trans } from '@lingui/macro';
+import { CompactPropertiesEditorByVisibility } from '../../CompactPropertiesEditor/CompactPropertiesEditorByVisibility';
+import propertiesMapToSchema from '../../PropertiesEditor/PropertiesMapToSchema';
+import { useForceRecompute } from '../../Utils/UseForceUpdate';
+import { type ResourceManagementProps } from '../../ResourcesList/ResourceSource';
+
+type CompactBehaviorPropertiesEditorProps = {|
+  project: gdProject,
+  behaviorMetadata: gdBehaviorMetadata,
+  behaviorSharedData: gdBehaviorsSharedData,
+  resourceManagementProps: ResourceManagementProps,
+  isAdvancedSectionInitiallyUncollapsed?: boolean,
+|};
+
+export const CompactBehaviorSharedDataPropertiesEditor = ({
+  project,
+  behaviorMetadata,
+  behaviorSharedData,
+  resourceManagementProps,
+}: CompactBehaviorPropertiesEditorProps): React.Node => {
+  const [schemaRecomputeTrigger, forceRecomputeSchema] = useForceRecompute();
+
+  const propertiesSchema = React.useMemo(
+    () => {
+      if (schemaRecomputeTrigger) {
+        // schemaRecomputeTrigger allows to invalidate the schema when required.
+      }
+      const behaviorMetadataSharedProperties = behaviorMetadata.getSharedProperties();
+      return propertiesMapToSchema({
+        properties: behaviorMetadataSharedProperties,
+        defaultValueProperties: behaviorMetadataSharedProperties,
+        getPropertyValue: (instance, name) =>
+          instance
+            .getProperties()
+            .get(name)
+            .getValue(),
+        onUpdateProperty: (instance, name, value) => {
+          instance.updateProperty(name, value);
+        },
+        object: null,
+        visibility: 'All',
+      });
+    },
+    [schemaRecomputeTrigger, behaviorMetadata]
+  );
+
+  return (
+    <ColumnStackLayout expand noMargin noOverflowParent>
+      <CompactPropertiesEditorByVisibility
+        project={project}
+        object={null}
+        schema={propertiesSchema}
+        instances={[behaviorSharedData]}
+        resourceManagementProps={resourceManagementProps}
+        placeholder={<Trans>Nothing to configure for this behavior.</Trans>}
+        onRefreshAllFields={forceRecomputeSchema}
+      />
+    </ColumnStackLayout>
+  );
+};