Add EditorState to PA YAML schema to support editor UI ordering (#743)

Author: jamevaalet

schemas/pa-yaml/v3.0/pa.schema.yaml

@@ -16,6 +16,8 @@ properties:
     $ref: "#/definitions/ComponentDefinitions-name-instance-map"
   DataSources:
     $ref: "#/definitions/DataSources-name-instance-map"
+  EditorState:
+    $ref: "#/definitions/EditorState"
 
 defaultSnippets:
   - label: App
@@ -503,6 +505,22 @@ definitions:
     additionalProperties:
       $ref: "#/definitions/pfx-formula"
 
+  EditorState:
+    description: Represents metadata related to the editor state of the application that enhances the editing experience.
+    type: object
+    additionalProperties: false
+    properties:
+      ScreensOrder:
+        description: Ordered list of screen names representing the order in the editor.
+        type: array
+        items:
+          $ref: "#/definitions/Screen-name"
+      ComponentDefinitionsOrder:
+        description: Ordered list of component definition names representing the order in the editor.
+        type: array
+        items:
+          $ref: "#/definitions/ComponentDefinition-name"
+
   entity-name:
     description: The base requirements for a named entity in an app.
     type: string

src/Persistence.Tests/PaYaml/Serialization/PaYamlSerializerTests.cs

@@ -191,6 +191,7 @@ public void DeserializeDuplicateControlNamesShouldFail()
     [DataRow(@"_TestData/SchemaV3_0/FullSchemaUses/Screens-general-controls.pa.yaml")]
     [DataRow(@"_TestData/SchemaV3_0/FullSchemaUses/Screens-with-components.pa.yaml")]
     [DataRow(@"_TestData/SchemaV3_0/Examples/Src/DataSources/Dataversedatasources1.pa.yaml")]
+    [DataRow(@"_TestData/SchemaV3_0/Examples/Src/_EditorState.pa.yaml")]
     public void RoundTripFromYaml(string path)
     {
         var originalYaml = File.ReadAllText(path);

src/Persistence/PaYaml/Models/SchemaV3/EditorStateInstance.cs

@@ -0,0 +1,11 @@
+// Copyright (c) Microsoft Corporation.
+// Licensed under the MIT License.
+
+namespace Microsoft.PowerPlatform.PowerApps.Persistence.PaYaml.Models.SchemaV3;
+
+public record EditorStateInstance
+{
+    public string[]? ScreensOrder { get; init; }
+
+    public string[]? ComponentDefinitionsOrder { get; init; }
+}

src/Persistence/PaYaml/Models/SchemaV3/PaModule.cs

@@ -15,4 +15,6 @@ public record PaModule
     public NamedObjectMapping<ScreenInstance>? Screens { get; init; }
 
     public NamedObjectMapping<DataSourceInstance>? DataSources { get; init; }
+
+    public EditorStateInstance? EditorState { get; init; }
 }

src/schemas-tests/pa-yaml/v3.0/Examples/Src/_EditorState.pa.yaml

@@ -0,0 +1,8 @@
+EditorState:
+  ScreensOrder:
+    - FirstScreen
+    - SecondScreen
+    - ThirdScreen
+  ComponentDefinitionsOrder:
+    - FirstComponent
+    - SecondComponent

src/schemas-tests/pa-yaml/v3.0/FullSchemaUses/EditorStateSample.pa.yaml

@@ -0,0 +1,69 @@
+App:
+  Properties:
+    StartScreen: =Screen1
+
+Screens:
+  Screen1:
+    Properties:
+      Fill: =RGBA(255, 255, 255, 1)
+    Children:
+      - Button1:
+          Control: Button
+          Properties:
+            Text: ="Navigate to Screen2"
+            OnSelect: =Navigate(Screen2)
+            X: =40
+            Y: =40
+  Screen3:
+    Properties:
+      Fill: =RGBA(240, 240, 240, 1)
+    Children:
+      - Label1:
+          Control: Label
+          Properties:
+            Text: ="This is Screen3"
+            X: =40
+            Y: =40
+  Screen2:
+    Properties:
+      Fill: =RGBA(245, 245, 245, 1)
+    Children:
+      - Button2:
+          Control: Button
+          Properties:
+            Text: ="Navigate to Screen3"
+            OnSelect: =Navigate(Screen3)
+            X: =40
+            Y: =40
+
+ComponentDefinitions:
+  Component2:
+    DefinitionType: CanvasComponent
+    Properties:
+      Height: =50
+      Width: =200
+    Children:
+      - Label1:
+          Control: Label
+          Properties:
+            Text: ="Component 2"
+  Component1:
+    DefinitionType: CanvasComponent
+    Properties:
+      Height: =100
+      Width: =250
+    Children:
+      - Label1:
+          Control: Label
+          Properties:
+            Text: ="Component 1"
+
+EditorState:
+  ScreensOrder:
+    - Screen1
+    - Screen2
+    - Screen3
+  
+  ComponentDefinitionsOrder:
+    - Component1
+    - Component2

src/schemas/pa-yaml/v3.0/pa.schema.yaml

@@ -21,6 +21,8 @@ properties:
     $ref: "#/definitions/ComponentDefinitions-name-instance-map"
   DataSources:
     $ref: "#/definitions/DataSources-name-instance-map"
+  EditorState:
+    $ref: "#/definitions/EditorState"
 
 defaultSnippets:
   - label: App
@@ -541,6 +543,22 @@ definitions:
     additionalProperties:
       $ref: "#/definitions/pfx-formula"
 
+  EditorState:
+    description: Represents metadata related to the editor state of the application that enhances the editing experience.
+    type: object
+    additionalProperties: false
+    properties:
+      ScreensOrder:
+        description: Ordered list of screen names representing the order in the editor.
+        type: array
+        items:
+          $ref: "#/definitions/Screen-name"
+      ComponentDefinitionsOrder:
+        description: Ordered list of component definition names representing the order in the editor.
+        type: array
+        items:
+          $ref: "#/definitions/ComponentDefinition-name"
+
   entity-name:
     # aka: DName
     description: The base requirements for a named entity in an app.