Fix backend part of property editor docs

14/umbraco-cms/extending/property-editors/README.md

@@ -4,6 +4,10 @@ description: Guide on how to work with and create Property Editors in Umbraco
 
 # Property Editors
 
+{% hint style="info" %}
+[This tutorial](../../tutorials/creating-a-property-editor/README.md) contains step-by-step instructions for building a custom Property editor.
+{% endhint %}
+
 {% hint style="warning" %}
 The Property Editor articles are a work in progress and may undergo further revisions, updates, or amendments. The information contained herein is subject to change without notice.
 {% endhint %}
@@ -36,5 +40,5 @@ Learn how to extend Property editors to track entity references inside the prope
 
 ## More information
 
-* [Built in Property Editors](../../fundamentals/backoffice/property-editors/built-in-umbraco-property-editors/)
-* [Creating a property editor](../../tutorials/creating-a-property-editor/)
+* [Built in Property Editors](../../fundamentals/backoffice/property-editors/built-in-umbraco-property-editors/README.md)
+* [Creating a property editor](../../tutorials/creating-a-property-editor/README.md)

14/umbraco-cms/extending/property-editors/build-a-block-editor.md

@@ -4,44 +4,63 @@
 This page is a work in progress and may undergo further revisions, updates, or amendments. The information contained herein is subject to change without notice.
 {% endhint %}
 
-Before reading this document we highly recommend that you familiarise yourself with[the basics of developing a custom Property Editor for Umbraco](../../tutorials/creating-a-property-editor/).
-
-{% hint style="info" %}
-[Click here for an overview with a working example and references back to the relevant documention.](https://umbraco.com/blog/deep-dive-the-block-list-editor/)
-{% endhint %}
+Before reading this document we highly recommend that you familiarise yourself with [the basics of developing a custom Property Editor for Umbraco](../../tutorials/creating-a-property-editor/).
 
 ## Setup your Property Editor as a Block Property Editor
 
-In order for your editor to become a Block Editor you must setup your property editor through C#. The constructor of the class can be auto generated by your Integrated Development Environment (IDE).
+In order for your editor to become a Block Editor, you must first declare it using C#:
+
+{% code title="UnicornBlocksPropertyEditor.cs" %}
+```csharp
+using Umbraco.Cms.Core.IO;
+using Umbraco.Cms.Core.Serialization;
+using Umbraco.Cms.Core.PropertyEditors;
+
+namespace UmbracoDocs.Samples;
+
+[DataEditor("MyOwn.UnicornBlocksEditor", ValueType = ValueTypes.Json, ValueEditorIsReusable = false)]
+public class UnicornBlocksPropertyEditor : BlockListPropertyEditorBase
+{
+    private readonly IIOHelper _ioHelper;
+
+    public UnicornBlocksPropertyEditor(
+        IDataValueEditorFactory dataValueEditorFactory,
+        IBlockValuePropertyIndexValueFactory blockValuePropertyIndexValueFactory,
+        IJsonSerializer jsonSerializer,
+        IOHelper ioHelper)
+        : base(dataValueEditorFactory, blockValuePropertyIndexValueFactory, jsonSerializer)
+        => _ioHelper = ioHelper;
+
+    protected override IConfigurationEditor CreateConfigurationEditor() =>
+        new UnicornBlocksConfigurationEditor(_ioHelper);
+}
+```
+{% endcode %}
 
+{% code title="UnicornBlocksConfigurationEditor.cs" %}
 ```csharp
-using Umbraco.Cms.Core;
+using Umbraco.Cms.Core.IO;
 using Umbraco.Cms.Core.PropertyEditors;
-using Umbraco.Cms.Core.WebAssets;
-using Umbraco.Cms.Infrastructure.WebAssets;
-
-namespace MyNamespace;
-
-[DataEditor(
-    "MyOwn.UnicornBlocksEditor",
-    "Unicorn Blocks",
-    "unicornblocks",
-    ValueType = ValueTypes.Json,
-    Group = Constants.PropertyEditors.Groups.Lists,
-    Icon = "icon-thumbnail-list")]
-[PropertyEditorAsset(AssetType.Javascript, "/App_Plugins/UnicornBlocks/UnicornBlocks.controller.js")]
-public class UnicornBlocksPropertyEditor : BlockEditorPropertyEditor
+
+namespace UmbracoDocs.Samples;
+
+public class UnicornBlocksConfigurationEditor : ConfigurationEditor<BlockListConfiguration>
 {
-    public UnicornBlocksPropertyEditor(IDataValueEditorFactory dataValueEditorFactory, PropertyEditorCollection propertyEditors)
-        : base(dataValueEditorFactory, propertyEditors)
+    public UnicornBlocksConfigurationEditor(IIOHelper ioHelper)
+        : base(ioHelper)
     {
     }
 }
 ```
+{% endcode %}
+
+{% hint style="info" %}
+It is not strictly necessary to define your own property editor in C#. As outlined in the [Composition](composition/README.md) article, all Umbraco core property editors can be reused.
 
-Notice how the `PropertyEditorAsset` attribute is used to load the `UnicornBlocks.controller.js` JavaScript file.
+The code sample above inherits all functionality from Block List and adds no new functionality. If this is sufficient, you can use the Block List property editor alias `"Umbraco.BlockList"` as Property Editor Schema in your [package manifest](./package-manifest.md).
 
-Your Property Editor will need a `PropertyValueConverter`. Read more about [Property Value Converters](property-value-converters.md).
+It is, however, recommended to declare your own Block Editors in C#. As you will see in the following, the property editor alias (`"MyOwn.UnicornBlocksEditor"`) will be part of the data structure. For any eventual future extensibility, it is good to have the correct alias in the content structure from the beginning.
+{% endhint %}
 
 ## Data structure of Block Editors