From 1a4c45dbdf063402ae8e67ed3507cefd297bcfbd Mon Sep 17 00:00:00 2001
From: Kenn Jacobsen <post@kennjacobsen.dk>
Date: Sun, 19 May 2019 11:25:29 +0200
Subject: [PATCH 01/46] Add block editor config and config editor

---
 .../PropertyEditors/BlockEditorConfiguration.cs          | 7 +++++++
 .../PropertyEditors/BlockEditorConfigurationEditor.cs    | 9 +++++++++
 .../PropertyEditors/BlockEditorPropertyEditor.cs         | 2 +-
 src/Umbraco.Web/Umbraco.Web.csproj                       | 2 ++
 4 files changed, 19 insertions(+), 1 deletion(-)
 create mode 100644 src/Umbraco.Web/PropertyEditors/BlockEditorConfiguration.cs
 create mode 100644 src/Umbraco.Web/PropertyEditors/BlockEditorConfigurationEditor.cs

diff --git a/src/Umbraco.Web/PropertyEditors/BlockEditorConfiguration.cs b/src/Umbraco.Web/PropertyEditors/BlockEditorConfiguration.cs
new file mode 100644
index 0000000000..8c9ba621c7
--- /dev/null
+++ b/src/Umbraco.Web/PropertyEditors/BlockEditorConfiguration.cs
@@ -0,0 +1,7 @@
+namespace Umbraco.Web.PropertyEditors
+{
+    public class BlockEditorConfiguration
+    {
+        // TODO: implement
+    }
+}
diff --git a/src/Umbraco.Web/PropertyEditors/BlockEditorConfigurationEditor.cs b/src/Umbraco.Web/PropertyEditors/BlockEditorConfigurationEditor.cs
new file mode 100644
index 0000000000..e125c271fa
--- /dev/null
+++ b/src/Umbraco.Web/PropertyEditors/BlockEditorConfigurationEditor.cs
@@ -0,0 +1,9 @@
+using Umbraco.Core.PropertyEditors;
+
+namespace Umbraco.Web.PropertyEditors
+{
+    internal class BlockEditorConfigurationEditor : ConfigurationEditor<BlockEditorConfiguration>
+    {
+        // TODO: implement
+    }
+}
diff --git a/src/Umbraco.Web/PropertyEditors/BlockEditorPropertyEditor.cs b/src/Umbraco.Web/PropertyEditors/BlockEditorPropertyEditor.cs
index dc46e25f2e..b10833fd07 100644
--- a/src/Umbraco.Web/PropertyEditors/BlockEditorPropertyEditor.cs
+++ b/src/Umbraco.Web/PropertyEditors/BlockEditorPropertyEditor.cs
@@ -11,7 +11,7 @@ namespace Umbraco.Web.PropertyEditors
             : base(logger)
         { }
 
-        protected override IConfigurationEditor CreateConfigurationEditor() => base.CreateConfigurationEditor();
+        protected override IConfigurationEditor CreateConfigurationEditor() => new BlockEditorConfigurationEditor();
 
         protected override IDataValueEditor CreateValueEditor() => base.CreateValueEditor();
     }
diff --git a/src/Umbraco.Web/Umbraco.Web.csproj b/src/Umbraco.Web/Umbraco.Web.csproj
index e75043b246..4860559e00 100755
--- a/src/Umbraco.Web/Umbraco.Web.csproj
+++ b/src/Umbraco.Web/Umbraco.Web.csproj
@@ -211,6 +211,8 @@
     <Compile Include="Models\PublishedContent\HybridVariationContextAccessor.cs" />
     <Compile Include="Models\TemplateQuery\QueryConditionExtensions.cs" />
     <Compile Include="Mvc\SurfaceControllerTypeCollectionBuilder.cs" />
+    <Compile Include="PropertyEditors\BlockEditorConfiguration.cs" />
+    <Compile Include="PropertyEditors\BlockEditorConfigurationEditor.cs" />
     <Compile Include="PropertyEditors\BlockEditorPropertyEditor.cs" />
     <Compile Include="PublishedCache\NuCache\Snap\GenObj.cs" />
     <Compile Include="PublishedCache\NuCache\Snap\GenRef.cs" />

From 174af027e92e1d985e98f7e4644b4b3fd1f8e448 Mon Sep 17 00:00:00 2001
From: Kenn Jacobsen <post@kennjacobsen.dk>
Date: Sun, 19 May 2019 11:59:24 +0200
Subject: [PATCH 02/46] Block editor config first stab

---
 .../BlockEditorConfiguration.cs               | 24 +++++++++++++++++--
 1 file changed, 22 insertions(+), 2 deletions(-)

diff --git a/src/Umbraco.Web/PropertyEditors/BlockEditorConfiguration.cs b/src/Umbraco.Web/PropertyEditors/BlockEditorConfiguration.cs
index 8c9ba621c7..03498e1c2c 100644
--- a/src/Umbraco.Web/PropertyEditors/BlockEditorConfiguration.cs
+++ b/src/Umbraco.Web/PropertyEditors/BlockEditorConfiguration.cs
@@ -1,7 +1,27 @@
-namespace Umbraco.Web.PropertyEditors
+using Umbraco.Core;
+using Umbraco.Core.PropertyEditors;
+
+namespace Umbraco.Web.PropertyEditors
 {
     public class BlockEditorConfiguration
     {
-        // TODO: implement
+        [ConfigurationField("blocks", "Blocks", "views/propertyeditors/textarea/textarea.html")]
+        public Block[] Blocks { get; set; }
+
+        public class Block
+        {
+            public Udi ElementType { get; set; }
+
+            public BlockSetting Settings { get; set; }
+        }
+
+        public class BlockSetting
+        {
+            public string Label { get; set; }
+
+            public string Alias { get; set; }
+
+            public Udi DataType { get; set; }
+        }
     }
 }

From 202302e003667429ef900145e82abece6ba712f2 Mon Sep 17 00:00:00 2001
From: Kenn Jacobsen <post@kennjacobsen.dk>
Date: Sun, 19 May 2019 12:20:46 +0200
Subject: [PATCH 03/46] Plumbing going on here

---
 .../propertyeditors/blockeditor/blockeditor.controller.js | 7 +++++++
 .../views/propertyeditors/blockeditor/blockeditor.html    | 5 +++++
 .../blockeditor/blockeditor.settings.controller.js        | 8 ++++++++
 .../propertyeditors/blockeditor/blockeditor.settings.html | 5 +++++
 .../PropertyEditors/BlockEditorConfiguration.cs           | 2 +-
 .../PropertyEditors/BlockEditorPropertyEditor.cs          | 2 +-
 6 files changed, 27 insertions(+), 2 deletions(-)
 create mode 100644 src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js
 create mode 100644 src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
 create mode 100644 src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.controller.js
 create mode 100644 src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.html

diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js
new file mode 100644
index 0000000000..999ee7f773
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js
@@ -0,0 +1,7 @@
+angular.module("umbraco")
+    .controller("Umbraco.PropertyEditors.BlockEditor.PropertyEditorController", [
+        "$scope",
+        function ($scope) {
+        }
+    ]
+);
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
new file mode 100644
index 0000000000..bd9cbdc3e4
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
@@ -0,0 +1,5 @@
+<div ng-controller="Umbraco.PropertyEditors.BlockEditor.PropertyEditorController">
+    <pre>
+        {{model.config | json}}
+    </pre>
+</div>
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.controller.js
new file mode 100644
index 0000000000..f47b495579
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.controller.js
@@ -0,0 +1,8 @@
+angular.module("umbraco")
+    .controller("Umbraco.PropertyEditors.BlockEditor.SettingsController", [
+        "$scope",
+        function ($scope) {
+            $scope.model.value = [];
+        }
+    ]
+);
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.html
new file mode 100644
index 0000000000..6e43718b77
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.html
@@ -0,0 +1,5 @@
+<div ng-controller="Umbraco.PropertyEditors.BlockEditor.SettingsController">
+    <pre>
+        {{model.value | json}}
+    </pre>
+</div>
diff --git a/src/Umbraco.Web/PropertyEditors/BlockEditorConfiguration.cs b/src/Umbraco.Web/PropertyEditors/BlockEditorConfiguration.cs
index 03498e1c2c..291551efca 100644
--- a/src/Umbraco.Web/PropertyEditors/BlockEditorConfiguration.cs
+++ b/src/Umbraco.Web/PropertyEditors/BlockEditorConfiguration.cs
@@ -5,7 +5,7 @@ namespace Umbraco.Web.PropertyEditors
 {
     public class BlockEditorConfiguration
     {
-        [ConfigurationField("blocks", "Blocks", "views/propertyeditors/textarea/textarea.html")]
+        [ConfigurationField("blocks", "Blocks", "views/propertyeditors/blockeditor/blockeditor.settings.html")]
         public Block[] Blocks { get; set; }
 
         public class Block
diff --git a/src/Umbraco.Web/PropertyEditors/BlockEditorPropertyEditor.cs b/src/Umbraco.Web/PropertyEditors/BlockEditorPropertyEditor.cs
index b10833fd07..f486af4c3d 100644
--- a/src/Umbraco.Web/PropertyEditors/BlockEditorPropertyEditor.cs
+++ b/src/Umbraco.Web/PropertyEditors/BlockEditorPropertyEditor.cs
@@ -4,7 +4,7 @@ using Umbraco.Core.PropertyEditors;
 
 namespace Umbraco.Web.PropertyEditors
 {
-    [DataEditor(Constants.PropertyEditors.Aliases.BlockEditor, "Block Editor", ValueType = ValueTypes.Json, Group="rich content")]
+    [DataEditor(Constants.PropertyEditors.Aliases.BlockEditor, EditorType.PropertyValue , "Block Editor", "blockeditor", ValueType = ValueTypes.Json, Group="rich content", Icon="icon-application-window-alt")]
     public class BlockEditorPropertyEditor : DataEditor
     {
         public BlockEditorPropertyEditor(ILogger logger)

From e7303602d20409f42714b43810b5d720964a8631 Mon Sep 17 00:00:00 2001
From: Callum Whyte <hey@callumwhyte.com>
Date: Sun, 19 May 2019 13:08:07 +0100
Subject: [PATCH 04/46] Listing available element types in block editor
 settings

---
 .../blockeditor/blockeditor.settings.controller.js     | 10 +++++++++-
 .../blockeditor/blockeditor.settings.html              |  6 ++++++
 2 files changed, 15 insertions(+), 1 deletion(-)

diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.controller.js
index f47b495579..fbb2c25ed9 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.controller.js
@@ -1,8 +1,16 @@
 angular.module("umbraco")
     .controller("Umbraco.PropertyEditors.BlockEditor.SettingsController", [
         "$scope",
-        function ($scope) {
+        "contentTypeResource",
+        function ($scope, contentTypeResource) {
             $scope.model.value = [];
+
+            $scope.elementTypes = [];
+
+            contentTypeResource.getAll()
+                .then(function (data) {
+                    $scope.elementTypes = _.where(data, { isElement: true });
+                });
         }
     ]
 );
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.html
index 6e43718b77..6eaeb64db6 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.html
@@ -2,4 +2,10 @@
     <pre>
         {{model.value | json}}
     </pre>
+
+    <ul>
+        <li ng-repeat="elementType in elementTypes">
+            {{elementType.name}}
+        </li>
+    </ul>
 </div>

From ab5e7aa1e8d003a5049620ef14d640249058856e Mon Sep 17 00:00:00 2001
From: Callum Whyte <hey@callumwhyte.com>
Date: Sun, 19 May 2019 14:04:23 +0100
Subject: [PATCH 05/46] Primative add-block functionality in block editor
 settings

---
 .../blockeditor.settings.controller.js            | 15 ++++++++++++++-
 .../blockeditor/blockeditor.settings.html         |  2 +-
 .../BlockEditorConfigurationEditor.cs             |  2 +-
 3 files changed, 16 insertions(+), 3 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.controller.js
index fbb2c25ed9..e4fc3b4388 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.controller.js
@@ -3,7 +3,20 @@
         "$scope",
         "contentTypeResource",
         function ($scope, contentTypeResource) {
-            $scope.model.value = [];
+
+            if (!$scope.model.value) {
+                $scope.model.value = [];
+            }
+
+            $scope.addBlock = function (elementType) {
+
+                var block = {
+                    elementType: elementType.udi,
+                    settings: null
+                };
+
+                $scope.model.value.push(block);
+            }
 
             $scope.elementTypes = [];
 
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.html
index 6eaeb64db6..9b308f3bbf 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.html
@@ -5,7 +5,7 @@
 
     <ul>
         <li ng-repeat="elementType in elementTypes">
-            {{elementType.name}}
+            {{elementType.name}} <a href="" ng-click="addBlock(elementType)">Add</a>
         </li>
     </ul>
 </div>
diff --git a/src/Umbraco.Web/PropertyEditors/BlockEditorConfigurationEditor.cs b/src/Umbraco.Web/PropertyEditors/BlockEditorConfigurationEditor.cs
index e125c271fa..cd68108f16 100644
--- a/src/Umbraco.Web/PropertyEditors/BlockEditorConfigurationEditor.cs
+++ b/src/Umbraco.Web/PropertyEditors/BlockEditorConfigurationEditor.cs
@@ -4,6 +4,6 @@ namespace Umbraco.Web.PropertyEditors
 {
     internal class BlockEditorConfigurationEditor : ConfigurationEditor<BlockEditorConfiguration>
     {
-        // TODO: implement
+
     }
 }

From 5cb847930dbf88de44066718dad3dd6ef8536549 Mon Sep 17 00:00:00 2001
From: Callum Whyte <hey@callumwhyte.com>
Date: Sun, 19 May 2019 14:05:14 +0100
Subject: [PATCH 06/46] Ensuring block editor settings JSON properties are
 lowercased

---
 .../PropertyEditors/BlockEditorConfiguration.cs           | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/src/Umbraco.Web/PropertyEditors/BlockEditorConfiguration.cs b/src/Umbraco.Web/PropertyEditors/BlockEditorConfiguration.cs
index 291551efca..b91c6b37bf 100644
--- a/src/Umbraco.Web/PropertyEditors/BlockEditorConfiguration.cs
+++ b/src/Umbraco.Web/PropertyEditors/BlockEditorConfiguration.cs
@@ -1,4 +1,5 @@
-using Umbraco.Core;
+using Newtonsoft.Json;
+using Umbraco.Core;
 using Umbraco.Core.PropertyEditors;
 
 namespace Umbraco.Web.PropertyEditors
@@ -10,17 +11,22 @@ namespace Umbraco.Web.PropertyEditors
 
         public class Block
         {
+            [JsonProperty("elementType")]
             public Udi ElementType { get; set; }
 
+            [JsonProperty("settings")]
             public BlockSetting Settings { get; set; }
         }
 
         public class BlockSetting
         {
+            [JsonProperty("label")]
             public string Label { get; set; }
 
+            [JsonProperty("alias")]
             public string Alias { get; set; }
 
+            [JsonProperty("dataType")]
             public Udi DataType { get; set; }
         }
     }

From 013bd2c424d1134ca36a4cf76282ded3c798c15f Mon Sep 17 00:00:00 2001
From: Kenn Jacobsen <post@kennjacobsen.dk>
Date: Sun, 19 May 2019 17:48:10 +0200
Subject: [PATCH 07/46] Editor for content editing

---
 .../src/common/resources/content.resource.js  | 14 +++
 .../blockeditor/blockeditor.controller.js     | 85 +++++++++++++++++--
 .../blockeditor.editblock.controller.js       | 25 ++++++
 .../blockeditor/blockeditor.editblock.html    | 38 +++++++++
 .../blockeditor/blockeditor.html              | 31 ++++++-
 src/Umbraco.Web/Editors/ContentController.cs  | 24 +++++-
 6 files changed, 206 insertions(+), 11 deletions(-)
 create mode 100644 src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editblock.controller.js
 create mode 100644 src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editblock.html

diff --git a/src/Umbraco.Web.UI.Client/src/common/resources/content.resource.js b/src/Umbraco.Web.UI.Client/src/common/resources/content.resource.js
index d571de0e2d..1cfb61f80c 100644
--- a/src/Umbraco.Web.UI.Client/src/common/resources/content.resource.js
+++ b/src/Umbraco.Web.UI.Client/src/common/resources/content.resource.js
@@ -520,6 +520,20 @@ function contentResource($q, $http, umbDataFormatter, umbRequestHelper) {
                 });
         },
 
+        getScaffoldByUdi: function (parentId, udi) {
+
+            return umbRequestHelper.resourcePromise(
+                $http.get(
+                    umbRequestHelper.getApiUrl(
+                        "contentApiBaseUrl",
+                        "GetEmpty",
+                        [{ udi: udi }, { parentId: parentId }])),
+                'Failed to retrieve data for empty content item with udi ' + udi)
+                .then(function (result) {
+                    return $q.when(umbDataFormatter.formatContentGetData(result));
+                });
+        },
+
         getBlueprintScaffold: function (parentId, blueprintId) {
 
             return umbRequestHelper.resourcePromise(
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js
index 999ee7f773..3f42de2f48 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js
@@ -1,7 +1,80 @@
-angular.module("umbraco")
-    .controller("Umbraco.PropertyEditors.BlockEditor.PropertyEditorController", [
-        "$scope",
-        function ($scope) {
+function BlockEditorPropertyEditorController($scope, contentResource, editorService) {
+    var vm = this;
+
+    vm.scaffolds = [];
+    vm.blocks = [];
+    vm.loading = true;
+    vm.sortableOptions = {
+        axis: "y",
+        cursor: "move",
+        handle: ".handle",
+        tolerance: 'pointer'
+    };
+
+    vm.add = add;
+    vm.edit = edit;
+    vm.remove = remove;
+
+    // it would be awesome if we could load all scaffolds in one go... however we need to have an eye out for performance,
+    // oddly enough it's been shown to actually be slower to load them all at once instead of one at a time
+    var scaffoldsLoaded = 0;
+    function init() {
+        $scope.model.value = $scope.model.value || [];
+        _.each($scope.model.config.blocks, function (blockConfig) {
+            contentResource.getScaffoldByUdi(-20, blockConfig.elementType).then(function (scaffold) {
+                if (scaffold.isElement) {
+                    vm.scaffolds.push(scaffold);
+                }
+                scaffoldsLoaded++;
+                initIfAllScaffoldsHaveLoaded();
+            }, function (error) {
+                scaffoldsLoaded++;
+                initIfAllScaffoldsHaveLoaded();
+            });
+        });
+    }
+
+    function initIfAllScaffoldsHaveLoaded() {
+        // Initialize when all scaffolds have loaded
+        if ($scope.model.config.blocks.length === scaffoldsLoaded) {
+            vm.scaffolds = _.sortBy(vm.scaffolds, function (scaffold) {
+                return _.findIndex($scope.model.config.blocks, function (blockConfig) {
+                    return blockConfig.elementType === scaffold.udi;
+                });
+            });
+            vm.loading = false;
         }
-    ]
-);
+    }
+
+    function add(scaffold) {
+        var block = angular.copy(scaffold);
+        edit(block);
+    }
+
+    function edit(block) {
+        var options = {
+            node: block,
+            title: "TODO: Edit block title here",
+            view: "views/propertyeditors/blockeditor/blockeditor.editblock.html",
+            submit: function(model) {
+                if (vm.blocks.indexOf(block) < 0) {
+                    vm.blocks.push(block);
+                }
+                editorService.close();
+            },
+            close: function() {
+                editorService.close();
+            }
+        };
+        editorService.open(options);
+    }
+
+    function remove(block) {
+        if (confirm("TODO: Are you sure?")) {
+            vm.blocks.splice(vm.blocks.indexOf(block), 1);
+        }
+    }
+
+    init();
+}
+angular.module("umbraco").controller("Umbraco.PropertyEditors.BlockEditor.PropertyEditorController", BlockEditorPropertyEditorController);
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editblock.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editblock.controller.js
new file mode 100644
index 0000000000..227fc384cf
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editblock.controller.js
@@ -0,0 +1,25 @@
+function BlockEditorEditBlockController($scope) {
+    var vm = this;
+    vm.submit = submit;
+    vm.close = close;
+    vm.content = $scope.model.node.variants[0];
+
+    function init() {
+
+    }
+
+    function submit() {
+        if($scope.model.submit) {
+            $scope.model.submit($scope.model);
+        }
+    }
+
+    function close() {
+        if($scope.model.close) {
+            $scope.model.close();
+        }
+    }
+
+    init();
+}
+angular.module("umbraco").controller("Umbraco.PropertyEditors.BlockEditor.EditBlockController", BlockEditorEditBlockController);
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editblock.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editblock.html
new file mode 100644
index 0000000000..1103ef0484
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editblock.html
@@ -0,0 +1,38 @@
+<div ng-controller="Umbraco.PropertyEditors.BlockEditor.EditBlockController as vm">
+    <umb-editor-view>
+        <umb-editor-header name="model.title"
+                           name-locked="true"
+                           hide-alias="true"
+                           hide-icon="true"
+                           hide-description="true">
+        </umb-editor-header>
+
+        <umb-editor-container>
+            <umb-load-indicator ng-if="vm.loading" />
+
+            <div ng-if="!loading">
+                <ng-form name="editBlockForm" val-form-manager>
+                    <umb-tabbed-content content="vm.content" />
+                </ng-form>
+            </div>
+        </umb-editor-container>
+
+        <umb-editor-footer>
+            <umb-editor-footer-content-right>
+                <umb-button type="button"
+                            button-style="link"
+                            label-key="general_cancel"
+                            shortcut="esc"
+                            action="vm.close()">
+                </umb-button>
+                <umb-button type="button"
+                            button-style="success"
+                            label-key="general_ok"
+                            action="vm.submit()">
+                </umb-button>
+            </umb-editor-footer-content-right>
+        </umb-editor-footer>
+
+    </umb-editor-view>
+
+</div>
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
index bd9cbdc3e4..284f3ce20d 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
@@ -1,5 +1,28 @@
-<div ng-controller="Umbraco.PropertyEditors.BlockEditor.PropertyEditorController">
-    <pre>
-        {{model.config | json}}
-    </pre>
+<div ng-controller="Umbraco.PropertyEditors.BlockEditor.PropertyEditorController as vm">
+    <div style="position:relative" ng-if="vm.loading">
+        <umb-load-indicator />
+    </div>
+
+    <div ng-if="!vm.loading">
+        <div ui-sortable="vm.sortableOptions" ng-model="vm.blocks">
+            <div ng-repeat="block in vm.blocks">
+                <div style="cursor:pointer" ng-click="vm.edit(block)" class="di">
+                    <i class="icon {{block.documentType.icon}}"></i>
+                </div>
+                <div style="cursor:pointer" ng-click="vm.remove(block)" class="di">
+                    <i class="icon icon-trash"></i>
+                </div>
+                <div style="cursor:move" class="di handle">
+                    <i class="icon icon-navigation"></i>
+                </div>
+            </div>
+        </div>
+
+        <div>
+            Add:
+            <div style="cursor:pointer" ng-click="vm.add(scaffold)" ng-repeat="scaffold in vm.scaffolds" class="di">
+                <i class="icon {{scaffold.documentType.icon}}"></i>
+            </div>
+        </div>
+    </div>
 </div>
diff --git a/src/Umbraco.Web/Editors/ContentController.cs b/src/Umbraco.Web/Editors/ContentController.cs
index de65689353..52b6b3a1d4 100644
--- a/src/Umbraco.Web/Editors/ContentController.cs
+++ b/src/Umbraco.Web/Editors/ContentController.cs
@@ -354,12 +354,34 @@ namespace Umbraco.Web.Editors
                 throw new HttpResponseException(HttpStatusCode.NotFound);
             }
 
+            return EmptyContent(parentId, contentType);
+        }
+
+        /// <summary>
+        /// Gets an empty content item for the
+        /// </summary>
+        /// <param name="udi"></param>
+        /// <param name="parentId"></param>
+        [OutgoingEditorModelEvent]
+        public ContentItemDisplay GetEmpty(GuidUdi udi, int parentId)
+        {
+            var contentType = Services.ContentTypeService.Get(udi.Guid);
+            if(contentType == null)
+            {
+                throw new HttpResponseException(HttpStatusCode.NotFound);
+            }
+
+            return EmptyContent(parentId, contentType);
+        }
+
+        private ContentItemDisplay EmptyContent(int parentId, IContentType contentType)
+        {
             var emptyContent = Services.ContentService.Create("", parentId, contentType.Alias, Security.GetUserId().ResultOr(0));
             var mapped = MapToDisplay(emptyContent);
             // translate the content type name if applicable
             mapped.ContentTypeName = Services.TextService.UmbracoDictionaryTranslate(mapped.ContentTypeName);
             // if your user type doesn't have access to the Settings section it would not get this property mapped
-            if (mapped.DocumentType != null)
+            if(mapped.DocumentType != null)
                 mapped.DocumentType.Name = Services.TextService.UmbracoDictionaryTranslate(mapped.DocumentType.Name);
 
             //remove the listview app if it exists

From 89f93aa81d3561106adb5ce1bbc07a1ce8af9813 Mon Sep 17 00:00:00 2001
From: Kenn Jacobsen <post@kennjacobsen.dk>
Date: Sun, 19 May 2019 18:27:02 +0200
Subject: [PATCH 08/46] Bit of work on internal data format

---
 .../blockeditor/blockeditor.controller.js     | 36 +++++++++++++++----
 .../blockeditor.editblock.controller.js       |  2 +-
 .../blockeditor/blockeditor.html              |  6 ++--
 3 files changed, 33 insertions(+), 11 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js
index 3f42de2f48..a4038cd681 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js
@@ -2,7 +2,6 @@
     var vm = this;
 
     vm.scaffolds = [];
-    vm.blocks = [];
     vm.loading = true;
     vm.sortableOptions = {
         axis: "y",
@@ -47,19 +46,42 @@
     }
 
     function add(scaffold) {
-        var block = angular.copy(scaffold);
-        edit(block);
+        var element = angular.copy(scaffold);
+        var block = {
+            udi: element.udi
+        };
+        open(element, block);
     }
 
     function edit(block) {
+        var scaffold = _.findWhere(vm.scaffolds, {udi: block.udi});
+        var element = angular.copy(scaffold);
+        _.each(element.variants[0].tabs, function (tab) {
+            _.each(tab.properties, function (property) {
+                if (block[property.alias]) {
+                    property.value = block[property.alias];
+                }
+            });
+        });
+        
+        open(element, block);
+    }
+
+    function open(element, block) {
         var options = {
-            node: block,
+            element: element,
             title: "TODO: Edit block title here",
             view: "views/propertyeditors/blockeditor/blockeditor.editblock.html",
             submit: function(model) {
-                if (vm.blocks.indexOf(block) < 0) {
-                    vm.blocks.push(block);
+                _.each(element.variants[0].tabs, function (tab) {
+                    _.each(tab.properties, function (property) {
+                        block[property.alias] = property.value;
+                    });
+                });
+                if ($scope.model.value.indexOf(block) < 0) {
+                    $scope.model.value.push(block);
                 }
+
                 editorService.close();
             },
             close: function() {
@@ -71,7 +93,7 @@
 
     function remove(block) {
         if (confirm("TODO: Are you sure?")) {
-            vm.blocks.splice(vm.blocks.indexOf(block), 1);
+            $scope.model.value.splice($scope.model.value.indexOf(block), 1);
         }
     }
 
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editblock.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editblock.controller.js
index 227fc384cf..779b75bfb8 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editblock.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editblock.controller.js
@@ -2,7 +2,7 @@
     var vm = this;
     vm.submit = submit;
     vm.close = close;
-    vm.content = $scope.model.node.variants[0];
+    vm.content = $scope.model.element.variants[0];
 
     function init() {
 
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
index 284f3ce20d..5d9113b4fd 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
@@ -4,10 +4,10 @@
     </div>
 
     <div ng-if="!vm.loading">
-        <div ui-sortable="vm.sortableOptions" ng-model="vm.blocks">
-            <div ng-repeat="block in vm.blocks">
+        <div ui-sortable="vm.sortableOptions" ng-model="model.value">
+            <div ng-repeat="block in model.value">
                 <div style="cursor:pointer" ng-click="vm.edit(block)" class="di">
-                    <i class="icon {{block.documentType.icon}}"></i>
+                    TODO: block identifier, e.g. icon
                 </div>
                 <div style="cursor:pointer" ng-click="vm.remove(block)" class="di">
                     <i class="icon icon-trash"></i>

From b064566f9e407b2cce7669bba799bbb8f42d5bb7 Mon Sep 17 00:00:00 2001
From: Kenn Jacobsen <post@kennjacobsen.dk>
Date: Mon, 20 May 2019 07:16:15 +0200
Subject: [PATCH 09/46] Store content and settings separately + actually make
 it work when saving

---
 .../blockeditor/blockeditor.controller.js     | 22 +++++++++++--------
 .../blockeditor/blockeditor.html              |  2 +-
 2 files changed, 14 insertions(+), 10 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js
index a4038cd681..17c0465eeb 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js
@@ -11,7 +11,7 @@
     };
 
     vm.add = add;
-    vm.edit = edit;
+    vm.editContent = editContent;
     vm.remove = remove;
 
     // it would be awesome if we could load all scaffolds in one go... however we need to have an eye out for performance,
@@ -22,6 +22,8 @@
         _.each($scope.model.config.blocks, function (blockConfig) {
             contentResource.getScaffoldByUdi(-20, blockConfig.elementType).then(function (scaffold) {
                 if (scaffold.isElement) {
+                    // the scaffold udi is not the same as the element type udi, but we need it to be for comparison
+                    scaffold.udi = blockConfig.elementType;
                     vm.scaffolds.push(scaffold);
                 }
                 scaffoldsLoaded++;
@@ -48,26 +50,28 @@
     function add(scaffold) {
         var element = angular.copy(scaffold);
         var block = {
-            udi: element.udi
+            udi: element.udi,
+            content: {},
+            settings: {}
         };
-        open(element, block);
+        openContent(element, block);
     }
 
-    function edit(block) {
+    function editContent(block) {
         var scaffold = _.findWhere(vm.scaffolds, {udi: block.udi});
         var element = angular.copy(scaffold);
         _.each(element.variants[0].tabs, function (tab) {
             _.each(tab.properties, function (property) {
-                if (block[property.alias]) {
-                    property.value = block[property.alias];
+                if (block.content[property.alias]) {
+                    property.value = block.content[property.alias];
                 }
             });
         });
         
-        open(element, block);
+        openContent(element, block);
     }
 
-    function open(element, block) {
+    function openContent(element, block) {
         var options = {
             element: element,
             title: "TODO: Edit block title here",
@@ -75,7 +79,7 @@
             submit: function(model) {
                 _.each(element.variants[0].tabs, function (tab) {
                     _.each(tab.properties, function (property) {
-                        block[property.alias] = property.value;
+                        block.content[property.alias] = property.value;
                     });
                 });
                 if ($scope.model.value.indexOf(block) < 0) {
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
index 5d9113b4fd..ea379f9199 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
@@ -6,7 +6,7 @@
     <div ng-if="!vm.loading">
         <div ui-sortable="vm.sortableOptions" ng-model="model.value">
             <div ng-repeat="block in model.value">
-                <div style="cursor:pointer" ng-click="vm.edit(block)" class="di">
+                <div style="cursor:pointer" ng-click="vm.editContent(block)" class="di">
                     TODO: block identifier, e.g. icon
                 </div>
                 <div style="cursor:pointer" ng-click="vm.remove(block)" class="di">

From acd329381cf61e691698f7b7136036462ab18fab Mon Sep 17 00:00:00 2001
From: Kenn Jacobsen <post@kennjacobsen.dk>
Date: Mon, 20 May 2019 08:29:08 +0200
Subject: [PATCH 10/46] Plumbing for editing settings

---
 .../blockeditor/blockeditor.controller.js     | 18 ++++++++
 .../blockeditor.editsettings.controller.js    | 24 +++++++++++
 .../blockeditor/blockeditor.editsettings.html | 42 +++++++++++++++++++
 .../blockeditor/blockeditor.html              |  7 +++-
 4 files changed, 89 insertions(+), 2 deletions(-)
 create mode 100644 src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editsettings.controller.js
 create mode 100644 src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editsettings.html

diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js
index 17c0465eeb..d22ab4b142 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js
@@ -12,6 +12,7 @@
 
     vm.add = add;
     vm.editContent = editContent;
+    vm.editSettings = editSettings;
     vm.remove = remove;
 
     // it would be awesome if we could load all scaffolds in one go... however we need to have an eye out for performance,
@@ -95,6 +96,23 @@
         editorService.open(options);
     }
 
+    function editSettings(block) {
+        var options = {
+            settings: block.settings,
+            title: "TODO: Edit settings title here",
+            view: "views/propertyeditors/blockeditor/blockeditor.editsettings.html",
+            size: "medium",
+            submit: function(model) {
+                console.log("TODO: something with block settings", model)
+                editorService.close();
+            },
+            close: function() {
+                editorService.close();
+            }
+        };
+        editorService.open(options);
+    }
+
     function remove(block) {
         if (confirm("TODO: Are you sure?")) {
             $scope.model.value.splice($scope.model.value.indexOf(block), 1);
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editsettings.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editsettings.controller.js
new file mode 100644
index 0000000000..fb8e212729
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editsettings.controller.js
@@ -0,0 +1,24 @@
+function BlockEditorEditSettingsController($scope) {
+    var vm = this;
+    vm.submit = submit;
+    vm.close = close;
+
+    function init() {
+
+    }
+
+    function submit() {
+        if($scope.model.submit) {
+            $scope.model.submit($scope.model);
+        }
+    }
+
+    function close() {
+        if($scope.model.close) {
+            $scope.model.close();
+        }
+    }
+
+    init();
+}
+angular.module("umbraco").controller("Umbraco.PropertyEditors.BlockEditor.EditSettingsController", BlockEditorEditSettingsController);
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editsettings.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editsettings.html
new file mode 100644
index 0000000000..c97948f83d
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editsettings.html
@@ -0,0 +1,42 @@
+<div ng-controller="Umbraco.PropertyEditors.BlockEditor.EditSettingsController as vm">
+    <umb-editor-view>
+        <umb-editor-header name="model.title"
+                           name-locked="true"
+                           hide-alias="true"
+                           hide-icon="true"
+                           hide-description="true">
+        </umb-editor-header>
+
+        <umb-editor-container>
+            <umb-load-indicator ng-if="vm.loading" />
+
+            <div ng-if="!loading">
+                <umb-box>
+                    <umb-box-content>
+                        <ng-form name="editBlockForm" val-form-manager>
+                            <h3>Here be settings editing</h3>
+                        </ng-form>
+                    </umb-box-content>
+                </umb-box>
+            </div>
+        </umb-editor-container>
+
+        <umb-editor-footer>
+            <umb-editor-footer-content-right>
+                <umb-button type="button"
+                            button-style="link"
+                            label-key="general_cancel"
+                            shortcut="esc"
+                            action="vm.close()">
+                </umb-button>
+                <umb-button type="button"
+                            button-style="success"
+                            label-key="general_ok"
+                            action="vm.submit()">
+                </umb-button>
+            </umb-editor-footer-content-right>
+        </umb-editor-footer>
+
+    </umb-editor-view>
+
+</div>
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
index ea379f9199..e6193793ba 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
@@ -9,12 +9,15 @@
                 <div style="cursor:pointer" ng-click="vm.editContent(block)" class="di">
                     TODO: block identifier, e.g. icon
                 </div>
-                <div style="cursor:pointer" ng-click="vm.remove(block)" class="di">
-                    <i class="icon icon-trash"></i>
+                <div style="cursor:pointer" ng-click="vm.editSettings(block)" class="di">
+                    <i class="icon icon-settings"></i>
                 </div>
                 <div style="cursor:move" class="di handle">
                     <i class="icon icon-navigation"></i>
                 </div>
+                <div style="cursor:pointer" ng-click="vm.remove(block)" class="di">
+                    <i class="icon icon-trash"></i>
+                </div>
             </div>
         </div>
 

From e41e458322868277e7f79a556f3969d2a4b5cadb Mon Sep 17 00:00:00 2001
From: Kenn Jacobsen <post@kennjacobsen.dk>
Date: Mon, 20 May 2019 10:28:29 +0200
Subject: [PATCH 11/46] Rename editblock to editcontent

---
 .../propertyeditors/blockeditor/blockeditor.controller.js | 2 +-
 ...ontroller.js => blockeditor.editcontent.controller.js} | 4 ++--
 ...editor.editblock.html => blockeditor.editcontent.html} | 2 +-
 .../views/propertyeditors/blockeditor/blockeditor.html    | 8 ++++----
 4 files changed, 8 insertions(+), 8 deletions(-)
 rename src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/{blockeditor.editblock.controller.js => blockeditor.editcontent.controller.js} (78%)
 rename src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/{blockeditor.editblock.html => blockeditor.editcontent.html} (93%)

diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js
index d22ab4b142..28bb91583c 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js
@@ -76,7 +76,7 @@
         var options = {
             element: element,
             title: "TODO: Edit block title here",
-            view: "views/propertyeditors/blockeditor/blockeditor.editblock.html",
+            view: "views/propertyeditors/blockeditor/blockeditor.editcontent.html",
             submit: function(model) {
                 _.each(element.variants[0].tabs, function (tab) {
                     _.each(tab.properties, function (property) {
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editblock.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editcontent.controller.js
similarity index 78%
rename from src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editblock.controller.js
rename to src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editcontent.controller.js
index 779b75bfb8..f05799b398 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editblock.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editcontent.controller.js
@@ -1,4 +1,4 @@
-function BlockEditorEditBlockController($scope) {
+function BlockEditorEditContentController($scope) {
     var vm = this;
     vm.submit = submit;
     vm.close = close;
@@ -22,4 +22,4 @@
 
     init();
 }
-angular.module("umbraco").controller("Umbraco.PropertyEditors.BlockEditor.EditBlockController", BlockEditorEditBlockController);
+angular.module("umbraco").controller("Umbraco.PropertyEditors.BlockEditor.EditContentController", BlockEditorEditContentController);
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editblock.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editcontent.html
similarity index 93%
rename from src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editblock.html
rename to src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editcontent.html
index 1103ef0484..5026de8b63 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editblock.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editcontent.html
@@ -1,4 +1,4 @@
-<div ng-controller="Umbraco.PropertyEditors.BlockEditor.EditBlockController as vm">
+<div ng-controller="Umbraco.PropertyEditors.BlockEditor.EditContentController as vm">
     <umb-editor-view>
         <umb-editor-header name="model.title"
                            name-locked="true"
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
index e6193793ba..f062f004f2 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
@@ -4,8 +4,8 @@
     </div>
 
     <div ng-if="!vm.loading">
-        <div ui-sortable="vm.sortableOptions" ng-model="model.value">
-            <div ng-repeat="block in model.value">
+        <ul class="unstyled" ui-sortable="vm.sortableOptions" ng-model="model.value">
+            <li ng-repeat="block in model.value">
                 <div style="cursor:pointer" ng-click="vm.editContent(block)" class="di">
                     TODO: block identifier, e.g. icon
                 </div>
@@ -18,8 +18,8 @@
                 <div style="cursor:pointer" ng-click="vm.remove(block)" class="di">
                     <i class="icon icon-trash"></i>
                 </div>
-            </div>
-        </div>
+            </li>
+        </ul>
 
         <div>
             Add:

From 62e19279a469d3a44aa31a051f5985128c1ae276 Mon Sep 17 00:00:00 2001
From: Kenn Jacobsen <post@kennjacobsen.dk>
Date: Mon, 20 May 2019 11:06:38 +0200
Subject: [PATCH 12/46] Split things into directives

---
 .../components/umbblockeditorblock.directive.js | 13 +++++++++++++
 .../umbblockeditorblocks.directive.js           | 13 +++++++++++++
 .../blockeditor/blockeditor.block.html          | 14 ++++++++++++++
 .../blockeditor/blockeditor.blocks.html         |  5 +++++
 .../blockeditor/blockeditor.html                | 17 +----------------
 5 files changed, 46 insertions(+), 16 deletions(-)
 create mode 100644 src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblock.directive.js
 create mode 100644 src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblocks.directive.js
 create mode 100644 src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.block.html
 create mode 100644 src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.blocks.html

diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblock.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblock.directive.js
new file mode 100644
index 0000000000..0db2873782
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblock.directive.js
@@ -0,0 +1,13 @@
+angular.module("umbraco.directives").directive('umbBlockEditorBlock', [
+    function () {
+        var link = function (scope, el, attr, ctrl) {
+        };
+
+        return {
+            restrict: "E",
+            replace: true,
+            templateUrl: "views/propertyeditors/blockeditor/blockeditor.block.html",
+            link: link
+        };
+    }
+]);
diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblocks.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblocks.directive.js
new file mode 100644
index 0000000000..9c67e134ea
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblocks.directive.js
@@ -0,0 +1,13 @@
+angular.module("umbraco.directives").directive('umbBlockEditorBlocks', [
+    function () {
+        var link = function (scope, el, attr, ctrl) {
+        };
+
+        return {
+            restrict: "E",
+            replace: true,
+            templateUrl: "views/propertyeditors/blockeditor/blockeditor.blocks.html",
+            link: link
+        };
+    }
+]);
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.block.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.block.html
new file mode 100644
index 0000000000..85a5e578a4
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.block.html
@@ -0,0 +1,14 @@
+<div>
+    <div style="cursor:pointer" ng-click="vm.editContent(block)" class="di">
+        Block identifier goes here (e.g. icon)
+    </div>
+    <div style="cursor:pointer" ng-click="vm.editSettings(block)" class="di">
+        <i class="icon icon-settings"></i>
+    </div>
+    <div style="cursor:move" class="di handle">
+        <i class="icon icon-navigation"></i>
+    </div>
+    <div style="cursor:pointer" ng-click="vm.remove(block)" class="di">
+        <i class="icon icon-trash"></i>
+    </div>
+</div>
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.blocks.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.blocks.html
new file mode 100644
index 0000000000..2763af5039
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.blocks.html
@@ -0,0 +1,5 @@
+<ul class="unstyled" ui-sortable="vm.sortableOptions" ng-model="model.value">
+    <li ng-repeat="block in model.value">
+        <umb-block-editor-block></umb-block-editor-block>
+    </li>
+</ul>
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
index f062f004f2..3329a895c3 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
@@ -4,22 +4,7 @@
     </div>
 
     <div ng-if="!vm.loading">
-        <ul class="unstyled" ui-sortable="vm.sortableOptions" ng-model="model.value">
-            <li ng-repeat="block in model.value">
-                <div style="cursor:pointer" ng-click="vm.editContent(block)" class="di">
-                    TODO: block identifier, e.g. icon
-                </div>
-                <div style="cursor:pointer" ng-click="vm.editSettings(block)" class="di">
-                    <i class="icon icon-settings"></i>
-                </div>
-                <div style="cursor:move" class="di handle">
-                    <i class="icon icon-navigation"></i>
-                </div>
-                <div style="cursor:pointer" ng-click="vm.remove(block)" class="di">
-                    <i class="icon icon-trash"></i>
-                </div>
-            </li>
-        </ul>
+        <umb-block-editor-blocks></umb-block-editor-blocks>
 
         <div>
             Add:

From c2a57a1770c850c091bf95247c5a6cd7f1f393db Mon Sep 17 00:00:00 2001
From: Callum Whyte <hey@callumwhyte.com>
Date: Mon, 20 May 2019 10:43:11 +0100
Subject: [PATCH 13/46] UI for picking block editor element types

---
 .../blockeditor/block.settings.html           | 39 +++++++++
 .../blockeditor.settings.controller.js        | 83 +++++++++++++++----
 .../blockeditor/blockeditor.settings.html     | 28 +++++--
 3 files changed, 125 insertions(+), 25 deletions(-)
 create mode 100644 src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/block.settings.html

diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/block.settings.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/block.settings.html
new file mode 100644
index 0000000000..3be46293b3
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/block.settings.html
@@ -0,0 +1,39 @@
+<div>
+
+    <umb-editor-view>
+
+        <umb-editor-header name="model.title"
+                           name-locked="true"
+                           hide-alias="true"
+                           hide-icon="true"
+                           hide-description="true">
+        </umb-editor-header>
+
+        <umb-editor-container class="block-form">
+            <umb-box>
+                <umb-box-content>
+                    <p>Settings will go here...</p>
+                </umb-box-content>
+            </umb-box>
+        </umb-editor-container>
+
+        <umb-editor-footer>
+            <umb-editor-footer-content-right>
+                <umb-button type="button"
+                            button-style="link"
+                            label-key="general_close"
+                            shortcut="esc"
+                            action="close()">
+                </umb-button>
+                <umb-button type="button"
+                            button-style="success"
+                            label-key="general_submit"
+                            state="saveButtonState"
+                            action="submit(model)">
+                </umb-button>
+            </umb-editor-footer-content-right>
+        </umb-editor-footer>
+
+    </umb-editor-view>
+
+</div>
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.controller.js
index e4fc3b4388..0d7eedbcf0 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.controller.js
@@ -2,28 +2,77 @@
     .controller("Umbraco.PropertyEditors.BlockEditor.SettingsController", [
         "$scope",
         "contentTypeResource",
-        function ($scope, contentTypeResource) {
-
-            if (!$scope.model.value) {
-                $scope.model.value = [];
-            }
-
-            $scope.addBlock = function (elementType) {
-
-                var block = {
-                    elementType: elementType.udi,
-                    settings: null
-                };
-
-                $scope.model.value.push(block);
-            }
+        "editorService",
+        function ($scope, contentTypeResource, editorService) {
 
+            $scope.blocks = [];
             $scope.elementTypes = [];
 
+            if ($scope.model.value) {
+                $scope.blocks = $scope.model.value;
+            }
+
             contentTypeResource.getAll()
-                .then(function (data) {
-                    $scope.elementTypes = _.where(data, { isElement: true });
+                .then(function (contentType) {
+                    $scope.elementTypes.push(contentType);
                 });
+
+            $scope.addBlock = function () {
+                var block = {};
+                openElementPicker(block);
+            };
+
+            $scope.removeBlock = function (index) {
+                $scope.blocks.splice(index, 1);
+            };
+
+            $scope.editSettings = function (block) {
+                openSettingsPicker(block);
+            };
+
+            function openElementPicker(block) {
+
+                var pickerOptions = {
+                    title: "Pick an element type",
+                    view: "views/common/infiniteeditors/treepicker/treepicker.html",
+                    size: "small",
+                    multiPicker: false,
+                    section: "settings",
+                    treeAlias: "documentTypes",
+                    entityType: "documentType",
+                    submit: function (model) {
+                        _.each(model.selection, function (elementType) {
+                            block.elementType = elementType.udi;
+                            $scope.blocks.push(block);
+                        });
+
+                        editorService.close();
+                    },
+                    close: function () {
+                        editorService.close();
+                    }
+                };
+
+                editorService.open(pickerOptions);
+            }
+
+            function openSettingsPicker(block) {
+
+                var pickerOptions = {
+                    title: "Block settings",
+                    view: "views/propertyeditors/blockeditor/block.settings.html",
+                    size: "small",
+                    submit: function (model) {
+                        block.settings = model;
+                        editorService.close();
+                    },
+                    close: function () {
+                        editorService.close();
+                    }
+                };
+
+                editorService.open(pickerOptions);
+            }
         }
     ]
 );
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.html
index 9b308f3bbf..dc1262812c 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.html
@@ -1,11 +1,23 @@
 <div ng-controller="Umbraco.PropertyEditors.BlockEditor.SettingsController">
-    <pre>
-        {{model.value | json}}
-    </pre>
 
-    <ul>
-        <li ng-repeat="elementType in elementTypes">
-            {{elementType.name}} <a href="" ng-click="addBlock(elementType)">Add</a>
-        </li>
-    </ul>
+    <pre>{{model.value | json}}</pre>
+
+    <div ng-repeat="block in blocks">
+        <strong>
+            {{block.elementType}}
+        </strong>
+
+        <a href="" ng-click="editSettings(block)">
+            <localize key="general_settings">Settings</localize>
+        </a>
+
+        <a href="" ng-click="removeBlock($index)">
+            <localize key="general_remove">Remove</localize>
+        </a>
+    </div>
+
+    <a href="" class="umb-node-preview-add" ng-click="addBlock()">
+        <localize key="general_add">Add block</localize>
+    </a>
+
 </div>

From 8636b5124e7c1bcc5207d26a39eb9610e9d8044b Mon Sep 17 00:00:00 2001
From: Callum Whyte <hey@callumwhyte.com>
Date: Mon, 20 May 2019 11:05:18 +0100
Subject: [PATCH 14/46] Copying add property functionality from doctype builder
 into block editor

---
 .../blockeditor/block.settings.html           | 55 ++++++++++++++++++-
 .../blockeditor/blockeditor.settings.html     |  2 +-
 2 files changed, 55 insertions(+), 2 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/block.settings.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/block.settings.html
index 3be46293b3..851126a11e 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/block.settings.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/block.settings.html
@@ -12,7 +12,60 @@
         <umb-editor-container class="block-form">
             <umb-box>
                 <umb-box-content>
-                    <p>Settings will go here...</p>
+
+                    <div class="content-type-editor-dialog edit-property-settings">
+
+                        <div class="umb-control-group" ng-if="!model.property.locked">
+                            <div class="control-group">
+                                <textarea class="editor-label"
+                                          data-element="property-name"
+                                          name="propertyLabel"
+                                          ng-model="model.property.label"
+                                          localize="placeholder"
+                                          placeholder="@placeholders_entername"
+                                          umb-auto-focus
+                                          focus-on-filled="true"
+                                          umb-auto-resize
+                                          required
+                                          ng-keypress="vm.submitOnEnter($event)">
+                                </textarea>
+                            </div>
+
+                            <div class="control-group -no-margin">
+                                <umb-generate-alias enable-lock="true" alias-from="model.property.label" alias="model.property.alias"></umb-generate-alias>
+                            </div>
+                        </div>
+
+                        <div class="editor-wrapper umb-control-group control-group" ng-model="model.property.editor" val-require-component ng-if="!model.property.locked">
+
+                            <a data-element="editor-add" href="" ng-if="!model.property.editor" class="editor-placeholder" hotkey="alt+shift+e" ng-click="vm.openDataTypePicker(model.property)">
+                                <localize key="shortcuts_addEditor"></localize>
+                            </a>
+
+                            <div class="editor clearfix" ng-if="model.property.editor">
+
+                                <a href="" class="editor-icon-wrapper" ng-click="vm.openDataTypePicker(model.property)">
+                                    <i class="icon {{ model.property.dataTypeIcon }}" ng-class="{'icon-autofill': model.property.dataTypeIcon == null}"></i>
+                                </a>
+
+                                <div class="editor-details">
+                                    <a href="" class="editor-name" ng-click="vm.openDataTypePicker(model.property)">{{ model.property.dataTypeName }}</a>
+                                    <a href="" class="editor-editor" ng-click="vm.openDataTypePicker(model.property)">{{ model.property.editor }}</a>
+                                </div>
+
+                                <a href class="editor-settings-icon pull-right"
+                                   ng-click="vm.openDataTypeSettings(model.property)"
+                                   hotkey="alt+shift+d"
+                                   ng-if="model.property.editor">
+                                    <i class="icon icon-settings"></i>
+                                </a>
+
+                            </div>
+
+                        </div>
+
+                    </div>
+
                 </umb-box-content>
             </umb-box>
         </umb-editor-container>
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.html
index dc1262812c..b658421791 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.html
@@ -17,7 +17,7 @@
     </div>
 
     <a href="" class="umb-node-preview-add" ng-click="addBlock()">
-        <localize key="general_add">Add block</localize>
+        <localize key="general_add">Add</localize>
     </a>
 
 </div>

From c494ad0adc94926cfbfb3bf37fe68f3dc69e214d Mon Sep 17 00:00:00 2001
From: Kenn Jacobsen <post@kennjacobsen.dk>
Date: Mon, 20 May 2019 15:36:57 +0200
Subject: [PATCH 15/46] Fake settings + ability to swap editor and block views

---
 .../umbblockeditorblock.directive.js          |  2 +-
 .../umbblockeditorblocks.directive.js         |  1 -
 .../blockeditor/blockeditor.block.html        | 26 ++++++++++---------
 .../blockeditor/blockeditor.blocks.html       | 13 ++++++----
 .../blockeditor/blockeditor.controller.js     | 18 ++++++++++++-
 5 files changed, 40 insertions(+), 20 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblock.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblock.directive.js
index 0db2873782..12cd2a868c 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblock.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblock.directive.js
@@ -1,11 +1,11 @@
 angular.module("umbraco.directives").directive('umbBlockEditorBlock', [
     function () {
         var link = function (scope, el, attr, ctrl) {
+            scope.view = attr.view;
         };
 
         return {
             restrict: "E",
-            replace: true,
             templateUrl: "views/propertyeditors/blockeditor/blockeditor.block.html",
             link: link
         };
diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblocks.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblocks.directive.js
index 9c67e134ea..bf1f8148e2 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblocks.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblocks.directive.js
@@ -5,7 +5,6 @@
 
         return {
             restrict: "E",
-            replace: true,
             templateUrl: "views/propertyeditors/blockeditor/blockeditor.blocks.html",
             link: link
         };
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.block.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.block.html
index 85a5e578a4..6aeeef7823 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.block.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.block.html
@@ -1,14 +1,16 @@
-<div>
-    <div style="cursor:pointer" ng-click="vm.editContent(block)" class="di">
-        Block identifier goes here (e.g. icon)
-    </div>
-    <div style="cursor:pointer" ng-click="vm.editSettings(block)" class="di">
-        <i class="icon icon-settings"></i>
-    </div>
-    <div style="cursor:move" class="di handle">
-        <i class="icon icon-navigation"></i>
-    </div>
-    <div style="cursor:pointer" ng-click="vm.remove(block)" class="di">
-        <i class="icon icon-trash"></i>
+<div class="handle" >
+    <div ng-if="view" ng-include="view"></div>
+    <div ng-if="!view">
+        <div>
+            <div style="cursor:pointer" ng-click="vm.editSettings(block)" class="di">
+                <i class="icon icon-settings"></i>
+            </div>
+            <div style="cursor:pointer" ng-click="vm.remove(block)" class="di">
+                <i class="icon icon-trash"></i>
+            </div>
+        </div>
+        <div style="cursor:pointer" ng-click="vm.editContent(block)">
+            Eventually a block identifier will go here (e.g. element type icon)
+        </div>
     </div>
 </div>
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.blocks.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.blocks.html
index 2763af5039..54817aa676 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.blocks.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.blocks.html
@@ -1,5 +1,8 @@
-<ul class="unstyled" ui-sortable="vm.sortableOptions" ng-model="model.value">
-    <li ng-repeat="block in model.value">
-        <umb-block-editor-block></umb-block-editor-block>
-    </li>
-</ul>
+<div>
+    <div ng-if="vm.blocksView" ng-include="vm.blocksView"></div>
+    <ul ng-if="!vm.blocksView" class="unstyled" ui-sortable="vm.sortableOptions" ng-model="model.value">
+        <li ng-repeat="block in model.value" style="border: 1px solid silver; margin-bottom: 4px; padding: 4px;">
+            <umb-block-editor-block></umb-block-editor-block>
+        </li>
+    </ul>
+</div>
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js
index 28bb91583c..2bd846eb71 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js
@@ -14,6 +14,8 @@
     vm.editContent = editContent;
     vm.editSettings = editSettings;
     vm.remove = remove;
+    // TODO: this needs to be configurable on data type level
+    vm.blocksView = null; // "/App_Plugins/MyBlockEditor/myblockeditor.html";
 
     // it would be awesome if we could load all scaffolds in one go... however we need to have an eye out for performance,
     // oddly enough it's been shown to actually be slower to load them all at once instead of one at a time
@@ -44,6 +46,12 @@
                     return blockConfig.elementType === scaffold.udi;
                 });
             });
+
+            _.each($scope.model.value, function (block) {
+                applyFakeSettings(block);
+            });
+
+
             vm.loading = false;
         }
     }
@@ -85,6 +93,7 @@
                 });
                 if ($scope.model.value.indexOf(block) < 0) {
                     $scope.model.value.push(block);
+                    applyFakeSettings(block);
                 }
 
                 editorService.close();
@@ -103,7 +112,7 @@
             view: "views/propertyeditors/blockeditor/blockeditor.editsettings.html",
             size: "medium",
             submit: function(model) {
-                console.log("TODO: something with block settings", model)
+                applyFakeSettings(block);
                 editorService.close();
             },
             close: function() {
@@ -114,11 +123,18 @@
     }
 
     function remove(block) {
+        // this should be replaced by a custom dialog (pending some PRs)
         if (confirm("TODO: Are you sure?")) {
             $scope.model.value.splice($scope.model.value.indexOf(block), 1);
         }
     }
 
     init();
+
+    // TODO: remove this (only for testing)
+    function applyFakeSettings(block) {
+        block.settings["cols"] = 1 + Math.floor(Math.random() * 3);
+        block.settings["rows"] = 1 + Math.floor(Math.random() * 2);
+    }
 }
 angular.module("umbraco").controller("Umbraco.PropertyEditors.BlockEditor.PropertyEditorController", BlockEditorPropertyEditorController);

From 8279e6208b6749d8e5da67ea6444f1d2b9103570 Mon Sep 17 00:00:00 2001
From: Nathan Woulfe <nathan@nathanw.com.au>
Date: Tue, 21 May 2019 00:31:39 +1000
Subject: [PATCH 16/46] update models to make thumbnail get-only, and map to
 file

---
 .../Configuration/Grid/IGridEditorConfig.cs   |  2 +
 .../PropertyEditors/GridEditor.cs             | 16 +++++
 .../Models/ContentEditing/ContentTypeBasic.cs | 65 ++-----------------
 .../NestedContentConfiguration.cs             | 15 +++++
 4 files changed, 40 insertions(+), 58 deletions(-)

diff --git a/src/Umbraco.Core/Configuration/Grid/IGridEditorConfig.cs b/src/Umbraco.Core/Configuration/Grid/IGridEditorConfig.cs
index e447f7f493..8d74354b94 100644
--- a/src/Umbraco.Core/Configuration/Grid/IGridEditorConfig.cs
+++ b/src/Umbraco.Core/Configuration/Grid/IGridEditorConfig.cs
@@ -10,6 +10,8 @@ namespace Umbraco.Core.Configuration.Grid
         string View { get; }
         string Render { get; }
         string Icon { get; }
+        string Thumbnail { get; }
+        string Description { get; }
         IDictionary<string, object> Config { get; }
     }
 }
diff --git a/src/Umbraco.Core/PropertyEditors/GridEditor.cs b/src/Umbraco.Core/PropertyEditors/GridEditor.cs
index 986eed9ccc..a55502e089 100644
--- a/src/Umbraco.Core/PropertyEditors/GridEditor.cs
+++ b/src/Umbraco.Core/PropertyEditors/GridEditor.cs
@@ -1,4 +1,5 @@
 using System.Collections.Generic;
+using System.IO;
 using Newtonsoft.Json;
 using Umbraco.Core.Configuration.Grid;
 using Umbraco.Core.IO;
@@ -38,6 +39,21 @@ namespace Umbraco.Core.PropertyEditors
         [JsonProperty("icon", Required = Required.Always)]
         public string Icon { get; set; }
 
+        [JsonProperty("thumbnail")]
+        public string Thumbnail {
+            get
+            {
+                var thumbsFolder = new DirectoryInfo(IOHelper.MapPath(SystemDirectories.Thumbnails));
+                var files = Directory.GetFiles(thumbsFolder.FullName, $"{Alias}.*");
+
+                return files.Length == 1 ?
+                    IOHelper.ResolveVirtualUrl($"{SystemDirectories.Thumbnails}/{Path.GetFileName(files[0])}") : null;
+            }
+        }
+
+        [JsonProperty("description")]
+        public string Description { get; set; }
+
         [JsonProperty("config")]
         public IDictionary<string, object> Config { get; set; }
 
diff --git a/src/Umbraco.Web/Models/ContentEditing/ContentTypeBasic.cs b/src/Umbraco.Web/Models/ContentEditing/ContentTypeBasic.cs
index 56d81a3189..b0af0882d8 100644
--- a/src/Umbraco.Web/Models/ContentEditing/ContentTypeBasic.cs
+++ b/src/Umbraco.Web/Models/ContentEditing/ContentTypeBasic.cs
@@ -2,6 +2,7 @@
 using System.Collections.Generic;
 using System.ComponentModel;
 using System.ComponentModel.DataAnnotations;
+using System.IO;
 using System.Runtime.Serialization;
 using Umbraco.Core;
 using Umbraco.Core.Composing;
@@ -45,71 +46,19 @@ namespace Umbraco.Web.Models.ContentEditing
         public string Description { get; set; }
 
         [DataMember(Name = "thumbnail")]
-        public string Thumbnail { get; set; }
-
-        /// <summary>
-        /// Returns true if the icon represents a CSS class instead of a file path
-        /// </summary>
-        [DataMember(Name = "iconIsClass")]
         [ReadOnly(true)]
-        public bool IconIsClass
+        public string Thumbnail
         {
             get
             {
-                if (Icon.IsNullOrWhiteSpace())
+                var thumbsFolder = new DirectoryInfo(IOHelper.MapPath(SystemDirectories.Thumbnails));
+                var files = Directory.GetFiles(thumbsFolder.FullName, $"{Alias}.*");
+                if (files.Length == 1) // ignore duplicates
                 {
-                    return true;
+                    return IOHelper.ResolveVirtualUrl($"{SystemDirectories.Thumbnails}/{System.IO.Path.GetFileName(files[0])}");
                 }
-                //if it starts with a '.' or doesn't contain a '.' at all then it is a class
-                return Icon.StartsWith(".") || Icon.Contains(".") == false;
-            }
-        }
 
-        /// <summary>
-        /// Returns the icon file path if the icon is not a class, otherwise returns an empty string
-        /// </summary>
-        [DataMember(Name = "iconFilePath")]
-        [ReadOnly(true)]
-        public string IconFilePath
-        {
-            get
-            {
-                return IconIsClass
-                    ? string.Empty
-                    : string.Format("{0}images/umbraco/{1}", Current.Configs.Global().Path.EnsureEndsWith("/"), Icon);
-            }
-        }
-
-        /// <summary>
-        /// Returns true if the icon represents a CSS class instead of a file path
-        /// </summary>
-        [DataMember(Name = "thumbnailIsClass")]
-        [ReadOnly(true)]
-        public bool ThumbnailIsClass
-        {
-            get
-            {
-                if (Thumbnail.IsNullOrWhiteSpace())
-                {
-                    return true;
-                }
-                //if it starts with a '.' or doesn't contain a '.' at all then it is a class
-                return Thumbnail.StartsWith(".") || Thumbnail.Contains(".") == false;
-            }
-        }
-
-        /// <summary>
-        /// Returns the icon file path if the icon is not a class, otherwise returns an empty string
-        /// </summary>
-        [DataMember(Name = "thumbnailFilePath")]
-        [ReadOnly(true)]
-        public string ThumbnailFilePath
-        {
-            get
-            {
-                return ThumbnailIsClass
-                           ? string.Empty
-                           : IOHelper.ResolveUrl("~/umbraco/images/thumbnails/" + Thumbnail);
+                return null;                
             }
         }
 
diff --git a/src/Umbraco.Web/PropertyEditors/NestedContentConfiguration.cs b/src/Umbraco.Web/PropertyEditors/NestedContentConfiguration.cs
index b904a2250d..74c3f452e7 100644
--- a/src/Umbraco.Web/PropertyEditors/NestedContentConfiguration.cs
+++ b/src/Umbraco.Web/PropertyEditors/NestedContentConfiguration.cs
@@ -1,4 +1,6 @@
 using Newtonsoft.Json;
+using System.IO;
+using Umbraco.Core.IO;
 using Umbraco.Core.PropertyEditors;
 
 namespace Umbraco.Web.PropertyEditors
@@ -36,6 +38,19 @@ namespace Umbraco.Web.PropertyEditors
 
             [JsonProperty("nameTemplate")]
             public string Template { get; set; }
+
+            [JsonProperty("thumbnail")]
+            public string Thumbnail
+            {
+                get
+                {
+                    var thumbsFolder = new DirectoryInfo(IOHelper.MapPath(SystemDirectories.Thumbnails));
+                    var files = Directory.GetFiles(thumbsFolder.FullName, $"{Alias}.*");
+
+                    return files.Length == 1 ?
+                        IOHelper.ResolveVirtualUrl($"{SystemDirectories.Thumbnails}/{Path.GetFileName(files[0])}") : null;
+                }
+            }
         }
     }
 }

From 1eb1d4dc63092769f775a20f8685e25239d793f8 Mon Sep 17 00:00:00 2001
From: Nathan Woulfe <nathan@nathanw.com.au>
Date: Tue, 21 May 2019 00:31:55 +1000
Subject: [PATCH 17/46] path to thumbnail folder

---
 src/Umbraco.Core/IO/SystemDirectories.cs | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/Umbraco.Core/IO/SystemDirectories.cs b/src/Umbraco.Core/IO/SystemDirectories.cs
index 2f33d82bdc..9f74accd4a 100644
--- a/src/Umbraco.Core/IO/SystemDirectories.cs
+++ b/src/Umbraco.Core/IO/SystemDirectories.cs
@@ -39,6 +39,8 @@ namespace Umbraco.Core.IO
 
         public static string Preview => Data + "/preview";
 
+        public static string Thumbnails => Config + "/thumbnails";
+
         private static string _root;
 
         /// <summary>

From 22141af54c9c1d1252a59dac8600e24f3f496f48 Mon Sep 17 00:00:00 2001
From: Nathan Woulfe <nathan@nathanw.com.au>
Date: Tue, 21 May 2019 00:32:36 +1000
Subject: [PATCH 18/46] thumbnail is get-only and convention-mapped

---
 src/Umbraco.Core/Models/ContentTypeBase.cs | 19 +++++++++++++------
 1 file changed, 13 insertions(+), 6 deletions(-)

diff --git a/src/Umbraco.Core/Models/ContentTypeBase.cs b/src/Umbraco.Core/Models/ContentTypeBase.cs
index 04bcb7424a..b04b30b3cc 100644
--- a/src/Umbraco.Core/Models/ContentTypeBase.cs
+++ b/src/Umbraco.Core/Models/ContentTypeBase.cs
@@ -2,8 +2,10 @@
 using System.Collections.Generic;
 using System.Collections.Specialized;
 using System.Diagnostics;
+using System.IO;
 using System.Linq;
 using System.Runtime.Serialization;
+using Umbraco.Core.IO;
 using Umbraco.Core.Models.Entities;
 using Umbraco.Core.Strings;
 
@@ -20,7 +22,6 @@ namespace Umbraco.Core.Models
         private string _alias;
         private string _description;
         private string _icon = "icon-folder";
-        private string _thumbnail = "folder.png";
         private bool _allowedAsRoot; // note: only one that's not 'pure element type'
         private bool _isContainer;
         private bool _isElement;
@@ -152,8 +153,14 @@ namespace Umbraco.Core.Models
         [DataMember]
         public string Thumbnail
         {
-            get => _thumbnail;
-            set => SetPropertyValueAndDetectChanges(value, ref _thumbnail, nameof(Thumbnail));
+            get
+            {
+                var thumbsFolder = new DirectoryInfo(IOHelper.MapPath(SystemDirectories.Thumbnails));
+                var files = Directory.GetFiles(thumbsFolder.FullName, $"{Alias}.*");
+
+                return files.Length == 1 ?
+                    IOHelper.ResolveVirtualUrl($"{SystemDirectories.Thumbnails}/{System.IO.Path.GetFileName(files[0])}") : null;
+            }
         }
 
         /// <summary>
@@ -472,7 +479,7 @@ namespace Umbraco.Core.Models
         {
             base.PerformDeepClone(clone);
 
-            var clonedEntity = (ContentTypeBase) clone;
+            var clonedEntity = (ContentTypeBase)clone;
 
             if (clonedEntity._noGroupPropertyTypes != null)
             {
@@ -481,14 +488,14 @@ namespace Umbraco.Core.Models
                 // we end up with duplicates, see: http://issues.umbraco.org/issue/U4-4842
 
                 clonedEntity._noGroupPropertyTypes.CollectionChanged -= PropertyTypesChanged;                    //clear this event handler if any
-                clonedEntity._noGroupPropertyTypes = (PropertyTypeCollection) _noGroupPropertyTypes.DeepClone(); //manually deep clone
+                clonedEntity._noGroupPropertyTypes = (PropertyTypeCollection)_noGroupPropertyTypes.DeepClone(); //manually deep clone
                 clonedEntity._noGroupPropertyTypes.CollectionChanged += clonedEntity.PropertyTypesChanged;              //re-assign correct event handler
             }
 
             if (clonedEntity._propertyGroups != null)
             {
                 clonedEntity._propertyGroups.CollectionChanged -= PropertyGroupsChanged;              //clear this event handler if any
-                clonedEntity._propertyGroups = (PropertyGroupCollection) _propertyGroups.DeepClone(); //manually deep clone
+                clonedEntity._propertyGroups = (PropertyGroupCollection)_propertyGroups.DeepClone(); //manually deep clone
                 clonedEntity._propertyGroups.CollectionChanged += clonedEntity.PropertyGroupsChanged;        //re-assign correct event handler
             }
         }

From f657c635efda23c1816701c97a45022665c68c93 Mon Sep 17 00:00:00 2001
From: Nathan Woulfe <nathan@nathanw.com.au>
Date: Tue, 21 May 2019 00:33:52 +1000
Subject: [PATCH 19/46] remove old thumbnail/icon stuff

---
 src/Umbraco.Core/Models/IContentTypeBase.cs   |  2 +-
 .../Packaging/PackageDataInstallation.cs      |  1 -
 .../Factories/ContentTypeFactory.cs           |  1 -
 .../Persistence/Mappers/ContentTypeMapper.cs  |  1 -
 .../Mapping/ContentTypeMapDefinition.cs       |  4 --
 src/Umbraco.Web/Models/Trees/TreeNode.cs      | 42 -------------------
 6 files changed, 1 insertion(+), 50 deletions(-)

diff --git a/src/Umbraco.Core/Models/IContentTypeBase.cs b/src/Umbraco.Core/Models/IContentTypeBase.cs
index 5f1fe6ed49..773b80f917 100644
--- a/src/Umbraco.Core/Models/IContentTypeBase.cs
+++ b/src/Umbraco.Core/Models/IContentTypeBase.cs
@@ -33,7 +33,7 @@ namespace Umbraco.Core.Models
         /// <summary>
         /// Gets or Sets the Thumbnail for the ContentType
         /// </summary>
-        string Thumbnail { get; set; }
+        string Thumbnail { get; }
 
         /// <summary>
         /// Gets or Sets a boolean indicating whether this ContentType is allowed at the root
diff --git a/src/Umbraco.Core/Packaging/PackageDataInstallation.cs b/src/Umbraco.Core/Packaging/PackageDataInstallation.cs
index c811f484bc..de8033ee3c 100644
--- a/src/Umbraco.Core/Packaging/PackageDataInstallation.cs
+++ b/src/Umbraco.Core/Packaging/PackageDataInstallation.cs
@@ -572,7 +572,6 @@ namespace Umbraco.Core.Packaging
 
             contentType.Name = infoElement.Element("Name").Value;
             contentType.Icon = infoElement.Element("Icon").Value;
-            contentType.Thumbnail = infoElement.Element("Thumbnail").Value;
             contentType.Description = infoElement.Element("Description").Value;
 
             //NOTE AllowAtRoot is a new property in the package xml so we need to verify it exists before using it.
diff --git a/src/Umbraco.Core/Persistence/Factories/ContentTypeFactory.cs b/src/Umbraco.Core/Persistence/Factories/ContentTypeFactory.cs
index 54cfee0ffa..aab92c7605 100644
--- a/src/Umbraco.Core/Persistence/Factories/ContentTypeFactory.cs
+++ b/src/Umbraco.Core/Persistence/Factories/ContentTypeFactory.cs
@@ -110,7 +110,6 @@ namespace Umbraco.Core.Persistence.Factories
             entity.Alias = dto.Alias;
             entity.Name = dto.NodeDto.Text;
             entity.Icon = dto.Icon;
-            entity.Thumbnail = dto.Thumbnail;
             entity.SortOrder = dto.NodeDto.SortOrder;
             entity.Description = dto.Description;
             entity.CreateDate = dto.NodeDto.CreateDate;
diff --git a/src/Umbraco.Core/Persistence/Mappers/ContentTypeMapper.cs b/src/Umbraco.Core/Persistence/Mappers/ContentTypeMapper.cs
index b14fc546c8..987b87d65e 100644
--- a/src/Umbraco.Core/Persistence/Mappers/ContentTypeMapper.cs
+++ b/src/Umbraco.Core/Persistence/Mappers/ContentTypeMapper.cs
@@ -35,7 +35,6 @@ namespace Umbraco.Core.Persistence.Mappers
             DefineMap<ContentType, ContentTypeDto>(nameof(ContentType.Icon), nameof(ContentTypeDto.Icon));
             DefineMap<ContentType, ContentTypeDto>(nameof(ContentType.IsContainer), nameof(ContentTypeDto.IsContainer));
             DefineMap<ContentType, ContentTypeDto>(nameof(ContentType.IsElement), nameof(ContentTypeDto.IsElement));
-            DefineMap<ContentType, ContentTypeDto>(nameof(ContentType.Thumbnail), nameof(ContentTypeDto.Thumbnail));
         }
     }
 }
diff --git a/src/Umbraco.Web/Models/Mapping/ContentTypeMapDefinition.cs b/src/Umbraco.Web/Models/Mapping/ContentTypeMapDefinition.cs
index a438f04781..19932c4ca3 100644
--- a/src/Umbraco.Web/Models/Mapping/ContentTypeMapDefinition.cs
+++ b/src/Umbraco.Web/Models/Mapping/ContentTypeMapDefinition.cs
@@ -184,7 +184,6 @@ namespace Umbraco.Web.Models.Mapping
             target.Name = source.Name;
             target.ParentId = source.ParentId;
             target.Path = source.Path;
-            target.Thumbnail = source.Thumbnail;
             target.Trashed = source.Trashed;
             target.UpdateDate = source.UpdateDate;
         }
@@ -384,7 +383,6 @@ namespace Umbraco.Web.Models.Mapping
             target.Name = source.Name;
             target.ParentId = source.ParentId;
             target.Path = source.Path;
-            target.Thumbnail = source.Thumbnail;
 
             target.AllowedAsRoot = source.AllowAsRoot;
             target.AllowedContentTypes = source.AllowedContentTypes.Select((t, i) => new ContentTypeSort(t, i));
@@ -480,7 +478,6 @@ namespace Umbraco.Web.Models.Mapping
             target.Name = source.Name;
             target.ParentId = source.ParentId;
             target.Path = source.Path;
-            target.Thumbnail = source.Thumbnail;
             target.Udi = MapContentTypeUdi(source);
             target.UpdateDate = source.UpdateDate;
 
@@ -517,7 +514,6 @@ namespace Umbraco.Web.Models.Mapping
             target.Name = source.Name;
             target.ParentId = source.ParentId;
             target.Path = source.Path;
-            target.Thumbnail = source.Thumbnail;
             target.Trashed = source.Trashed;
             target.Udi = source.Udi;
         }
diff --git a/src/Umbraco.Web/Models/Trees/TreeNode.cs b/src/Umbraco.Web/Models/Trees/TreeNode.cs
index 63614b141f..f32b10c34d 100644
--- a/src/Umbraco.Web/Models/Trees/TreeNode.cs
+++ b/src/Umbraco.Web/Models/Trees/TreeNode.cs
@@ -75,48 +75,6 @@ namespace Umbraco.Web.Models.Trees
         [DataMember(Name = "menuUrl")]
         public string MenuUrl { get; set; }
 
-        /// <summary>
-        /// Returns true if the icon represents a CSS class instead of a file path
-        /// </summary>
-        [DataMember(Name = "iconIsClass")]
-        public bool IconIsClass
-        {
-            get
-            {
-                if (Icon.IsNullOrWhiteSpace())
-                {
-                    return true;
-                }
-
-                if (Icon.StartsWith(".."))
-                    return false;
-
-
-                //if it starts with a '.' or doesn't contain a '.' at all then it is a class
-                return Icon.StartsWith(".") || Icon.Contains(".") == false;
-            }
-        }
-
-        /// <summary>
-        /// Returns the icon file path if the icon is not a class, otherwise returns an empty string
-        /// </summary>
-        [DataMember(Name = "iconFilePath")]
-        public string IconFilePath
-        {
-            get
-            {
-                if (IconIsClass)
-                    return string.Empty;
-
-                //absolute path with or without tilde
-                if (Icon.StartsWith("~") || Icon.StartsWith("/"))
-                    return IOHelper.ResolveUrl("~" + Icon.TrimStart('~'));
-
-                //legacy icon path
-                return string.Format("{0}images/umbraco/{1}", Current.Configs.Global().Path.EnsureEndsWith("/"), Icon);
-            }
-        }
-
         /// <summary>
         /// A list of additional/custom css classes to assign to the node
         /// </summary>

From f17cd844ff24d79aa74efea22bcd001ec3238619 Mon Sep 17 00:00:00 2001
From: Nathan Woulfe <nathan@nathanw.com.au>
Date: Tue, 21 May 2019 00:35:21 +1000
Subject: [PATCH 20/46] wire up all the ui stuff for previews in pickers,
 showing name in button when one option exists, proper picker for blocks

---
 src/Umbraco.Web.UI.Client/package-lock.json   |  99 +++----
 .../src/less/components/card.less             | 275 +++++++++++-------
 .../src/less/components/overlays.less         |   4 +
 .../itempicker/itempicker.controller.js       |   8 +-
 .../overlays/itempicker/itempicker.html       |  58 ++--
 .../blockeditor/blockeditor.controller.js     | 100 ++++++-
 .../blockeditor/blockeditor.html              |  20 +-
 .../propertyeditors/grid/grid.controller.js   |  37 ++-
 .../src/views/propertyeditors/grid/grid.html  |   7 +-
 .../nestedcontent/nestedcontent.controller.js |  13 +-
 .../nestedcontent/nestedcontent.html          |   3 +-
 11 files changed, 409 insertions(+), 215 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/package-lock.json b/src/Umbraco.Web.UI.Client/package-lock.json
index c1c85a9688..0750937cb6 100644
--- a/src/Umbraco.Web.UI.Client/package-lock.json
+++ b/src/Umbraco.Web.UI.Client/package-lock.json
@@ -1222,7 +1222,7 @@
     "arraybuffer.slice": {
       "version": "0.0.7",
       "resolved": "https://registry.npmjs.org/arraybuffer.slice/-/arraybuffer.slice-0.0.7.tgz",
-      "integrity": "sha512-wGUIVQXuehL5TCqQun8OW81jGzAWycqzFF8lFp+GOM5BXLYj3bKNsYC4daB7n6XjCqxQA/qgTJ+8ANR3acjrog==",
+      "integrity": "sha1-O7xCdd1YTMGxCAm4nU6LY6aednU=",
       "dev": true
     },
     "asap": {
@@ -1284,7 +1284,7 @@
     "async-limiter": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/async-limiter/-/async-limiter-1.0.0.tgz",
-      "integrity": "sha512-jp/uFnooOiO+L211eZOoSyzpOITMXx1rBITauYykG3BRYPu8h0UcxsPNB04RR5vo4Tyz3+ay17tR6JVf9qzYWg==",
+      "integrity": "sha1-ePrtjD0HSrgfIrTphdeehzj3IPg=",
       "dev": true
     },
     "asynckit": {
@@ -1535,7 +1535,7 @@
     },
     "bl": {
       "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/bl/-/bl-1.2.2.tgz",
+      "resolved": "http://registry.npmjs.org/bl/-/bl-1.2.2.tgz",
       "integrity": "sha512-e8tQYnZodmebYDWGH7KMRvtzKXaJHx3BbilrgZCfvyLUYdKpK1t5PSPmpkny/SgiTSCnjfLW7v5rlONXVFkQEA==",
       "dev": true,
       "requires": {
@@ -1551,7 +1551,7 @@
         },
         "readable-stream": {
           "version": "2.3.6",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.6.tgz",
+          "resolved": "http://registry.npmjs.org/readable-stream/-/readable-stream-2.3.6.tgz",
           "integrity": "sha512-tQtKA9WIAhBF3+VLAseyMqZeBjW0AHJoxOtYqSUZNJxauErmLbVm2FW1y+J/YA9dUrAC39ITejlZWhVIwawkKw==",
           "dev": true,
           "requires": {
@@ -1566,7 +1566,7 @@
         },
         "string_decoder": {
           "version": "1.1.1",
-          "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
+          "resolved": "http://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
           "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
           "dev": true,
           "requires": {
@@ -1740,7 +1740,7 @@
     "buffer-alloc": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/buffer-alloc/-/buffer-alloc-1.2.0.tgz",
-      "integrity": "sha512-CFsHQgjtW1UChdXgbyJGtnm+O/uLQeZdtbDo8mfUgYXCHSM1wgrVxXm6bSyrUuErEb+4sYVGCzASBRot7zyrow==",
+      "integrity": "sha1-iQ3ZDZI6hz4I4Q5f1RpX5bfM4Ow=",
       "dev": true,
       "requires": {
         "buffer-alloc-unsafe": "^1.1.0",
@@ -1750,7 +1750,7 @@
     "buffer-alloc-unsafe": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/buffer-alloc-unsafe/-/buffer-alloc-unsafe-1.1.0.tgz",
-      "integrity": "sha512-TEM2iMIEQdJ2yjPJoSIsldnleVaAk1oW3DBVUykyOLsEsFmEc9kn+SFFPz+gl54KQNxlDnAwCXosOS9Okx2xAg==",
+      "integrity": "sha1-vX3CauKXLQ7aJTvgYdupkjScGfA=",
       "dev": true
     },
     "buffer-crc32": {
@@ -2516,7 +2516,7 @@
     "content-type": {
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/content-type/-/content-type-1.0.4.tgz",
-      "integrity": "sha512-hIP3EEPs8tB9AT1L+NUqtwOAps4mk2Zob89MWXMHjHWg9milF/j4osnnQLXBCBFBk/tvIG/tUc9mOUJiPBhPXA==",
+      "integrity": "sha1-4TjMdeBAxyexlm/l5fjJruJW/js=",
       "dev": true
     },
     "continuable-cache": {
@@ -4045,7 +4045,7 @@
         "debug": {
           "version": "3.1.0",
           "resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
-          "integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
+          "integrity": "sha1-W7WgZyYotkFJVmuhaBnmFRjGcmE=",
           "dev": true,
           "requires": {
             "ms": "2.0.0"
@@ -4061,7 +4061,7 @@
     },
     "engine.io-client": {
       "version": "3.2.1",
-      "resolved": "https://registry.npmjs.org/engine.io-client/-/engine.io-client-3.2.1.tgz",
+      "resolved": "http://registry.npmjs.org/engine.io-client/-/engine.io-client-3.2.1.tgz",
       "integrity": "sha512-y5AbkytWeM4jQr7m/koQLc5AxpRKC1hEVUb/s1FUAWEJq5AzJJ4NLvzuKPuxtDi5Mq755WuDvZ6Iv2rXj4PTzw==",
       "dev": true,
       "requires": {
@@ -4081,7 +4081,7 @@
         "debug": {
           "version": "3.1.0",
           "resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
-          "integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
+          "integrity": "sha1-W7WgZyYotkFJVmuhaBnmFRjGcmE=",
           "dev": true,
           "requires": {
             "ms": "2.0.0"
@@ -4476,13 +4476,13 @@
     "eventemitter3": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-3.1.0.tgz",
-      "integrity": "sha512-ivIvhpq/Y0uSjcHDcOIccjmYjGLcP09MFGE7ysAwkAvkXfpZlC985pH2/ui64DKazbTW/4kN3yqozUxlXzI6cA==",
+      "integrity": "sha1-CQtNbNvWRe0Qv3UNS1QHlC17oWM=",
       "dev": true
     },
     "exec-buffer": {
       "version": "3.2.0",
       "resolved": "https://registry.npmjs.org/exec-buffer/-/exec-buffer-3.2.0.tgz",
-      "integrity": "sha512-wsiD+2Tp6BWHoVv3B+5Dcx6E7u5zky+hUwOHjuH2hKSLR3dvRmX8fk8UD8uqQixHs4Wk6eDmiegVrMPjKj7wpA==",
+      "integrity": "sha1-sWhtvZBMfPmC5lLB9aebHlVzCCs=",
       "dev": true,
       "optional": true,
       "requires": {
@@ -5244,7 +5244,7 @@
     "fs-constants": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/fs-constants/-/fs-constants-1.0.0.tgz",
-      "integrity": "sha512-y6OAwoSIf7FyjMIv94u+b5rdheZEjzR63GTyZJm5qh4Bi+2YgwLCcI/fPFZkL5PSixOt6ZNKm+w+Hfp/Bciwow==",
+      "integrity": "sha1-a+Dem+mYzhavivwkSXue6bfM2a0=",
       "dev": true
     },
     "fs-extra": {
@@ -5309,8 +5309,7 @@
         "ansi-regex": {
           "version": "2.1.1",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "aproba": {
           "version": "1.2.0",
@@ -5331,14 +5330,12 @@
         "balanced-match": {
           "version": "1.0.0",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "brace-expansion": {
           "version": "1.1.11",
           "bundled": true,
           "dev": true,
-          "optional": true,
           "requires": {
             "balanced-match": "^1.0.0",
             "concat-map": "0.0.1"
@@ -5353,20 +5350,17 @@
         "code-point-at": {
           "version": "1.1.0",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "concat-map": {
           "version": "0.0.1",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "console-control-strings": {
           "version": "1.1.0",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "core-util-is": {
           "version": "1.0.2",
@@ -5483,8 +5477,7 @@
         "inherits": {
           "version": "2.0.3",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "ini": {
           "version": "1.3.5",
@@ -5496,7 +5489,6 @@
           "version": "1.0.0",
           "bundled": true,
           "dev": true,
-          "optional": true,
           "requires": {
             "number-is-nan": "^1.0.0"
           }
@@ -5511,7 +5503,6 @@
           "version": "3.0.4",
           "bundled": true,
           "dev": true,
-          "optional": true,
           "requires": {
             "brace-expansion": "^1.1.7"
           }
@@ -5519,14 +5510,12 @@
         "minimist": {
           "version": "0.0.8",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "minipass": {
           "version": "2.2.4",
           "bundled": true,
           "dev": true,
-          "optional": true,
           "requires": {
             "safe-buffer": "^5.1.1",
             "yallist": "^3.0.0"
@@ -5545,7 +5534,6 @@
           "version": "0.5.1",
           "bundled": true,
           "dev": true,
-          "optional": true,
           "requires": {
             "minimist": "0.0.8"
           }
@@ -5626,8 +5614,7 @@
         "number-is-nan": {
           "version": "1.0.1",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "object-assign": {
           "version": "4.1.1",
@@ -5639,7 +5626,6 @@
           "version": "1.4.0",
           "bundled": true,
           "dev": true,
-          "optional": true,
           "requires": {
             "wrappy": "1"
           }
@@ -5725,8 +5711,7 @@
         "safe-buffer": {
           "version": "5.1.1",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "safer-buffer": {
           "version": "2.1.2",
@@ -5762,7 +5747,6 @@
           "version": "1.0.2",
           "bundled": true,
           "dev": true,
-          "optional": true,
           "requires": {
             "code-point-at": "^1.0.0",
             "is-fullwidth-code-point": "^1.0.0",
@@ -5782,7 +5766,6 @@
           "version": "3.0.1",
           "bundled": true,
           "dev": true,
-          "optional": true,
           "requires": {
             "ansi-regex": "^2.0.0"
           }
@@ -5826,14 +5809,12 @@
         "wrappy": {
           "version": "1.0.2",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         },
         "yallist": {
           "version": "3.0.2",
           "bundled": true,
-          "dev": true,
-          "optional": true
+          "dev": true
         }
       }
     },
@@ -7575,7 +7556,7 @@
     "has-binary2": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/has-binary2/-/has-binary2-1.0.3.tgz",
-      "integrity": "sha512-G1LWKhDSvhGeAQ8mPVQlqNcOB2sJdwATtZKl2pDKKHfpf/rYj24lkinxf69blJbnsvtqqNU+L3SL50vzZhXOnw==",
+      "integrity": "sha1-d3asYn8+p3JQz8My2rfd9eT10R0=",
       "dev": true,
       "requires": {
         "isarray": "2.0.1"
@@ -7778,7 +7759,7 @@
     "http-proxy": {
       "version": "1.17.0",
       "resolved": "https://registry.npmjs.org/http-proxy/-/http-proxy-1.17.0.tgz",
-      "integrity": "sha512-Taqn+3nNvYRfJ3bGvKfBSRwy1v6eePlm3oc/aWVxZp57DQr5Eq3xhKJi7Z4hZpS8PC3H4qI+Yly5EmFacGuA/g==",
+      "integrity": "sha1-etOElGWPhGBeL220Q230EPTlvpo=",
       "dev": true,
       "requires": {
         "eventemitter3": "^3.0.0",
@@ -9335,7 +9316,7 @@
     "lowercase-keys": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/lowercase-keys/-/lowercase-keys-1.0.1.tgz",
-      "integrity": "sha512-G2Lj61tXDnVFFOi8VZds+SoQjtQC3dgokKdDG2mTm1tx4m50NUHBOZSBwQQHyy0V12A0JTG4icfZQH+xPyh8VA==",
+      "integrity": "sha1-b54wtHCE2XGnyCD/FabFFnt0wm8=",
       "dev": true
     },
     "lpad-align": {
@@ -9369,7 +9350,7 @@
     "make-dir": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-1.3.0.tgz",
-      "integrity": "sha512-2w31R7SJtieJJnQtGc7RVL2StM2vGYVfqUOvUDxH6bC6aJTxPxTF0GnIgCyu7tjockiUWAYQRbxa7vKn34s5sQ==",
+      "integrity": "sha1-ecEDO4BRW9bSTsmTPoYMp17ifww=",
       "dev": true,
       "requires": {
         "pify": "^3.0.0"
@@ -12735,7 +12716,7 @@
       "dependencies": {
         "minimist": {
           "version": "0.0.10",
-          "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.10.tgz",
+          "resolved": "http://registry.npmjs.org/minimist/-/minimist-0.0.10.tgz",
           "integrity": "sha1-3j+YVD2/lggr5IrRoMfNqDYwHc8=",
           "dev": true
         },
@@ -13616,7 +13597,7 @@
     "qjobs": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/qjobs/-/qjobs-1.2.0.tgz",
-      "integrity": "sha512-8YOJEHtxpySA3fFDyCRxA+UUV+fA+rTWnuWvylOK/NCjhY+b4ocCtmu8TtsWb+mYeU+GCHf/S66KZF/AsteKHg==",
+      "integrity": "sha1-xF6cYYAL0IfviNfiVkI73Unl0HE=",
       "dev": true
     },
     "qs": {
@@ -14775,7 +14756,7 @@
     },
     "socket.io-parser": {
       "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/socket.io-parser/-/socket.io-parser-3.2.0.tgz",
+      "resolved": "http://registry.npmjs.org/socket.io-parser/-/socket.io-parser-3.2.0.tgz",
       "integrity": "sha512-FYiBx7rc/KORMJlgsXysflWx/RIvtqZbyGLlHZvjfmPTPeuD/I8MaW7cfFrj5tRltICJdgwflhfZ3NVVbVLFQA==",
       "dev": true,
       "requires": {
@@ -14787,7 +14768,7 @@
         "debug": {
           "version": "3.1.0",
           "resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
-          "integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
+          "integrity": "sha1-W7WgZyYotkFJVmuhaBnmFRjGcmE=",
           "dev": true,
           "requires": {
             "ms": "2.0.0"
@@ -14920,7 +14901,7 @@
         },
         "chalk": {
           "version": "1.1.3",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "resolved": "http://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
           "dev": true,
           "optional": true,
@@ -15328,7 +15309,7 @@
     "strip-outer": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/strip-outer/-/strip-outer-1.0.1.tgz",
-      "integrity": "sha512-k55yxKHwaXnpYGsOzg4Vl8+tDrWylxDEpknGjhTiZB8dFRU5rTo9CAzeycivxV3s+zlTKwrs6WxMxR95n26kwg==",
+      "integrity": "sha1-sv0qv2YEudHmATBXGV34Nrip1jE=",
       "dev": true,
       "requires": {
         "escape-string-regexp": "^1.0.2"
@@ -15488,7 +15469,7 @@
         },
         "readable-stream": {
           "version": "2.3.6",
-          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.6.tgz",
+          "resolved": "http://registry.npmjs.org/readable-stream/-/readable-stream-2.3.6.tgz",
           "integrity": "sha512-tQtKA9WIAhBF3+VLAseyMqZeBjW0AHJoxOtYqSUZNJxauErmLbVm2FW1y+J/YA9dUrAC39ITejlZWhVIwawkKw==",
           "dev": true,
           "requires": {
@@ -15731,7 +15712,7 @@
     "to-buffer": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/to-buffer/-/to-buffer-1.1.1.tgz",
-      "integrity": "sha512-lx9B5iv7msuFYE3dytT+KE5tap+rNYw+K4jVkb9R/asAb+pbBSM17jtunHplhBe6RRJdZx3Pn2Jph24O32mOVg==",
+      "integrity": "sha1-STvUj2LXxD/N7TE6A9ytsuEhOoA=",
       "dev": true
     },
     "to-fast-properties": {
@@ -15860,7 +15841,7 @@
     "type-is": {
       "version": "1.6.16",
       "resolved": "https://registry.npmjs.org/type-is/-/type-is-1.6.16.tgz",
-      "integrity": "sha512-HRkVv/5qY2G6I8iab9cI7v1bOIdhm94dVjQCPFElW9W+3GeDOSHmy2EBYe4VTApuzolPcmgFTN3ftVJRKR2J9Q==",
+      "integrity": "sha1-+JzjQVQcZysl7nrjxz3uOyvlAZQ=",
       "dev": true,
       "requires": {
         "media-typer": "0.3.0",
@@ -15902,7 +15883,7 @@
     "ultron": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/ultron/-/ultron-1.1.1.tgz",
-      "integrity": "sha512-UIEXBNeYmKptWH6z8ZnqTeS8fV74zG0/eRU9VGkpzz+LIJNs8W/zM/L+7ctCkRrgbNnnR0xxw4bKOr0cW0N0Og==",
+      "integrity": "sha1-n+FTahCmZKZSZqHjzPhf02MCvJw=",
       "dev": true
     },
     "unc-path-regex": {
@@ -16505,7 +16486,7 @@
     "ws": {
       "version": "3.3.3",
       "resolved": "https://registry.npmjs.org/ws/-/ws-3.3.3.tgz",
-      "integrity": "sha512-nnWLa/NwZSt4KQJu51MYlCcSQ5g7INpOrOMt4XV8j4dqTXdmlUmSHQ8/oLC069ckre0fRsgfvsKwbTdtKLCDkA==",
+      "integrity": "sha1-8c+E/i1ekB686U767OeF8YeiKPI=",
       "dev": true,
       "requires": {
         "async-limiter": "~1.0.0",
diff --git a/src/Umbraco.Web.UI.Client/src/less/components/card.less b/src/Umbraco.Web.UI.Client/src/less/components/card.less
index 8324698685..ce6119c1d1 100644
--- a/src/Umbraco.Web.UI.Client/src/less/components/card.less
+++ b/src/Umbraco.Web.UI.Client/src/less/components/card.less
@@ -2,20 +2,28 @@
 	Library of card related compoents, like the right-hand icon list on the grid "cards"
 */
 
-.umb-card{
-	position: relative;
-	padding: 5px 10px 5px 10px;
+.umb-card {
+    position: relative;
+    padding: 5px 10px 5px 10px;
     background: white;
     width: 100%;
 
-    .title{padding: 12px; color: @gray-3; border-bottom: 1px solid @gray-8; font-weight: 400; font-size: 16px; text-transform: none; margin: 0 -10px 10px -10px;}
+    .title {
+        padding: 12px;
+        color: @gray-3;
+        border-bottom: 1px solid @gray-8;
+        font-weight: 400;
+        font-size: 16px;
+        text-transform: none;
+        margin: 0 -10px 10px -10px;
+    }
 
 }
 
-.umb-card-thumb{
+.umb-card-thumb {
     text-align: center;
 
-    i{
+    i {
         text-align: center;
         font-size: 20px;
         line-height: 40px;
@@ -25,51 +33,62 @@
     }
 }
 
-.umb-card-content{
-    .item-title{color: @blackLight; font-weight: 400; border: none; font-size: 16px; text-transform: none; margin-bottom: 3px;}
-    p{color: @gray-3; margin-bottom: 1px;}
+.umb-card-content {
+    .item-title {
+        color: @blackLight;
+        font-weight: 400;
+        border: none;
+        font-size: 16px;
+        text-transform: none;
+        margin-bottom: 3px;
+    }
+
+    p {
+        color: @gray-3;
+        margin-bottom: 1px;
+    }
 }
 
-.umb-card-actions{
+.umb-card-actions {
     padding-top: 10px;
     border-top: @gray-10 1px solid;
     clear: both;
 }
 
-.umb-card-icons{
-	text-align: center;
-	vertical-align: middle;
-	display: block;
-	list-style: none;
-	margin: 0;
-	padding: 0;
+.umb-card-icons {
+    text-align: center;
+    vertical-align: middle;
+    display: block;
+    list-style: none;
+    margin: 0;
+    padding: 0;
 }
 
-.umb-card-icons.vertical{
-	position: absolute;
-	top: 7px;
-	right: 7px;
-	text-align: right;
-	width: 1px;
+.umb-card-icons.vertical {
+    position: absolute;
+    top: 7px;
+    right: 7px;
+    text-align: right;
+    width: 1px;
 }
 
-.umb-card-icons li{
-	display: inline-block;
-	margin: 0 2px 0 2px;
+.umb-card-icons li {
+    display: inline-block;
+    margin: 0 2px 0 2px;
 }
 
-.umb-card-icons.vertical li{
-	float: right;
-	display: block;
-	margin-bottom: 3px;
+.umb-card-icons.vertical li {
+    float: right;
+    display: block;
+    margin-bottom: 3px;
 }
 
 //card iocn list
-.umb-card-list{
-     display: block;
-     padding: 0;
-     margin: 0;
- }
+.umb-card-list {
+    display: block;
+    padding: 0;
+    margin: 0;
+}
 
 .umb-card-list li {
     border-bottom: @gray-10 1px solid;
@@ -81,23 +100,23 @@
 
 
 //Card icon grid for picking items off a card
-.umb-card-grid{
-	padding: 0;
-	margin: 0 auto;
-	list-style: none;
+.umb-card-grid {
+    padding: 0;
+    margin: 0 auto;
+    list-style: none;
     width: 100%;
-    
-	display: flex;
-	flex-flow: row wrap;
-	justify-content: flex-start;
+
+    display: flex;
+    flex-flow: row wrap;
+    justify-content: flex-start;
 }
 
 .umb-card-grid li {
-	overflow: hidden;
-	font-size: 12px;
-	text-align: center;
-	box-sizing: border-box;
-	position: relative;
+    overflow: hidden;
+    font-size: 12px;
+    text-align: center;
+    box-sizing: border-box;
+    position: relative;
     width: 100px;
 }
 
@@ -107,19 +126,18 @@
 }
 
 .umb-card-grid.-three-in-row li {
-	flex: 0 0 33.33%;
-    max-width:33.33%;
+    flex: 0 0 33.33%;
+    max-width: 33.33%;
 }
 
 .umb-card-grid .umb-card-grid-item {
     position: relative;
-	display: block;
-	width: 100%;
-	//height: 100%;
+    display: block;
+    width: 100%;
     padding-top: 100%;
-	border-radius: 3px;
+    border-radius: 3px;
     transition: background-color 120ms;
-    
+
     > span {
         position: absolute;
         top: 10px;
@@ -134,11 +152,56 @@
     }
 }
 
+.umb-card-grid.-detailed {
+    .umb-card-grid-item {
+        padding-top: 0;
+
+        > div {
+            padding: 10px;
+            text-align: left;
+            font-size: 0;
+            overflow: hidden;
+        }
+    }
+
+    li {
+        flex: 0 0 auto;
+        max-width: 50%;
+        width: 50%;
+    }
+
+    .umb-card-grid-item--title {
+        font-size: 15px;
+        font-weight: 700;
+    }
+
+    .umb-card-grid-item--description {
+        font-size: 12px;
+        display: block;
+    }
+
+    .umb-card-grid-item--thumbnail,
+    i {
+        max-width: 120px;
+        margin-right: 10px;
+        float: left;
+        border-radius:3px;
+    }
+
+    i {
+        width: 120px;
+        height: 80px;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        font-size: 60px;
+    }
+}
 
 .umb-card-grid .umb-card-grid-item:hover,
 .umb-card-grid .umb-card-grid-item:focus {
-	background-color: @ui-option-hover;
-	color: @ui-option-type-hover;
+    background-color: @ui-option-hover;
+    color: @ui-option-type-hover;
 }
 
 .umb-card-grid a {
@@ -153,80 +216,82 @@
     display: block;
 }
 
- .umb-card-grid .umb-card-grid-item__loading {
-	 position: absolute;
-	 background-color: rgba(255,255,255,0.8);
-	 top: 0;
-	 right: 0;
-	 bottom: 0;
-	 left: 0;
- }
+.umb-card-grid .umb-card-grid-item__loading {
+    position: absolute;
+    background-color: rgba(255, 255, 255, 0.8);
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+}
 
 
 //Round icon-like button - this should be somewhere else
-.umb-btn-round{
-	padding: 4px 6px 4px 6px;
+.umb-btn-round {
+    padding: 4px 6px 4px 6px;
     display: inline-block;
     cursor: pointer;
     border-radius: 200px;
     background: @gray-10;
-    border:1px solid @gray-6;
+    border: 1px solid @gray-6;
     margin: 2px;
 }
 
-.umb-btn-round:hover, .umb-btn-round:hover *{
-  background: @blueDark !important;
-  color: @white !important;
-  border-color: @blueDark !important;
-  text-decoration:none;
- }
+.umb-btn-round:hover,
+.umb-btn-round:hover * {
+    background: @blueDark  !important;
+    color: @white  !important;
+    border-color: @blueDark  !important;
+    text-decoration: none;
+}
 
- .umb-btn-round a:hover {
-     text-decoration:none;
-     color: @white !important;
- }
+.umb-btn-round a:hover {
+    text-decoration: none;
+    color: @white  !important;
+}
 
- .umb-btn-round i {
-     font-size:16px !important;
-     color: @gray-8;
-     display:block;
- }
+.umb-btn-round i {
+    font-size: 16px !important;
+    color: @gray-8;
+    display: block;
+}
 
- .umb-btn-round.alert:hover, .umb-btn-round.alert:hover *{
- 	background: @red !important;
-  	color: @white !important;
-  	border-color: @red !important;
-  	text-decoration:none;
- }
+.umb-btn-round.alert:hover,
+.umb-btn-round.alert:hover * {
+    background: @red  !important;
+    color: @white  !important;
+    border-color: @red  !important;
+    text-decoration: none;
+}
 
-.umb-btn-round.no-border{
+.umb-btn-round.no-border {
     border: none !important;
     background: none !important;
 }
 
 .umb-training-videos {
-	display: grid;
-	grid-gap: 10px;
-	grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
+    display: grid;
+    grid-gap: 10px;
+    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
 }
 
 .umb-training-video {
-	background: @white;
-	box-shadow: 0 1px 1px 0 rgba(0,0,0,0.16);
-	border-radius: @baseBorderRadius;
-	transition: box-shadow 0.1s ease-in-out, border 0.1s ease-in-out;
-	box-sizing: border-box;
-	padding: 20px;
+    background: @white;
+    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.16);
+    border-radius: @baseBorderRadius;
+    transition: box-shadow 0.1s ease-in-out, border 0.1s ease-in-out;
+    box-sizing: border-box;
+    padding: 20px;
 }
 
 .umb-training-video:hover {
-	box-shadow: 0 3px 6px 0 rgba(0,0,0,0.16);
-	text-decoration: none;
+    box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
+    text-decoration: none;
 }
 
 .umb-training-video__label {
     font-weight: bold;
-	margin-top: 20px;
-	display: block;
-	text-align: center;
-}
+    margin-top: 20px;
+    display: block;
+    text-align: center;
+}
\ No newline at end of file
diff --git a/src/Umbraco.Web.UI.Client/src/less/components/overlays.less b/src/Umbraco.Web.UI.Client/src/less/components/overlays.less
index f5050fad85..ad4e44f0ae 100644
--- a/src/Umbraco.Web.UI.Client/src/less/components/overlays.less
+++ b/src/Umbraco.Web.UI.Client/src/less/components/overlays.less
@@ -137,6 +137,10 @@
     &.umb-overlay--medium {
         width: 480px;
     }
+    
+    &.umb-overlay--large {
+        width:640px;
+    }
 }
 
 .umb-overlay.umb-overlay-target .umb-overlay-header {
diff --git a/src/Umbraco.Web.UI.Client/src/views/common/overlays/itempicker/itempicker.controller.js b/src/Umbraco.Web.UI.Client/src/views/common/overlays/itempicker/itempicker.controller.js
index 74a677b7c6..0eb8b8f099 100644
--- a/src/Umbraco.Web.UI.Client/src/views/common/overlays/itempicker/itempicker.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/common/overlays/itempicker/itempicker.controller.js
@@ -4,7 +4,7 @@ function ItemPickerOverlay($scope, localizationService) {
         $scope.model.hideSubmitButton = true;
 
         if (!$scope.model.title) {
-            localizationService.localize("defaultdialogs_selectItem").then(function(value){
+            localizationService.localize("defaultdialogs_selectItem").then(function (value) {
                 $scope.model.title = value;
             });
         }
@@ -14,7 +14,11 @@ function ItemPickerOverlay($scope, localizationService) {
         }
     }
 
-    $scope.selectItem = function(item) {
+    $scope.hasThumbs = function () {
+        return $scope.model.availableItems.some(x => x.thumbnail);
+    };
+
+    $scope.selectItem = function (item) {
         $scope.model.selectedItem = item;
         $scope.submitForm($scope.model);
     };
diff --git a/src/Umbraco.Web.UI.Client/src/views/common/overlays/itempicker/itempicker.html b/src/Umbraco.Web.UI.Client/src/views/common/overlays/itempicker/itempicker.html
index a9f57fe304..4d6b251ece 100644
--- a/src/Umbraco.Web.UI.Client/src/views/common/overlays/itempicker/itempicker.html
+++ b/src/Umbraco.Web.UI.Client/src/views/common/overlays/itempicker/itempicker.html
@@ -1,26 +1,30 @@
 <div ng-controller="Umbraco.Overlays.ItemPickerOverlay" class="umb-itempicker">
 
-    <div class="form-search" ng-hide="model.filter === false" style="margin-bottom: 15px;">
+    <div class="form-search" 
+         ng-hide="model.filter === false" 
+         style="margin-bottom: 15px;">
         <i class="icon-search"></i>
-        <input type="text"
-               ng-model="searchTerm"
-               class="umb-search-field search-query input-block-level -full-width-input"
-               localize="placeholder"
-               placeholder="@placeholders_filter"
-               umb-auto-focus
-               no-dirty-check />
+        
+        <input type="text" 
+               ng-model="searchTerm" 
+               class="umb-search-field search-query input-block-level -full-width-input" 
+               localize="placeholder" placeholder="@placeholders_filter" 
+               umb-auto-focus no-dirty-check />
     </div>
 
     <div class="umb-overlay__section-header" ng-if="(model.pasteItems | filter:searchTerm).length > 0">
-        <h5><localize key="content_createFromClipboard">Paste from clipboard</localize></h5>
-        <button ng-if="model.clickClearPaste" ng-click="model.clickClearPaste($event)" alt="Clear clipboard for entries accepted in this context.">
+        <h5>
+            <localize key="content_createFromClipboard">Paste from clipboard</localize>
+        </h5>
+        <button ng-if="model.clickClearPaste" 
+                ng-click="model.clickClearPaste($event)" 
+                alt="Clear clipboard for entries accepted in this context.">
             <i class="icon-trash"></i>
         </button>
     </div>
 
     <ul class="umb-card-grid" ng-class="{'-three-in-row': model.availableItems.length < 7, '-four-in-row': model.availableItems.length >= 7}">
-        <li ng-repeat="pasteItem in model.pasteItems | filter:searchTerm"
-            ng-click="model.clickPasteItem(pasteItem)">
+        <li ng-repeat="pasteItem in model.pasteItems | filter:searchTerm" ng-click="model.clickPasteItem(pasteItem)">
             <a class="umb-card-grid-item" href="" title="{{ pasteItem.name }}">
                 <span>
                     <i class="{{ pasteItem.icon }}"></i>
@@ -31,19 +35,37 @@
     </ul>
 
     <div class="umb-overlay__section-header" ng-if="model.pasteItems.length > 0 && (model.availableItems | filter:searchTerm).length > 0">
-        <h5><localize key="content_createEmpty">Create new</localize></h5>
+        <h5>
+            <localize key="content_createEmpty">Create new</localize>
+        </h5>
     </div>
 
-    <ul class="umb-card-grid" ng-class="{'-three-in-row': model.availableItems.length < 7, '-four-in-row': model.availableItems.length >= 7}">
-        <li ng-repeat="availableItem in model.availableItems | compareArrays:model.selectedItems:'alias' | orderBy:model.orderBy | filter:searchTerm"
-            ng-click="selectItem(availableItem)">
-            <a class="umb-card-grid-item" href="" title="{{ availableItem.name }}">
-                <span>
+
+    <ul class="umb-card-grid" ng-class="{'-three-in-row': model.availableItems.length < 7, '-four-in-row': model.availableItems.length >= 7, '-detailed': hasThumbs()}">
+        <li ng-repeat="availableItem in model.availableItems | compareArrays:model.selectedItems:'alias' | orderBy:model.orderBy | filter:searchTerm" ng-click="selectItem(availableItem)">
+            <a class="umb-card-grid-item" 
+               ng-class="{'-has-thumbnail': availableItem.thumbnail}" 
+               href="" 
+               title="{{ availableItem.name }}">
+                <span ng-if="!hasThumbs()">
                     <i class="{{ availableItem.icon }}"></i>
                     {{ availableItem.name }}
                 </span>
+                <div ng-if="hasThumbs()" class="flex">
+                    <i ng-if="!availableItem.thumbnail" class="{{ availableItem.icon }}"></i>
+                    <img ng-if="availableItem.thumbnail" 
+                         class="umb-card-grid-item--thumbnail self-start" 
+                         ng-src="{{ availableItem.thumbnail }}?width=120px" />
+                    <div class="flex flex-column justify-center">
+                        <span class="umb-card-grid-item--title" ng-bind="availableItem.name"></span>
+                        <span ng-if="availableItem.description" 
+                              class="umb-card-grid-item--description" 
+                              ng-bind="availableItem.description"></span>
+                    </div>
+                </div>
             </a>
         </li>
     </ul>
 
+
 </div>
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js
index 28bb91583c..22d42f76e1 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js
@@ -1,4 +1,4 @@
-function BlockEditorPropertyEditorController($scope, contentResource, editorService) {
+function BlockEditorPropertyEditorController($scope, contentResource, editorService, iconHelper, clipboardService) {
     var vm = this;
 
     vm.scaffolds = [];
@@ -14,10 +14,12 @@
     vm.editContent = editContent;
     vm.editSettings = editSettings;
     vm.remove = remove;
+    vm.openNodeTypePicker = openNodeTypePicker;
 
     // it would be awesome if we could load all scaffolds in one go... however we need to have an eye out for performance,
     // oddly enough it's been shown to actually be slower to load them all at once instead of one at a time
     var scaffoldsLoaded = 0;
+
     function init() {
         $scope.model.value = $scope.model.value || [];
         _.each($scope.model.config.blocks, function (blockConfig) {
@@ -25,6 +27,8 @@
                 if (scaffold.isElement) {
                     // the scaffold udi is not the same as the element type udi, but we need it to be for comparison
                     scaffold.udi = blockConfig.elementType;
+                    // shift this up to be consistent with other entities
+                    scaffold.thumbnail = scaffold.documentType.thumbnail;
                     vm.scaffolds.push(scaffold);
                 }
                 scaffoldsLoaded++;
@@ -58,8 +62,90 @@
         openContent(element, block);
     }
 
+    // nw => this needs to be refined, is currently largely a copy from nested content
+    function openNodeTypePicker($event) {
+        
+        vm.overlayMenu = {
+            show: false,
+            style: {},
+            filter: vm.scaffolds.length > 12 ? true : false,
+            orderBy: "$index",
+            view: "itempicker",
+            event: $event,
+            clickPasteItem: function (item) {
+                $scope.pasteFromClipboard(item.data);
+                vm.overlayMenu.show = false;
+                vm.overlayMenu = null;
+            },
+            submit: function (model) {
+                if (model && model.selectedItem) {                    
+                    add(vm.scaffolds.filter(x => x.contentTypeAlias === model.selectedItem.alias)[0]);
+                }
+                vm.overlayMenu.show = false;
+                vm.overlayMenu = null;
+            },
+            close: function () {
+                vm.overlayMenu.show = false;
+                vm.overlayMenu = null;
+            }
+        };
+
+        // this could be used for future limiting on node types
+        vm.overlayMenu.availableItems = [];
+        _.each(vm.scaffolds, function (scaffold) {
+            vm.overlayMenu.availableItems.push({
+                alias: scaffold.contentTypeAlias,
+                name: scaffold.contentTypeName,
+                icon: iconHelper.convertFromLegacyIcon(scaffold.icon),
+                thumbnail: scaffold.thumbnail,
+                description: scaffold.documentType.description
+            });
+        });
+
+        if (vm.overlayMenu.availableItems.length === 0) {
+            return;
+        }
+
+        if (vm.overlayMenu.availableItems.some(x => x.thumbnail)) {
+            vm.overlayMenu.size = 'large';
+        } else {
+            vm.overlayMenu.size = vm.overlayMenu.availableItems.length > 6 ? "medium" : "small";
+        }
+
+        vm.overlayMenu.pasteItems = [];
+//        var availableNodesForPaste = clipboardService.retriveDataOfType("elementType", contentTypeAliases);
+//        _.each(availableNodesForPaste, function (node) {
+//            vm.overlayMenu.pasteItems.push({
+//                alias: node.contentTypeAlias,
+//                name: node.name, //contentTypeName
+//                data: node,
+//                icon: iconHelper.convertFromLegacyIcon(node.icon)
+//            });
+//        });
+//
+//        vm.overlayMenu.title = vm.overlayMenu.pasteItems.length > 0 ? $scope.labels.grid_addElement : $scope.labels.content_createEmpty;
+//
+//        vm.overlayMenu.clickClearPaste = function ($event) {
+//            $event.stopPropagation();
+//            $event.preventDefault();
+//            clipboardService.clearEntriesOfType("elementType", contentTypeAliases);
+//            vm.overlayMenu.pasteItems = []; // This dialog is not connected via the clipboardService events, so we need to update manually.
+//        };
+
+        if (vm.overlayMenu.availableItems.length === 1 && vm.overlayMenu.pasteItems.length === 0) {
+            // only one scaffold type - no need to display the picker
+            add(vm.scaffolds[0]);
+            return;
+        }
+
+        vm.overlayMenu.show = true;
+    }
+
+
     function editContent(block) {
-        var scaffold = _.findWhere(vm.scaffolds, {udi: block.udi});
+        var scaffold = _.findWhere(vm.scaffolds, {
+            udi: block.udi
+        });
         var element = angular.copy(scaffold);
         _.each(element.variants[0].tabs, function (tab) {
             _.each(tab.properties, function (property) {
@@ -68,7 +154,7 @@
                 }
             });
         });
-        
+
         openContent(element, block);
     }
 
@@ -77,7 +163,7 @@
             element: element,
             title: "TODO: Edit block title here",
             view: "views/propertyeditors/blockeditor/blockeditor.editcontent.html",
-            submit: function(model) {
+            submit: function (model) {
                 _.each(element.variants[0].tabs, function (tab) {
                     _.each(tab.properties, function (property) {
                         block.content[property.alias] = property.value;
@@ -89,7 +175,7 @@
 
                 editorService.close();
             },
-            close: function() {
+            close: function () {
                 editorService.close();
             }
         };
@@ -102,11 +188,11 @@
             title: "TODO: Edit settings title here",
             view: "views/propertyeditors/blockeditor/blockeditor.editsettings.html",
             size: "medium",
-            submit: function(model) {
+            submit: function (model) {
                 console.log("TODO: something with block settings", model)
                 editorService.close();
             },
-            close: function() {
+            close: function () {
                 editorService.close();
             }
         };
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
index 3329a895c3..c5d5ee56b9 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
@@ -6,11 +6,21 @@
     <div ng-if="!vm.loading">
         <umb-block-editor-blocks></umb-block-editor-blocks>
 
-        <div>
-            Add:
-            <div style="cursor:pointer" ng-click="vm.add(scaffold)" ng-repeat="scaffold in vm.scaffolds" class="di">
-                <i class="icon {{scaffold.documentType.icon}}"></i>
-            </div>
+        <div class="umb-nested-content__footer-bar">
+            <a href class="umb-nested-content__add-content" ng-class="{ '--disabled': !vm.scaffolds.length }" ng-click="vm.openNodeTypePicker($event)" prevent-default>
+                <localize key="grid_addElement" ng-if="vm.scaffolds.length > 1"></localize>
+                <span ng-if="vm.scaffolds.length === 1">
+                    <localize key="general_add"></localize> {{ vm.scaffolds[0].contentTypeName }}
+                </span>
+            </a>
         </div>
     </div>
+    
+    <umb-overlay
+        ng-if="vm.overlayMenu.show"
+        position="target"
+        size="vm.overlayMenu.size"
+        view="vm.overlayMenu.view"
+        model="vm.overlayMenu">
+    </umb-overlay>
 </div>
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.controller.js
index 8c5bae56a7..79fa4c35e0 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.controller.js
@@ -281,22 +281,29 @@ angular.module("umbraco")
             $scope.openEditorOverlay = function (event, area, index, key) {
                 var title = "";
                 localizationService.localize("grid_insertControl").then(function (value) {
-                    title = value;
-                    $scope.editorOverlay = {
-                        view: "itempicker", 
-                        filter: area.$allowedEditors.length > 15,
-                        title: title,
-                        availableItems: area.$allowedEditors,
-                        event: event,
-                        show: true,
-                        submit: function (model) {
-                            if (model.selectedItem) {
-                                $scope.addControl(model.selectedItem, area, index);
-                                $scope.editorOverlay.show = false;
-                                $scope.editorOverlay = null;
+                    if (area.$allowedEditors.length > 1) {
+                        title = value;
+                        $scope.editorOverlay = {
+                            view: "itempicker", 
+                            filter: area.$allowedEditors.length > 15,
+                            title: title,
+                            size: area.$allowedEditors.some(x => x.thumbnail) ? 'large' : 'small',
+                            availableItems: area.$allowedEditors,
+                            event: event,
+                            show: true,
+                            submit: function (model) {
+                                if (model.selectedItem) {
+                                    console.log(model.selectedItem);
+                                    $scope.addControl(model.selectedItem, area, index);
+                                    $scope.editorOverlay.show = false;
+                                    $scope.editorOverlay = null;
+                                }
                             }
-                        }
-                    };
+                        };
+                    } else {
+                        console.log(area.$allowedEditors[0]);
+                        $scope.addControl(area.$allowedEditors[0], area, index);
+                    }
                 });
             };
 
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.html
index 6b739a9b86..e3704713cb 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.html
@@ -226,7 +226,11 @@
 
                                                       <!-- if area is empty tools -->
                                                       <div class="umb-grid-add-more-content" ng-if="area.controls.length > 0 && !sortMode && (area.maxItems == undefined || area.maxItems == '' || area.maxItems == 0 || area.maxItems > area.controls.length)">
-                                                          <div class="cell-tools-add -bar newbtn" ng-click="openEditorOverlay($event, area, 0, area.$uniqueId);"><localize key="grid_addElement" /></div>
+                                                          <div class="cell-tools-add -bar newbtn" ng-click="openEditorOverlay($event, area, 0, area.$uniqueId);">
+                                                              <localize key="grid_addElement" ng-if="area.$allowedEditors.length > 1"></localize>
+                                                              <span ng-show="area.$allowedEditors.length === 1">
+                                                                  <localize key="general_add"></localize> {{ area.$allowedEditors[0].name }}</span>
+                                                          </div>
                                                       </div>
 
                                                  </div>
@@ -300,6 +304,7 @@
       ng-if="editorOverlay.show"
       model="editorOverlay"
       view="editorOverlay.view"
+      size="editorOverlay.size"
       position="target">
     </umb-overlay>
 
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/nestedcontent/nestedcontent.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/nestedcontent/nestedcontent.controller.js
index 7a67e07e0c..548782633b 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/nestedcontent/nestedcontent.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/nestedcontent/nestedcontent.controller.js
@@ -184,7 +184,9 @@ angular.module("umbraco").controller("Umbraco.PropertyEditors.NestedContent.Prop
                 $scope.overlayMenu.availableItems.push({
                     alias: scaffold.contentTypeAlias,
                     name: scaffold.contentTypeName,
-                    icon: iconHelper.convertFromLegacyIcon(scaffold.icon)
+                    icon: iconHelper.convertFromLegacyIcon(scaffold.icon),
+                    thumbnail: scaffold.thumbnail,
+                    description: scaffold.documentType.description
                 });
             });
 
@@ -192,7 +194,11 @@ angular.module("umbraco").controller("Umbraco.PropertyEditors.NestedContent.Prop
                 return;
             }
             
-            $scope.overlayMenu.size = $scope.overlayMenu.availableItems.length > 6 ? "medium" : "small";
+            if ($scope.overlayMenu.availableItems.some(x => x.thumbnail)) {
+                $scope.overlayMenu.size = 'large';
+            } else {
+                $scope.overlayMenu.size = $scope.overlayMenu.availableItems.length > 6 ? "medium" : "small";            
+            }    
             
             $scope.overlayMenu.pasteItems = [];
             var availableNodesForPaste = clipboardService.retriveDataOfType("elementType", contentTypeAliases);
@@ -399,6 +405,9 @@ angular.module("umbraco").controller("Umbraco.PropertyEditors.NestedContent.Prop
                             });
                     }
 
+                    // pass the thumbnail on to the scaffold
+                    scaffold.thumbnail = contentType.thumbnail;
+                    
                     // Store the scaffold object
                     $scope.scaffolds.push(scaffold);
                 }
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/nestedcontent/nestedcontent.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/nestedcontent/nestedcontent.html
index a8a77e2d53..bec6d40506 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/nestedcontent/nestedcontent.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/nestedcontent/nestedcontent.html
@@ -37,7 +37,8 @@
 
         <div class="umb-nested-content__footer-bar" ng-hide="hasContentTypes === false || nodes.length >= maxItems">
             <a href class="umb-nested-content__add-content" ng-class="{ '--disabled': !scaffolds.length }" ng-click="openNodeTypePicker($event)" prevent-default>
-                <localize key="grid_addElement"></localize>
+                <localize key="grid_addElement" ng-if="scaffolds.length > 1"></localize>
+                <span ng-if="scaffolds.length === 1"><localize key="general_add"></localize> {{ scaffolds[0].contentTypeName }}</span>
             </a>
         </div>
 

From 7ce4fbe44c03c1c58cd6e467d670f3e583a2fdc6 Mon Sep 17 00:00:00 2001
From: Kenn Jacobsen <post@kennjacobsen.dk>
Date: Mon, 20 May 2019 17:40:38 +0200
Subject: [PATCH 21/46] Refactor to make it reusable across implementations

---
 .../components/umbblockeditor.directive.js    | 15 +++++++
 .../umbblockeditorblocks.directive.js         | 12 ------
 .../blockeditor/blockeditor.blocks.html       |  8 ----
 .../blockeditor.default.controller.js         | 11 ++++++
 .../blockeditor/blockeditor.default.html      | 14 +++++++
 ...js => blockeditor.directive.controller.js} | 39 +++++++++----------
 .../blockeditor/blockeditor.directive.html    |  7 ++++
 .../blockeditor/blockeditor.html              | 17 +-------
 8 files changed, 66 insertions(+), 57 deletions(-)
 create mode 100644 src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditor.directive.js
 delete mode 100644 src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblocks.directive.js
 delete mode 100644 src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.blocks.html
 create mode 100644 src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.default.controller.js
 create mode 100644 src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.default.html
 rename src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/{blockeditor.controller.js => blockeditor.directive.controller.js} (77%)
 create mode 100644 src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.directive.html

diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditor.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditor.directive.js
new file mode 100644
index 0000000000..1fddf4dcc6
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditor.directive.js
@@ -0,0 +1,15 @@
+angular.module("umbraco.directives").directive('umbBlockEditor', [
+    function () {
+        return {
+            restrict: "E",
+            templateUrl: "views/propertyeditors/blockeditor/blockeditor.directive.html",
+            scope: {
+                config: "=",
+                view: "=?",
+                blocks: "="
+            },
+            controller: "Umbraco.PropertyEditors.BlockEditor.DirectiveController",
+            controllerAs: "vm"
+        };
+    }
+]);
diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblocks.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblocks.directive.js
deleted file mode 100644
index bf1f8148e2..0000000000
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblocks.directive.js
+++ /dev/null
@@ -1,12 +0,0 @@
-angular.module("umbraco.directives").directive('umbBlockEditorBlocks', [
-    function () {
-        var link = function (scope, el, attr, ctrl) {
-        };
-
-        return {
-            restrict: "E",
-            templateUrl: "views/propertyeditors/blockeditor/blockeditor.blocks.html",
-            link: link
-        };
-    }
-]);
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.blocks.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.blocks.html
deleted file mode 100644
index 54817aa676..0000000000
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.blocks.html
+++ /dev/null
@@ -1,8 +0,0 @@
-<div>
-    <div ng-if="vm.blocksView" ng-include="vm.blocksView"></div>
-    <ul ng-if="!vm.blocksView" class="unstyled" ui-sortable="vm.sortableOptions" ng-model="model.value">
-        <li ng-repeat="block in model.value" style="border: 1px solid silver; margin-bottom: 4px; padding: 4px;">
-            <umb-block-editor-block></umb-block-editor-block>
-        </li>
-    </ul>
-</div>
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.default.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.default.controller.js
new file mode 100644
index 0000000000..3ed36060fe
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.default.controller.js
@@ -0,0 +1,11 @@
+function BlockEditorDefaultController($scope, contentResource, editorService) {
+    console.log("Block editor default controller", $scope.model)
+    // TODO: move this to a controller supporting the default blockeditor view
+    $scope.sortableOptions = {
+        axis: "y",
+        cursor: "move",
+        handle: ".handle",
+        tolerance: 'pointer'
+    };
+}
+angular.module("umbraco").controller("Umbraco.PropertyEditors.BlockEditor.DefaultController", BlockEditorDefaultController);
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.default.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.default.html
new file mode 100644
index 0000000000..97613b0193
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.default.html
@@ -0,0 +1,14 @@
+<div ng-controller="Umbraco.PropertyEditors.BlockEditor.DefaultController">
+    <ul class="unstyled" ui-sortable="sortableOptions" ng-model="blocks">
+        <li ng-repeat="block in blocks" style="border: 1px solid silver; margin-bottom: 4px; padding: 4px;">
+            <umb-block-editor-block></umb-block-editor-block>
+        </li>
+    </ul>
+
+    <div>
+        Add:
+        <div style="cursor:pointer" ng-click="vm.add(scaffold)" ng-repeat="scaffold in vm.scaffolds" class="di">
+            <i class="icon {{scaffold.documentType.icon}}"></i>
+        </div>
+    </div>
+</div>
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.directive.controller.js
similarity index 77%
rename from src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js
rename to src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.directive.controller.js
index 2bd846eb71..681617871e 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.directive.controller.js
@@ -1,32 +1,29 @@
-function BlockEditorPropertyEditorController($scope, contentResource, editorService) {
+function BlockEditorDirectiveController($scope, contentResource, editorService) {
     var vm = this;
 
     vm.scaffolds = [];
     vm.loading = true;
-    vm.sortableOptions = {
-        axis: "y",
-        cursor: "move",
-        handle: ".handle",
-        tolerance: 'pointer'
-    };
-
     vm.add = add;
     vm.editContent = editContent;
     vm.editSettings = editSettings;
     vm.remove = remove;
-    // TODO: this needs to be configurable on data type level
-    vm.blocksView = null; // "/App_Plugins/MyBlockEditor/myblockeditor.html";
 
     // it would be awesome if we could load all scaffolds in one go... however we need to have an eye out for performance,
     // oddly enough it's been shown to actually be slower to load them all at once instead of one at a time
     var scaffoldsLoaded = 0;
     function init() {
-        $scope.model.value = $scope.model.value || [];
-        _.each($scope.model.config.blocks, function (blockConfig) {
-            contentResource.getScaffoldByUdi(-20, blockConfig.elementType).then(function (scaffold) {
+        if (!$scope.blocks) {
+            $scope.blocks = [];
+        }
+        if (!$scope.view) {
+            $scope.view = "views/propertyeditors/blockeditor/blockeditor.default.html";
+        }
+        
+        _.each($scope.config, function (config) {
+            contentResource.getScaffoldByUdi(-20, config.elementType).then(function (scaffold) {
                 if (scaffold.isElement) {
                     // the scaffold udi is not the same as the element type udi, but we need it to be for comparison
-                    scaffold.udi = blockConfig.elementType;
+                    scaffold.udi = config.elementType;
                     vm.scaffolds.push(scaffold);
                 }
                 scaffoldsLoaded++;
@@ -40,14 +37,14 @@
 
     function initIfAllScaffoldsHaveLoaded() {
         // Initialize when all scaffolds have loaded
-        if ($scope.model.config.blocks.length === scaffoldsLoaded) {
+        if ($scope.config.length === scaffoldsLoaded) {
             vm.scaffolds = _.sortBy(vm.scaffolds, function (scaffold) {
-                return _.findIndex($scope.model.config.blocks, function (blockConfig) {
+                return _.findIndex($scope.config, function (blockConfig) {
                     return blockConfig.elementType === scaffold.udi;
                 });
             });
 
-            _.each($scope.model.value, function (block) {
+            _.each($scope.blocks, function (block) {
                 applyFakeSettings(block);
             });
 
@@ -91,8 +88,8 @@
                         block.content[property.alias] = property.value;
                     });
                 });
-                if ($scope.model.value.indexOf(block) < 0) {
-                    $scope.model.value.push(block);
+                if ($scope.blocks.indexOf(block) < 0) {
+                    $scope.blocks.push(block);
                     applyFakeSettings(block);
                 }
 
@@ -125,7 +122,7 @@
     function remove(block) {
         // this should be replaced by a custom dialog (pending some PRs)
         if (confirm("TODO: Are you sure?")) {
-            $scope.model.value.splice($scope.model.value.indexOf(block), 1);
+            $scope.blocks.splice($scope.blocks.indexOf(block), 1);
         }
     }
 
@@ -137,4 +134,4 @@
         block.settings["rows"] = 1 + Math.floor(Math.random() * 2);
     }
 }
-angular.module("umbraco").controller("Umbraco.PropertyEditors.BlockEditor.PropertyEditorController", BlockEditorPropertyEditorController);
+angular.module("umbraco").controller("Umbraco.PropertyEditors.BlockEditor.DirectiveController", BlockEditorDirectiveController);
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.directive.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.directive.html
new file mode 100644
index 0000000000..98ae7a79fd
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.directive.html
@@ -0,0 +1,7 @@
+<div>
+    <div style="position:relative" ng-if="vm.loading">
+        <umb-load-indicator />
+    </div>
+
+    <div ng-if="!vm.loading" ng-include="view"></div>
+</div>
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
index 3329a895c3..3c95c536f3 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
@@ -1,16 +1 @@
-<div ng-controller="Umbraco.PropertyEditors.BlockEditor.PropertyEditorController as vm">
-    <div style="position:relative" ng-if="vm.loading">
-        <umb-load-indicator />
-    </div>
-
-    <div ng-if="!vm.loading">
-        <umb-block-editor-blocks></umb-block-editor-blocks>
-
-        <div>
-            Add:
-            <div style="cursor:pointer" ng-click="vm.add(scaffold)" ng-repeat="scaffold in vm.scaffolds" class="di">
-                <i class="icon {{scaffold.documentType.icon}}"></i>
-            </div>
-        </div>
-    </div>
-</div>
+<umb-block-editor blocks="model.value" config="model.config.blocks"></umb-block-editor>

From d71b2a07c4f0515af49c333990ea494aeec2467a Mon Sep 17 00:00:00 2001
From: Kenn Jacobsen <post@kennjacobsen.dk>
Date: Mon, 20 May 2019 18:03:21 +0200
Subject: [PATCH 22/46] Refactor block view specification in the block
 directive

---
 .../components/umbblockeditorblock.directive.js  |  4 ++--
 .../blockeditor/blockeditor.block.default.html   | 13 +++++++++++++
 .../blockeditor/blockeditor.block.html           | 16 ----------------
 .../blockeditor/blockeditor.default.html         |  4 +++-
 4 files changed, 18 insertions(+), 19 deletions(-)
 create mode 100644 src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.block.default.html
 delete mode 100644 src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.block.html

diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblock.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblock.directive.js
index 12cd2a868c..9b471f025f 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblock.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblock.directive.js
@@ -1,12 +1,12 @@
 angular.module("umbraco.directives").directive('umbBlockEditorBlock', [
     function () {
         var link = function (scope, el, attr, ctrl) {
-            scope.view = attr.view;
+            scope.view = attr.view || "views/propertyeditors/blockeditor/blockeditor.block.default.html";
         };
 
         return {
             restrict: "E",
-            templateUrl: "views/propertyeditors/blockeditor/blockeditor.block.html",
+            template: "<div ng-include='view'></div>",
             link: link
         };
     }
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.block.default.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.block.default.html
new file mode 100644
index 0000000000..b27f08e060
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.block.default.html
@@ -0,0 +1,13 @@
+<div>
+    <div>
+        <div style="cursor:pointer" ng-click="vm.editSettings(block)" class="di">
+            <i class="icon icon-settings"></i>
+        </div>
+        <div style="cursor:pointer" ng-click="vm.remove(block)" class="di">
+            <i class="icon icon-trash"></i>
+        </div>
+    </div>
+    <div style="cursor:pointer" ng-click="vm.editContent(block)">
+        Eventually a block identifier will go here (e.g. element type icon)
+    </div>
+</div>
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.block.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.block.html
deleted file mode 100644
index 6aeeef7823..0000000000
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.block.html
+++ /dev/null
@@ -1,16 +0,0 @@
-<div class="handle" >
-    <div ng-if="view" ng-include="view"></div>
-    <div ng-if="!view">
-        <div>
-            <div style="cursor:pointer" ng-click="vm.editSettings(block)" class="di">
-                <i class="icon icon-settings"></i>
-            </div>
-            <div style="cursor:pointer" ng-click="vm.remove(block)" class="di">
-                <i class="icon icon-trash"></i>
-            </div>
-        </div>
-        <div style="cursor:pointer" ng-click="vm.editContent(block)">
-            Eventually a block identifier will go here (e.g. element type icon)
-        </div>
-    </div>
-</div>
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.default.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.default.html
index 97613b0193..84cf55fe7d 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.default.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.default.html
@@ -1,7 +1,9 @@
 <div ng-controller="Umbraco.PropertyEditors.BlockEditor.DefaultController">
     <ul class="unstyled" ui-sortable="sortableOptions" ng-model="blocks">
         <li ng-repeat="block in blocks" style="border: 1px solid silver; margin-bottom: 4px; padding: 4px;">
-            <umb-block-editor-block></umb-block-editor-block>
+            <div class="handle">
+                <umb-block-editor-block></umb-block-editor-block>
+            </div>
         </li>
     </ul>
 

From 36616fb9d16547a97b4cbbd3b26c037d2bb4beac Mon Sep 17 00:00:00 2001
From: Kenn Jacobsen <post@kennjacobsen.dk>
Date: Mon, 20 May 2019 18:17:57 +0200
Subject: [PATCH 23/46] Split into SimpleGrid

---
 src/Umbraco.Core/Constants-PropertyEditors.cs  |  5 -----
 .../umbblockeditorblock.directive.js           |  2 +-
 ...ock.default.html => blockeditor.block.html} |  0
 .../blockeditor.default.controller.js          |  2 --
 .../simplegrid.html}                           |  0
 .../BlockEditorConfiguration.cs                |  2 +-
 .../BlockEditorConfigurationEditor.cs          |  9 ---------
 .../BlockEditorPropertyEditor.cs               | 18 ------------------
 .../PropertyEditors/SimpleGridConfiguration.cs |  6 ++++++
 .../SimpleGridConfigurationEditor.cs           |  9 +++++++++
 .../SimpleGridPropertyEditor.cs                | 17 +++++++++++++++++
 src/Umbraco.Web/Umbraco.Web.csproj             |  5 +++--
 12 files changed, 37 insertions(+), 38 deletions(-)
 rename src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/{blockeditor.block.default.html => blockeditor.block.html} (100%)
 rename src/Umbraco.Web.UI.Client/src/views/propertyeditors/{blockeditor/blockeditor.html => simplegrid/simplegrid.html} (100%)
 delete mode 100644 src/Umbraco.Web/PropertyEditors/BlockEditorConfigurationEditor.cs
 delete mode 100644 src/Umbraco.Web/PropertyEditors/BlockEditorPropertyEditor.cs
 create mode 100644 src/Umbraco.Web/PropertyEditors/SimpleGridConfiguration.cs
 create mode 100644 src/Umbraco.Web/PropertyEditors/SimpleGridConfigurationEditor.cs
 create mode 100644 src/Umbraco.Web/PropertyEditors/SimpleGridPropertyEditor.cs

diff --git a/src/Umbraco.Core/Constants-PropertyEditors.cs b/src/Umbraco.Core/Constants-PropertyEditors.cs
index f9b298e586..0c2e246721 100644
--- a/src/Umbraco.Core/Constants-PropertyEditors.cs
+++ b/src/Umbraco.Core/Constants-PropertyEditors.cs
@@ -19,11 +19,6 @@ namespace Umbraco.Core
             /// </summary>
             public static class Aliases
             {
-                /// <summary>
-                /// Block Editor.
-                /// </summary>
-                public const string BlockEditor = "Umbraco.BlockEditor";
-
                 /// <summary>
                 /// CheckBox List.
                 /// </summary>
diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblock.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblock.directive.js
index 9b471f025f..09964f3d43 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblock.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblock.directive.js
@@ -1,7 +1,7 @@
 angular.module("umbraco.directives").directive('umbBlockEditorBlock', [
     function () {
         var link = function (scope, el, attr, ctrl) {
-            scope.view = attr.view || "views/propertyeditors/blockeditor/blockeditor.block.default.html";
+            scope.view = attr.view || "views/propertyeditors/blockeditor/blockeditor.block.html";
         };
 
         return {
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.block.default.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.block.html
similarity index 100%
rename from src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.block.default.html
rename to src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.block.html
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.default.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.default.controller.js
index 3ed36060fe..c3287170a7 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.default.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.default.controller.js
@@ -1,6 +1,4 @@
 function BlockEditorDefaultController($scope, contentResource, editorService) {
-    console.log("Block editor default controller", $scope.model)
-    // TODO: move this to a controller supporting the default blockeditor view
     $scope.sortableOptions = {
         axis: "y",
         cursor: "move",
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/simplegrid/simplegrid.html
similarity index 100%
rename from src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
rename to src/Umbraco.Web.UI.Client/src/views/propertyeditors/simplegrid/simplegrid.html
diff --git a/src/Umbraco.Web/PropertyEditors/BlockEditorConfiguration.cs b/src/Umbraco.Web/PropertyEditors/BlockEditorConfiguration.cs
index b91c6b37bf..c96c901861 100644
--- a/src/Umbraco.Web/PropertyEditors/BlockEditorConfiguration.cs
+++ b/src/Umbraco.Web/PropertyEditors/BlockEditorConfiguration.cs
@@ -4,7 +4,7 @@ using Umbraco.Core.PropertyEditors;
 
 namespace Umbraco.Web.PropertyEditors
 {
-    public class BlockEditorConfiguration
+    public abstract class BlockEditorConfiguration
     {
         [ConfigurationField("blocks", "Blocks", "views/propertyeditors/blockeditor/blockeditor.settings.html")]
         public Block[] Blocks { get; set; }
diff --git a/src/Umbraco.Web/PropertyEditors/BlockEditorConfigurationEditor.cs b/src/Umbraco.Web/PropertyEditors/BlockEditorConfigurationEditor.cs
deleted file mode 100644
index cd68108f16..0000000000
--- a/src/Umbraco.Web/PropertyEditors/BlockEditorConfigurationEditor.cs
+++ /dev/null
@@ -1,9 +0,0 @@
-using Umbraco.Core.PropertyEditors;
-
-namespace Umbraco.Web.PropertyEditors
-{
-    internal class BlockEditorConfigurationEditor : ConfigurationEditor<BlockEditorConfiguration>
-    {
-
-    }
-}
diff --git a/src/Umbraco.Web/PropertyEditors/BlockEditorPropertyEditor.cs b/src/Umbraco.Web/PropertyEditors/BlockEditorPropertyEditor.cs
deleted file mode 100644
index f486af4c3d..0000000000
--- a/src/Umbraco.Web/PropertyEditors/BlockEditorPropertyEditor.cs
+++ /dev/null
@@ -1,18 +0,0 @@
-using Umbraco.Core;
-using Umbraco.Core.Logging;
-using Umbraco.Core.PropertyEditors;
-
-namespace Umbraco.Web.PropertyEditors
-{
-    [DataEditor(Constants.PropertyEditors.Aliases.BlockEditor, EditorType.PropertyValue , "Block Editor", "blockeditor", ValueType = ValueTypes.Json, Group="rich content", Icon="icon-application-window-alt")]
-    public class BlockEditorPropertyEditor : DataEditor
-    {
-        public BlockEditorPropertyEditor(ILogger logger)
-            : base(logger)
-        { }
-
-        protected override IConfigurationEditor CreateConfigurationEditor() => new BlockEditorConfigurationEditor();
-
-        protected override IDataValueEditor CreateValueEditor() => base.CreateValueEditor();
-    }
-}
diff --git a/src/Umbraco.Web/PropertyEditors/SimpleGridConfiguration.cs b/src/Umbraco.Web/PropertyEditors/SimpleGridConfiguration.cs
new file mode 100644
index 0000000000..8664c3b40c
--- /dev/null
+++ b/src/Umbraco.Web/PropertyEditors/SimpleGridConfiguration.cs
@@ -0,0 +1,6 @@
+namespace Umbraco.Web.PropertyEditors
+{
+    public class SimpleGridConfiguration : BlockEditorConfiguration
+    {
+    }
+}
diff --git a/src/Umbraco.Web/PropertyEditors/SimpleGridConfigurationEditor.cs b/src/Umbraco.Web/PropertyEditors/SimpleGridConfigurationEditor.cs
new file mode 100644
index 0000000000..eaa054ff7e
--- /dev/null
+++ b/src/Umbraco.Web/PropertyEditors/SimpleGridConfigurationEditor.cs
@@ -0,0 +1,9 @@
+using Umbraco.Core.PropertyEditors;
+
+namespace Umbraco.Web.PropertyEditors
+{
+    internal class SimpleGridConfigurationEditor : ConfigurationEditor<SimpleGridConfiguration>
+    {
+
+    }
+}
diff --git a/src/Umbraco.Web/PropertyEditors/SimpleGridPropertyEditor.cs b/src/Umbraco.Web/PropertyEditors/SimpleGridPropertyEditor.cs
new file mode 100644
index 0000000000..eb20a177ea
--- /dev/null
+++ b/src/Umbraco.Web/PropertyEditors/SimpleGridPropertyEditor.cs
@@ -0,0 +1,17 @@
+using Umbraco.Core.Logging;
+using Umbraco.Core.PropertyEditors;
+
+namespace Umbraco.Web.PropertyEditors
+{
+    [DataEditor("Umbraco.SimpleGrid", EditorType.PropertyValue , "Simple Grid", "simplegrid", ValueType = ValueTypes.Json, Group="rich content", Icon="icon-application-window-alt")]
+    public class SimpleGridPropertyEditor : DataEditor
+    {
+        public SimpleGridPropertyEditor(ILogger logger)
+            : base(logger)
+        { }
+
+        protected override IConfigurationEditor CreateConfigurationEditor() => new SimpleGridConfigurationEditor();
+
+        protected override IDataValueEditor CreateValueEditor() => base.CreateValueEditor();
+    }
+}
diff --git a/src/Umbraco.Web/Umbraco.Web.csproj b/src/Umbraco.Web/Umbraco.Web.csproj
index 4860559e00..57e2c722a5 100755
--- a/src/Umbraco.Web/Umbraco.Web.csproj
+++ b/src/Umbraco.Web/Umbraco.Web.csproj
@@ -212,8 +212,9 @@
     <Compile Include="Models\TemplateQuery\QueryConditionExtensions.cs" />
     <Compile Include="Mvc\SurfaceControllerTypeCollectionBuilder.cs" />
     <Compile Include="PropertyEditors\BlockEditorConfiguration.cs" />
-    <Compile Include="PropertyEditors\BlockEditorConfigurationEditor.cs" />
-    <Compile Include="PropertyEditors\BlockEditorPropertyEditor.cs" />
+    <Compile Include="PropertyEditors\SimpleGridConfiguration.cs" />
+    <Compile Include="PropertyEditors\SimpleGridConfigurationEditor.cs" />
+    <Compile Include="PropertyEditors\SimpleGridPropertyEditor.cs" />
     <Compile Include="PublishedCache\NuCache\Snap\GenObj.cs" />
     <Compile Include="PublishedCache\NuCache\Snap\GenRef.cs" />
     <Compile Include="PublishedCache\NuCache\Snap\LinkedNode.cs" />

From 663228c33bccb2a51e067c5752717cb17220a6a1 Mon Sep 17 00:00:00 2001
From: Callum Whyte <hey@callumwhyte.com>
Date: Mon, 20 May 2019 17:18:51 +0100
Subject: [PATCH 24/46] Updating block settings editor

---
 .../blockeditor/blockeditor.settings.html     | 27 +++++++++----------
 1 file changed, 12 insertions(+), 15 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.html
index b658421791..29e2978724 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.html
@@ -1,23 +1,20 @@
 <div ng-controller="Umbraco.PropertyEditors.BlockEditor.SettingsController">
 
-    <pre>{{model.value | json}}</pre>
-
-    <div ng-repeat="block in blocks">
-        <strong>
-            {{block.elementType}}
-        </strong>
-
-        <a href="" ng-click="editSettings(block)">
-            <localize key="general_settings">Settings</localize>
-        </a>
-
-        <a href="" ng-click="removeBlock($index)">
-            <localize key="general_remove">Remove</localize>
-        </a>
-    </div>
+    <umb-node-preview ng-repeat="block in blocks"
+                      name="getBlockName(block)"
+                      alias="block.elementType"
+                      icon="icon-folder"
+                      allow-edit="true"
+                      on-edit="editSettings(block)"
+                      allow-remove="true"
+                      on-remove="removeBlock($index)">
+    </umb-node-preview>
 
     <a href="" class="umb-node-preview-add" ng-click="addBlock()">
         <localize key="general_add">Add</localize>
     </a>
 
+    <hr />
+    <pre>{{model.value | json}}</pre>
+
 </div>

From 6c2401fa27603eb179a729549d3acf5424d55b01 Mon Sep 17 00:00:00 2001
From: Callum Whyte <hey@callumwhyte.com>
Date: Mon, 20 May 2019 17:24:37 +0100
Subject: [PATCH 25/46] Ensuring blocks are persisted when settings are saved

---
 .../blockeditor/blockeditor.settings.controller.js            | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.controller.js
index 0d7eedbcf0..3f1ef17d43 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.controller.js
@@ -30,6 +30,10 @@
                 openSettingsPicker(block);
             };
 
+            $scope.$on("formSubmitting", function () {
+                $scope.model.value = $scope.blocks;
+            });
+
             function openElementPicker(block) {
 
                 var pickerOptions = {

From e2b0053d318f2596101a0a9484cc873140f80e33 Mon Sep 17 00:00:00 2001
From: Kenn Jacobsen <post@kennjacobsen.dk>
Date: Mon, 20 May 2019 18:37:12 +0200
Subject: [PATCH 26/46] Rename default view to simple list

---
 .../directives/components/umbblockeditor.directive.js      | 7 ++++++-
 .../blockeditor/blockeditor.directive.controller.js        | 3 ---
 ....controller.js => blockeditor.simplelist.controller.js} | 4 ++--
 ...lockeditor.default.html => blockeditor.simplelist.html} | 2 +-
 4 files changed, 9 insertions(+), 7 deletions(-)
 rename src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/{blockeditor.default.controller.js => blockeditor.simplelist.controller.js} (57%)
 rename src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/{blockeditor.default.html => blockeditor.simplelist.html} (87%)

diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditor.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditor.directive.js
index 1fddf4dcc6..79463d1d24 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditor.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditor.directive.js
@@ -1,5 +1,9 @@
 angular.module("umbraco.directives").directive('umbBlockEditor', [
     function () {
+        var link = function (scope, el, attr, ctrl) {
+            scope.view = attr.view || "views/propertyeditors/blockeditor/blockeditor.simplelist.html";
+        };
+
         return {
             restrict: "E",
             templateUrl: "views/propertyeditors/blockeditor/blockeditor.directive.html",
@@ -9,7 +13,8 @@
                 blocks: "="
             },
             controller: "Umbraco.PropertyEditors.BlockEditor.DirectiveController",
-            controllerAs: "vm"
+            controllerAs: "vm",
+            link: link
         };
     }
 ]);
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.directive.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.directive.controller.js
index 681617871e..e4c16d4c28 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.directive.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.directive.controller.js
@@ -15,9 +15,6 @@
         if (!$scope.blocks) {
             $scope.blocks = [];
         }
-        if (!$scope.view) {
-            $scope.view = "views/propertyeditors/blockeditor/blockeditor.default.html";
-        }
         
         _.each($scope.config, function (config) {
             contentResource.getScaffoldByUdi(-20, config.elementType).then(function (scaffold) {
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.default.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.simplelist.controller.js
similarity index 57%
rename from src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.default.controller.js
rename to src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.simplelist.controller.js
index c3287170a7..b98eb2cd6d 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.default.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.simplelist.controller.js
@@ -1,4 +1,4 @@
-function BlockEditorDefaultController($scope, contentResource, editorService) {
+function BlockEditorSimpleListController($scope, contentResource, editorService) {
     $scope.sortableOptions = {
         axis: "y",
         cursor: "move",
@@ -6,4 +6,4 @@
         tolerance: 'pointer'
     };
 }
-angular.module("umbraco").controller("Umbraco.PropertyEditors.BlockEditor.DefaultController", BlockEditorDefaultController);
+angular.module("umbraco").controller("Umbraco.PropertyEditors.BlockEditor.SimpleListController", BlockEditorSimpleListController);
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.default.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.simplelist.html
similarity index 87%
rename from src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.default.html
rename to src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.simplelist.html
index 84cf55fe7d..ff4809da77 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.default.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.simplelist.html
@@ -1,4 +1,4 @@
-<div ng-controller="Umbraco.PropertyEditors.BlockEditor.DefaultController">
+<div ng-controller="Umbraco.PropertyEditors.BlockEditor.SimpleListController">
     <ul class="unstyled" ui-sortable="sortableOptions" ng-model="blocks">
         <li ng-repeat="block in blocks" style="border: 1px solid silver; margin-bottom: 4px; padding: 4px;">
             <div class="handle">

From 6529f472abce910c031cb904388b9772c12b3a53 Mon Sep 17 00:00:00 2001
From: Nathan Woulfe <nathan@nathanw.com.au>
Date: Tue, 21 May 2019 02:37:56 +1000
Subject: [PATCH 27/46] wip - will be merge issues with this.

---
 .../umbblockeditorblock.directive.js          |  2 +-
 .../components/umbnodepreview.directive.js    |  2 +-
 .../blockeditor/blockeditor.block.html        | 22 ++++-----
 .../blockeditor/blockeditor.blocks.html       |  8 ++--
 .../blockeditor/blockeditor.controller.js     | 48 ++++++++++---------
 .../blockeditor.editsettings.controller.js    |  9 ++--
 .../blockeditor/blockeditor.html              |  2 +-
 .../blockeditor.settings.controller.js        |  6 ++-
 .../blockeditor/blockeditor.settings.html     |  2 +-
 9 files changed, 51 insertions(+), 50 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblock.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblock.directive.js
index 0db2873782..ee042eac35 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblock.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblock.directive.js
@@ -10,4 +10,4 @@
             link: link
         };
     }
-]);
+]);
\ No newline at end of file
diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbnodepreview.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbnodepreview.directive.js
index 9f1f7a0d2e..4fb7abea9f 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbnodepreview.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbnodepreview.directive.js
@@ -100,7 +100,7 @@
 
         function link(scope, el, attr, ctrl) {
             if (!scope.editLabelKey) {
-                scope.editLabelKey = "general_edit";
+                scope.editLabelKey = "general_edit"; 
             }
             userService.getCurrentUser().then(function (u) {
                 var isAdmin = u.userGroups.indexOf('admin') !== -1;
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.block.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.block.html
index 85a5e578a4..68c30065ab 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.block.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.block.html
@@ -1,14 +1,14 @@
-<div>
-    <div style="cursor:pointer" ng-click="vm.editContent(block)" class="di">
-        Block identifier goes here (e.g. icon)
+<div class="umb-node-preview umb-node-preview--sortable">
+    <i ng-if="icon" class="umb-node-preview__icon {{ icon }}"></i>
+    <div class="umb-node-preview__content">
+        
+        <div class="umb-node-preview__name" ng-attr-title="{{alias}}">A name for block to identify it</div>
+        <div class="umb-node-preview__description" ng-if="description">{{ description }}</div>
+
     </div>
-    <div style="cursor:pointer" ng-click="vm.editSettings(block)" class="di">
-        <i class="icon icon-settings"></i>
-    </div>
-    <div style="cursor:move" class="di handle">
-        <i class="icon icon-navigation"></i>
-    </div>
-    <div style="cursor:pointer" ng-click="vm.remove(block)" class="di">
-        <i class="icon icon-trash"></i>
+    <div class="umb-node-preview__actions">
+        <a class="umb-node-preview__action" title="Edit" href="" ng-click="vm.editContent(block)"><localize key="general_edit">Edit</localize></a>
+        <a class="umb-node-preview__action" title="Settings" href="" ng-click="vm.editSettings(block)"><localize key="general_settings">Settings</localize></a>
+        <a class="umb-node-preview__action umb-node-preview__action--red" title="Remove" ng-href="" ng-click="vm.remove(block)"><localize key="general_remove">Remove</localize></a>
     </div>
 </div>
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.blocks.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.blocks.html
index 2763af5039..dc3afb5823 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.blocks.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.blocks.html
@@ -1,5 +1,3 @@
-<ul class="unstyled" ui-sortable="vm.sortableOptions" ng-model="model.value">
-    <li ng-repeat="block in model.value">
-        <umb-block-editor-block></umb-block-editor-block>
-    </li>
-</ul>
+<div ui-sortable="vm.sortableOptions" ng-model="model.value">
+    <umb-block-editor-block ng-repeat="block in model.value"></umb-block-editor-block>
+</div>
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js
index 22d42f76e1..acbee4ed0f 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js
@@ -16,6 +16,8 @@
     vm.remove = remove;
     vm.openNodeTypePicker = openNodeTypePicker;
 
+    let allowedElements = [];
+    
     // it would be awesome if we could load all scaffolds in one go... however we need to have an eye out for performance,
     // oddly enough it's been shown to actually be slower to load them all at once instead of one at a time
     var scaffoldsLoaded = 0;
@@ -48,6 +50,9 @@
                     return blockConfig.elementType === scaffold.udi;
                 });
             });
+            
+            allowedElements = vm.scaffolds.map(x => x.contentTypeAlias);
+            
             vm.loading = false;
         }
     }
@@ -92,7 +97,7 @@
 
         // this could be used for future limiting on node types
         vm.overlayMenu.availableItems = [];
-        _.each(vm.scaffolds, function (scaffold) {
+        vm.scaffolds.forEach(function (scaffold) {
             vm.overlayMenu.availableItems.push({
                 alias: scaffold.contentTypeAlias,
                 name: scaffold.contentTypeName,
@@ -113,24 +118,22 @@
         }
 
         vm.overlayMenu.pasteItems = [];
-//        var availableNodesForPaste = clipboardService.retriveDataOfType("elementType", contentTypeAliases);
-//        _.each(availableNodesForPaste, function (node) {
-//            vm.overlayMenu.pasteItems.push({
-//                alias: node.contentTypeAlias,
-//                name: node.name, //contentTypeName
-//                data: node,
-//                icon: iconHelper.convertFromLegacyIcon(node.icon)
-//            });
-//        });
-//
-//        vm.overlayMenu.title = vm.overlayMenu.pasteItems.length > 0 ? $scope.labels.grid_addElement : $scope.labels.content_createEmpty;
-//
-//        vm.overlayMenu.clickClearPaste = function ($event) {
-//            $event.stopPropagation();
-//            $event.preventDefault();
-//            clipboardService.clearEntriesOfType("elementType", contentTypeAliases);
-//            vm.overlayMenu.pasteItems = []; // This dialog is not connected via the clipboardService events, so we need to update manually.
-//        };
+        var availableNodesForPaste = clipboardService.retriveDataOfType("elementType", allowedElements);
+        availableNodesForPaste.forEach(function (node) {
+            vm.overlayMenu.pasteItems.push({
+                alias: node.contentTypeAlias,
+                name: node.name, //contentTypeName
+                data: node,
+                icon: iconHelper.convertFromLegacyIcon(node.icon)
+            });
+        });
+
+        vm.overlayMenu.clickClearPaste = function ($event) {
+            $event.stopPropagation();
+            $event.preventDefault();
+            clipboardService.clearEntriesOfType("elementType", allowedElements);
+            vm.overlayMenu.pasteItems = []; // This dialog is not connected via the clipboardService events, so we need to update manually.
+        };
 
         if (vm.overlayMenu.availableItems.length === 1 && vm.overlayMenu.pasteItems.length === 0) {
             // only one scaffold type - no need to display the picker
@@ -144,7 +147,7 @@
 
     function editContent(block) {
         var scaffold = _.findWhere(vm.scaffolds, {
-            udi: block.udi
+            udi: block.udi 
         });
         var element = angular.copy(scaffold);
         _.each(element.variants[0].tabs, function (tab) {
@@ -161,7 +164,7 @@
     function openContent(element, block) {
         var options = {
             element: element,
-            title: "TODO: Edit block title here",
+            title: 'Edit block',
             view: "views/propertyeditors/blockeditor/blockeditor.editcontent.html",
             submit: function (model) {
                 _.each(element.variants[0].tabs, function (tab) {
@@ -169,10 +172,11 @@
                         block.content[property.alias] = property.value;
                     });
                 });
+                            
                 if ($scope.model.value.indexOf(block) < 0) {
                     $scope.model.value.push(block);
                 }
-
+                
                 editorService.close();
             },
             close: function () {
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editsettings.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editsettings.controller.js
index fb8e212729..0cdb4d1525 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editsettings.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editsettings.controller.js
@@ -1,19 +1,16 @@
 function BlockEditorEditSettingsController($scope) {
-    var vm = this;
-    vm.submit = submit;
-    vm.close = close;
 
     function init() {
 
     }
 
-    function submit() {
+    this.submit = () => {
         if($scope.model.submit) {
             $scope.model.submit($scope.model);
         }
     }
 
-    function close() {
+    this.close = () => {
         if($scope.model.close) {
             $scope.model.close();
         }
@@ -21,4 +18,4 @@
 
     init();
 }
-angular.module("umbraco").controller("Umbraco.PropertyEditors.BlockEditor.EditSettingsController", BlockEditorEditSettingsController);
+angular.module("umbraco").controller("Umbraco.PropertyEditors.BlockEditor.EditSettingsController", ['$scope', BlockEditorEditSettingsController]);
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
index c5d5ee56b9..930294f755 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
@@ -4,7 +4,7 @@
     </div>
 
     <div ng-if="!vm.loading">
-        <umb-block-editor-blocks></umb-block-editor-blocks>
+        <umb-block-editor-blocks></umb-block-editor-blocks> 
 
         <div class="umb-nested-content__footer-bar">
             <a href class="umb-nested-content__add-content" ng-class="{ '--disabled': !vm.scaffolds.length }" ng-click="vm.openNodeTypePicker($event)" prevent-default>
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.controller.js
index 0d7eedbcf0..26ffcb23c3 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.controller.js
@@ -10,6 +10,8 @@
 
             if ($scope.model.value) {
                 $scope.blocks = $scope.model.value;
+            } else {
+                $scope.model.value = [];
             }
 
             contentTypeResource.getAll()
@@ -23,7 +25,7 @@
             };
 
             $scope.removeBlock = function (index) {
-                $scope.blocks.splice(index, 1);
+                $scope.model.value.splice(index, 1);
             };
 
             $scope.editSettings = function (block) {
@@ -43,7 +45,7 @@
                     submit: function (model) {
                         _.each(model.selection, function (elementType) {
                             block.elementType = elementType.udi;
-                            $scope.blocks.push(block);
+                            $scope.model.value.push(block);
                         });
 
                         editorService.close();
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.html
index b658421791..c91e900942 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.html
@@ -2,7 +2,7 @@
 
     <pre>{{model.value | json}}</pre>
 
-    <div ng-repeat="block in blocks">
+    <div ng-repeat="block in model.value">
         <strong>
             {{block.elementType}}
         </strong>

From 5c7a5193727b263a4be83f21a335ee7f5bea0f45 Mon Sep 17 00:00:00 2001
From: Nathan Woulfe <nathan@nathanw.com.au>
Date: Tue, 21 May 2019 22:43:53 +1000
Subject: [PATCH 28/46] Welcome to hell. This is a set of UI wire up changes,
 some of which might be a bit opinionated based on my opinion (ie I'm
 rendering the add content button on the base directive so it's not required
 to be re-implemented on different implementations). Adds settings for
 managing alt views too

---
 .../Persistence/Dtos/ContentTypeDto.cs        |   5 +-
 .../components/umbblockeditor.directive.js    |  12 +--
 .../umbblockeditorblock.directive.js          |   9 +-
 .../blockeditor/block.settings.html           |  12 +--
 .../blockeditor/blockeditor.block.html        |  21 ++--
 .../blockeditor.directive.controller.js       |  91 +++++++++---------
 .../blockeditor/blockeditor.directive.html    |  21 +++-
 .../blockeditor.editsettings.controller.js    |  11 +--
 .../blockeditor/blockeditor.editsettings.html |   6 +-
 .../blockeditor.settings.controller.js        |  35 ++++---
 .../blockeditor.simplelist.controller.js      |   6 +-
 .../blockeditor/blockeditor.simplelist.html   |   9 +-
 .../nestedcontent/nestedcontent.controller.js |   2 +-
 src/Umbraco.Web.UI/Umbraco.Web.UI.csproj      |   1 +
 .../config/thumbnails/feature.jpg             | Bin 0 -> 3883 bytes
 .../config/thumbnails/feature1.jpg            | Bin 0 -> 22446 bytes
 .../config/thumbnails/feature11.jpg           | Bin 0 -> 24788 bytes
 src/Umbraco.Web.UI/config/thumbnails/rte.jpg  | Bin 0 -> 7157 bytes
 .../BlockEditorConfiguration.cs               |   3 +
 19 files changed, 120 insertions(+), 124 deletions(-)
 create mode 100644 src/Umbraco.Web.UI/config/thumbnails/feature.jpg
 create mode 100644 src/Umbraco.Web.UI/config/thumbnails/feature1.jpg
 create mode 100644 src/Umbraco.Web.UI/config/thumbnails/feature11.jpg
 create mode 100644 src/Umbraco.Web.UI/config/thumbnails/rte.jpg

diff --git a/src/Umbraco.Core/Persistence/Dtos/ContentTypeDto.cs b/src/Umbraco.Core/Persistence/Dtos/ContentTypeDto.cs
index e7a14a26e2..2bd2203089 100644
--- a/src/Umbraco.Core/Persistence/Dtos/ContentTypeDto.cs
+++ b/src/Umbraco.Core/Persistence/Dtos/ContentTypeDto.cs
@@ -28,8 +28,9 @@ namespace Umbraco.Core.Persistence.Dtos
         [NullSetting(NullSetting = NullSettings.Null)]
         public string Icon { get; set; }
 
-        [Column("thumbnail")]
-        [Constraint(Default = "folder.png")]
+        //[Column("thumbnail")]
+        //[Constraint(Default = "folder.png")]
+        [ResultColumn]
         public string Thumbnail { get; set; }
 
         [Column("description")]
diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditor.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditor.directive.js
index 79463d1d24..513b727387 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditor.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditor.directive.js
@@ -1,11 +1,7 @@
 angular.module("umbraco.directives").directive('umbBlockEditor', [
     function () {
-        var link = function (scope, el, attr, ctrl) {
-            scope.view = attr.view || "views/propertyeditors/blockeditor/blockeditor.simplelist.html";
-        };
-
         return {
-            restrict: "E",
+            restrict: "E", 
             templateUrl: "views/propertyeditors/blockeditor/blockeditor.directive.html",
             scope: {
                 config: "=",
@@ -14,7 +10,7 @@
             },
             controller: "Umbraco.PropertyEditors.BlockEditor.DirectiveController",
             controllerAs: "vm",
-            link: link
         };
-    }
-]);
+    } 
+]); 
+ 
\ No newline at end of file
diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblock.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblock.directive.js
index b1afa5f0f4..7b533d0a4f 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblock.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblock.directive.js
@@ -1,13 +1,8 @@
 angular.module("umbraco.directives").directive('umbBlockEditorBlock', [
     function () {
-        var link = function (scope, el, attr, ctrl) {
-            scope.view = attr.view || "views/propertyeditors/blockeditor/blockeditor.block.html";
-        };
-
         return {
             restrict: "E",
-            template: "<div ng-include='view'></div>",
-            link: link
+            template: "<div ng-include='block.settings.view'></div>",
         };
     }
-]);
\ No newline at end of file
+]);
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/block.settings.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/block.settings.html
index 851126a11e..1a86afd8a5 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/block.settings.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/block.settings.html
@@ -1,5 +1,4 @@
 <div>
-
     <umb-editor-view>
 
         <umb-editor-header name="model.title"
@@ -27,7 +26,7 @@
                                           focus-on-filled="true"
                                           umb-auto-resize
                                           required
-                                          ng-keypress="vm.submitOnEnter($event)">
+                                          ng-keypress="submitOnEnter($event)">
                                 </textarea>
                             </div>
 
@@ -38,19 +37,19 @@
 
                         <div class="editor-wrapper umb-control-group control-group" ng-model="model.property.editor" val-require-component ng-if="!model.property.locked">
 
-                            <a data-element="editor-add" href="" ng-if="!model.property.editor" class="editor-placeholder" hotkey="alt+shift+e" ng-click="vm.openDataTypePicker(model.property)">
+                            <a data-element="editor-add" href="" ng-if="!model.property.editor" class="editor-placeholder" hotkey="alt+shift+e" ng-click="openDataTypePicker(model.property)">
                                 <localize key="shortcuts_addEditor"></localize>
                             </a>
 
                             <div class="editor clearfix" ng-if="model.property.editor">
 
-                                <a href="" class="editor-icon-wrapper" ng-click="vm.openDataTypePicker(model.property)">
+                                <a href="" class="editor-icon-wrapper" ng-click="openDataTypePicker(model.property)">
                                     <i class="icon {{ model.property.dataTypeIcon }}" ng-class="{'icon-autofill': model.property.dataTypeIcon == null}"></i>
                                 </a>
 
                                 <div class="editor-details">
-                                    <a href="" class="editor-name" ng-click="vm.openDataTypePicker(model.property)">{{ model.property.dataTypeName }}</a>
-                                    <a href="" class="editor-editor" ng-click="vm.openDataTypePicker(model.property)">{{ model.property.editor }}</a>
+                                    <a href="" class="editor-name" ng-click="openDataTypePicker(model.property)" ng-bind="model.property.dataTypeName"></a>
+                                    <a href="" class="editor-editor" ng-click="openDataTypePicker(model.property)" ng-bind="model.property.editor"></a>
                                 </div>
 
                                 <a href class="editor-settings-icon pull-right"
@@ -88,5 +87,4 @@
         </umb-editor-footer>
 
     </umb-editor-view>
-
 </div>
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.block.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.block.html
index b27f08e060..47d621188f 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.block.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.block.html
@@ -1,13 +1,12 @@
-<div>
-    <div>
-        <div style="cursor:pointer" ng-click="vm.editSettings(block)" class="di">
-            <i class="icon icon-settings"></i>
-        </div>
-        <div style="cursor:pointer" ng-click="vm.remove(block)" class="di">
-            <i class="icon icon-trash"></i>
-        </div>
+<div class="umb-node-preview umb-node-preview--sortable">
+    <i ng-if="block.icon" class="umb-node-preview__icon {{ block.icon }}"></i>
+    <div class="umb-node-preview__content">        
+        <div class="umb-node-preview__name" ng-attr-title="{{block.alias}}">A name for block to identify it</div>
+        <div class="umb-node-preview__description" ng-if="block.description">{{ block.description }}</div>
     </div>
-    <div style="cursor:pointer" ng-click="vm.editContent(block)">
-        Eventually a block identifier will go here (e.g. element type icon)
+    <div class="umb-node-preview__actions">
+        <a class="umb-node-preview__action" title="Edit" href="" ng-click="vm.editContent(block)"><localize key="general_edit">Edit</localize></a>
+        <a class="umb-node-preview__action" title="Settings" href="" ng-click="vm.editSettings(block)"><localize key="general_settings">Settings</localize></a>
+        <a class="umb-node-preview__action umb-node-preview__action--red" title="Remove" ng-href="" ng-click="vm.remove(block)"><localize key="general_remove">Remove</localize></a>
     </div>
-</div>
+</div> 
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.directive.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.directive.controller.js
index 6ea6010e57..9022e16a2c 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.directive.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.directive.controller.js
@@ -1,26 +1,20 @@
-function BlockEditorDirectiveController($scope, contentResource, editorService) {
-function BlockEditorPropertyEditorController($scope, contentResource, editorService, iconHelper, clipboardService) {
+function BlockEditorDirectiveController($scope, contentResource, editorService, iconHelper, clipboardService) {  
     var vm = this;
 
-    vm.scaffolds = [];
+    vm.scaffolds = []; 
     vm.loading = true;
-    vm.add = add;
-    vm.editContent = editContent;
-    vm.editSettings = editSettings;
-    vm.remove = remove;
-    vm.openNodeTypePicker = openNodeTypePicker;
 
-    let allowedElements = [];
-    
+    let allowedElements = []; 
+     
     // it would be awesome if we could load all scaffolds in one go... however we need to have an eye out for performance,
     // oddly enough it's been shown to actually be slower to load them all at once instead of one at a time
     var scaffoldsLoaded = 0;
-
+ 
     function init() {
         if (!$scope.blocks) {
             $scope.blocks = [];
         }
-        
+
         _.each($scope.config, function (config) {
             contentResource.getScaffoldByUdi(-20, config.elementType).then(function (scaffold) {
                 if (scaffold.isElement) {
@@ -39,7 +33,7 @@ function BlockEditorPropertyEditorController($scope, contentResource, editorServ
         });
     }
 
-    function initIfAllScaffoldsHaveLoaded() {
+    function initIfAllScaffoldsHaveLoaded() { 
         // Initialize when all scaffolds have loaded
         if ($scope.config.length === scaffoldsLoaded) {
             vm.scaffolds = _.sortBy(vm.scaffolds, function (scaffold) {
@@ -51,8 +45,6 @@ function BlockEditorPropertyEditorController($scope, contentResource, editorServ
             _.each($scope.blocks, function (block) {
                 applyFakeSettings(block);
             });
-
-
             
             allowedElements = vm.scaffolds.map(x => x.contentTypeAlias);
             
@@ -60,18 +52,8 @@ function BlockEditorPropertyEditorController($scope, contentResource, editorServ
         }
     }
 
-    function add(scaffold) {
-        var element = angular.copy(scaffold);
-        var block = {
-            udi: element.udi,
-            content: {},
-            settings: {}
-        };
-        openContent(element, block);
-    }
-
-    // nw => this needs to be refined, is currently largely a copy from nested content
-    function openNodeTypePicker($event) {
+    
+    vm.openNodeTypePicker = function($event) {
         
         vm.overlayMenu = {
             show: false,
@@ -81,16 +63,16 @@ function BlockEditorPropertyEditorController($scope, contentResource, editorServ
             view: "itempicker",
             event: $event,
             clickPasteItem: function (item) {
-                $scope.pasteFromClipboard(item.data);
+                vm.pasteFromClipboard(item.data);
                 vm.overlayMenu.show = false;
                 vm.overlayMenu = null;
             },
             submit: function (model) {
                 if (model && model.selectedItem) {                    
-                    add(vm.scaffolds.filter(x => x.contentTypeAlias === model.selectedItem.alias)[0]);
+                    vm.add(vm.scaffolds.filter(x => x.contentTypeAlias === model.selectedItem.alias)[0]);
                 }
                 vm.overlayMenu.show = false;
-                vm.overlayMenu = null;
+                vm.overlayMenu = null; 
             },
             close: function () {
                 vm.overlayMenu.show = false;
@@ -140,15 +122,28 @@ function BlockEditorPropertyEditorController($scope, contentResource, editorServ
 
         if (vm.overlayMenu.availableItems.length === 1 && vm.overlayMenu.pasteItems.length === 0) {
             // only one scaffold type - no need to display the picker
-            add(vm.scaffolds[0]);
+            vm.add(vm.scaffolds[0]);
             return;
         }
 
         vm.overlayMenu.show = true;
+    } 
+    
+     vm.add = function(scaffold) {
+        var element = angular.copy(scaffold);
+        var block = {
+            udi: element.udi,
+            icon: element.icon, 
+            description: element.documentType.description, // probably don't want to persist these.
+            content: {},
+            settings: {
+                view: 'views/propertyeditors/blockeditor/blockeditor.block.html'
+            }  
+        };
+        vm.openContent(element, block);
     }
 
-
-    function editContent(block) {
+    vm.editContent = function(block) {
         var scaffold = _.findWhere(vm.scaffolds, {
             udi: block.udi 
         });
@@ -161,10 +156,10 @@ function BlockEditorPropertyEditorController($scope, contentResource, editorServ
             });
         });
 
-        openContent(element, block);
+        vm.openContent(element, block);
     }
 
-    function openContent(element, block) {
+    vm.openContent = function(element, block) {
         var options = {
             element: element,
             title: 'Edit block',
@@ -189,14 +184,13 @@ function BlockEditorPropertyEditorController($scope, contentResource, editorServ
         editorService.open(options);
     }
 
-    function editSettings(block) {
+    vm.editSettings = function(block) {
         var options = {
             settings: block.settings,
-            title: "TODO: Edit settings title here",
+            title: "Edit settings",
             view: "views/propertyeditors/blockeditor/blockeditor.editsettings.html",
-            size: "medium",
+            size: "small",
             submit: function(model) {
-                applyFakeSettings(block);
                 editorService.close();
             },
             close: function () {
@@ -206,19 +200,22 @@ function BlockEditorPropertyEditorController($scope, contentResource, editorServ
         editorService.open(options);
     }
 
-    function remove(block) {
+    vm.remove = function(block) {
         // this should be replaced by a custom dialog (pending some PRs)
         if (confirm("TODO: Are you sure?")) {
             $scope.blocks.splice($scope.blocks.indexOf(block), 1);
         }
     }
-
-    init();
-
-    // TODO: remove this (only for testing)
+    
+        // TODO: remove this (only for testing)
+    // currently pushes random values for setting a css grid location
     function applyFakeSettings(block) {
-        block.settings["cols"] = 1 + Math.floor(Math.random() * 3);
-        block.settings["rows"] = 1 + Math.floor(Math.random() * 2);
+        block.settings["col"] = 1 + Math.floor(Math.random() * 7);
+        block.settings["row"] = 1 + Math.floor(Math.random() * 7);
+        block.settings["w"] = 1 + Math.floor(Math.random() * 3);
+        block.settings["h"] = 1 + Math.floor(Math.random() * 3);
     }
+    
+    init();
 }
-angular.module("umbraco").controller("Umbraco.PropertyEditors.BlockEditor.DirectiveController", BlockEditorDirectiveController);
+angular.module("umbraco").controller("Umbraco.PropertyEditors.BlockEditor.DirectiveController", ['$scope', 'contentResource', 'editorService', 'iconHelper', 'clipboardService', BlockEditorDirectiveController]);
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.directive.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.directive.html
index 98ae7a79fd..068cb99fc7 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.directive.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.directive.html
@@ -1,7 +1,24 @@
-<div>
+<div attr>
     <div style="position:relative" ng-if="vm.loading">
         <umb-load-indicator />
     </div>
 
-    <div ng-if="!vm.loading" ng-include="view"></div>
+    <div ng-if="!vm.loading" ng-include="view"></div>    
+    
+    <div ng-if="!vm.loading" class="umb-nested-content__footer-bar">
+        <a href class="umb-nested-content__add-content" ng-class="{ '--disabled': !vm.scaffolds.length }" ng-click="vm.openNodeTypePicker($event)" prevent-default>
+            <localize key="grid_addElement" ng-if="vm.scaffolds.length > 1"></localize>
+            <span ng-if="vm.scaffolds.length === 1">
+                <localize key="general_add"></localize> {{ vm.scaffolds[0].contentTypeName }}
+            </span>
+        </a>
+    </div>
+     
+    <umb-overlay 
+        ng-if="vm.overlayMenu.show"
+        position="target"
+        size="vm.overlayMenu.size"
+        view="vm.overlayMenu.view"
+        model="vm.overlayMenu">
+    </umb-overlay>
 </div>
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editsettings.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editsettings.controller.js
index 0cdb4d1525..c0a91ce5c9 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editsettings.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editsettings.controller.js
@@ -1,9 +1,5 @@
 function BlockEditorEditSettingsController($scope) {
 
-    function init() {
-
-    }
-
     this.submit = () => {
         if($scope.model.submit) {
             $scope.model.submit($scope.model);
@@ -14,8 +10,7 @@
         if($scope.model.close) {
             $scope.model.close();
         }
-    }
-
-    init();
+    } 
 }
-angular.module("umbraco").controller("Umbraco.PropertyEditors.BlockEditor.EditSettingsController", ['$scope', BlockEditorEditSettingsController]);
+angular.module("umbraco")
+    .controller("Umbraco.PropertyEditors.BlockEditor.EditSettingsController", ['$scope', BlockEditorEditSettingsController]);
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editsettings.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editsettings.html
index c97948f83d..703661345b 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editsettings.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editsettings.html
@@ -13,8 +13,10 @@
             <div ng-if="!loading">
                 <umb-box>
                     <umb-box-content>
-                        <ng-form name="editBlockForm" val-form-manager>
-                            <h3>Here be settings editing</h3>
+                        <ng-form name="editBlockForm" class="form-horizontal" val-form-manager>                            
+                            <umb-control-group label="{{key}}" description="" ng-repeat="(key, value) in model.settings">
+                                <input type="text" ng-model="model.settings[key]" ng-model-options="{ debounce: 5000 }"/>
+                            </umb-control-group>
                         </ng-form>
                     </umb-box-content>
                 </umb-box>
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.controller.js
index 5f65fdc007..a148d83fe7 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.controller.js
@@ -19,24 +19,17 @@
                     $scope.elementTypes.push(contentType);
                 });
 
-            $scope.addBlock = function () {
-                var block = {};
-                openElementPicker(block);
-            };
-
-            $scope.removeBlock = function (index) {
-                $scope.model.value.splice(index, 1);
-            };
-
-            $scope.editSettings = function (block) {
-                openSettingsPicker(block);
-            };
-
             $scope.$on("formSubmitting", function () {
                 $scope.model.value = $scope.blocks;
             });
 
-            function openElementPicker(block) {
+            $scope.getBlockName = function(udi) {
+                return 'Get block name from somewhere...';
+            }
+            
+            $scope.addBlock = function () {
+
+                var block = {};
 
                 var pickerOptions = {
                     title: "Pick an element type",
@@ -49,6 +42,9 @@
                     submit: function (model) {
                         _.each(model.selection, function (elementType) {
                             block.elementType = elementType.udi;
+                            block.settings = {
+                                view: 'views/propertyeditors/blockeditor/blockeditor.block.html'
+                            }
                             $scope.model.value.push(block);
                         });
 
@@ -62,12 +58,16 @@
                 editorService.open(pickerOptions);
             }
 
-            function openSettingsPicker(block) {
+            $scope.removeBlock = function (index) {
+                $scope.model.value.splice(index, 1);
+            };
+
+            $scope.editSettings = function (block) {
 
                 var pickerOptions = {
                     title: "Block settings",
                     view: "views/propertyeditors/blockeditor/block.settings.html",
-                    size: "small",
+                    size: "small",                    
                     submit: function (model) {
                         block.settings = model;
                         editorService.close();
@@ -80,5 +80,4 @@
                 editorService.open(pickerOptions);
             }
         }
-    ]
-);
+    ]);
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.simplelist.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.simplelist.controller.js
index b98eb2cd6d..b8e4d3e34e 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.simplelist.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.simplelist.controller.js
@@ -1,9 +1,9 @@
-function BlockEditorSimpleListController($scope, contentResource, editorService) {
+function BlockEditorSimpleListController($scope) {
     $scope.sortableOptions = {
-        axis: "y",
+        axis: "y", 
         cursor: "move",
         handle: ".handle",
         tolerance: 'pointer'
     };
 }
-angular.module("umbraco").controller("Umbraco.PropertyEditors.BlockEditor.SimpleListController", BlockEditorSimpleListController);
+angular.module("umbraco").controller("Umbraco.PropertyEditors.BlockEditor.SimpleListController", ['$scope', BlockEditorSimpleListController]);
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.simplelist.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.simplelist.html
index ff4809da77..d5971539d7 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.simplelist.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.simplelist.html
@@ -1,16 +1,9 @@
 <div ng-controller="Umbraco.PropertyEditors.BlockEditor.SimpleListController">
     <ul class="unstyled" ui-sortable="sortableOptions" ng-model="blocks">
-        <li ng-repeat="block in blocks" style="border: 1px solid silver; margin-bottom: 4px; padding: 4px;">
+        <li ng-repeat="block in blocks" class="handle">
             <div class="handle">
                 <umb-block-editor-block></umb-block-editor-block>
             </div>
         </li>
     </ul>
-
-    <div>
-        Add:
-        <div style="cursor:pointer" ng-click="vm.add(scaffold)" ng-repeat="scaffold in vm.scaffolds" class="di">
-            <i class="icon {{scaffold.documentType.icon}}"></i>
-        </div>
-    </div>
 </div>
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/nestedcontent/nestedcontent.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/nestedcontent/nestedcontent.controller.js
index 548782633b..fe42d515de 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/nestedcontent/nestedcontent.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/nestedcontent/nestedcontent.controller.js
@@ -18,7 +18,7 @@
         $scope.remove = function (index) {
             $scope.model.value.splice(index, 1);
         }
-
+  
         $scope.sortableOptions = {
             axis: "y",
             cursor: "move",
diff --git a/src/Umbraco.Web.UI/Umbraco.Web.UI.csproj b/src/Umbraco.Web.UI/Umbraco.Web.UI.csproj
index 7ae996a6c5..b02653c2a0 100644
--- a/src/Umbraco.Web.UI/Umbraco.Web.UI.csproj
+++ b/src/Umbraco.Web.UI/Umbraco.Web.UI.csproj
@@ -80,6 +80,7 @@
   </ItemGroup>
   <ItemGroup>
     <Folder Include="App_Data\" />
+    <Folder Include="Config\thumbnails\" />
     <Folder Include="Views\MacroPartials\" />
   </ItemGroup>
   <ItemGroup>
diff --git a/src/Umbraco.Web.UI/config/thumbnails/feature.jpg b/src/Umbraco.Web.UI/config/thumbnails/feature.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..8f8a62091c508245db21633613da895abc758498
GIT binary patch
literal 3883
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

literal 0
HcmV?d00001

diff --git a/src/Umbraco.Web.UI/config/thumbnails/feature1.jpg b/src/Umbraco.Web.UI/config/thumbnails/feature1.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..9ddaadef20e4e2ce6a7f9e0daf1e8335d6ab577e
GIT binary patch
literal 22446
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
R^*ZgqbDG1@Rs^;^{69@k@tptw

literal 0
HcmV?d00001

diff --git a/src/Umbraco.Web.UI/config/thumbnails/feature11.jpg b/src/Umbraco.Web.UI/config/thumbnails/feature11.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..0cc0715bda8b4ad78694687e7ba23eaa1c5ec0ae
GIT binary patch
literal 24788
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
VQTW;U)LwN!B)Z%{9jtsj@;`z7qm}>w

literal 0
HcmV?d00001

diff --git a/src/Umbraco.Web.UI/config/thumbnails/rte.jpg b/src/Umbraco.Web.UI/config/thumbnails/rte.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..02d118ba17f04022a0c8c624824729197923217a
GIT binary patch
literal 7157
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

literal 0
HcmV?d00001

diff --git a/src/Umbraco.Web/PropertyEditors/BlockEditorConfiguration.cs b/src/Umbraco.Web/PropertyEditors/BlockEditorConfiguration.cs
index c96c901861..ed1c3ad8df 100644
--- a/src/Umbraco.Web/PropertyEditors/BlockEditorConfiguration.cs
+++ b/src/Umbraco.Web/PropertyEditors/BlockEditorConfiguration.cs
@@ -9,6 +9,9 @@ namespace Umbraco.Web.PropertyEditors
         [ConfigurationField("blocks", "Blocks", "views/propertyeditors/blockeditor/blockeditor.settings.html")]
         public Block[] Blocks { get; set; }
 
+        [ConfigurationField("view", "View", "textstring", Description = "The path to a custom view for rendering the editor")]
+        public string View { get; set; }
+
         public class Block
         {
             [JsonProperty("elementType")]

From 97896e96af95cf2814f2ac740d7f0d8e11c69a1d Mon Sep 17 00:00:00 2001
From: Kenn Jacobsen <post@kennjacobsen.dk>
Date: Mon, 27 May 2019 21:22:43 +0200
Subject: [PATCH 29/46] Optionally pass block view from editor view + enforce
 editor view + rename simplelist block view

---
 .../directives/components/umbblockeditor.directive.js       | 5 ++---
 .../directives/components/umbblockeditorblock.directive.js  | 6 +++++-
 ...keditor.block.html => blockeditor.simplelist.block.html} | 0
 .../propertyeditors/blockeditor/blockeditor.simplelist.html | 4 ++--
 .../src/views/propertyeditors/simplegrid/simplegrid.html    | 2 +-
 5 files changed, 10 insertions(+), 7 deletions(-)
 rename src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/{blockeditor.block.html => blockeditor.simplelist.block.html} (100%)

diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditor.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditor.directive.js
index 513b727387..fae2d1ced0 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditor.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditor.directive.js
@@ -5,12 +5,11 @@
             templateUrl: "views/propertyeditors/blockeditor/blockeditor.directive.html",
             scope: {
                 config: "=",
-                view: "=?",
+                view: "@",
                 blocks: "="
             },
             controller: "Umbraco.PropertyEditors.BlockEditor.DirectiveController",
-            controllerAs: "vm",
+            controllerAs: "vm"
         };
     } 
 ]); 
- 
\ No newline at end of file
diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblock.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblock.directive.js
index 7b533d0a4f..3916468e6e 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblock.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblock.directive.js
@@ -1,8 +1,12 @@
 angular.module("umbraco.directives").directive('umbBlockEditorBlock', [
     function () {
+        var link = function (scope, el, attr, ctrl) {
+            scope.view = scope.block.view || attr.view;
+        };
         return {
             restrict: "E",
-            template: "<div ng-include='block.settings.view'></div>",
+            template: "<div ng-include='view'></div>",
+            link: link
         };
     }
 ]);
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.block.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.simplelist.block.html
similarity index 100%
rename from src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.block.html
rename to src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.simplelist.block.html
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.simplelist.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.simplelist.html
index d5971539d7..2e36a68dac 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.simplelist.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.simplelist.html
@@ -1,8 +1,8 @@
 <div ng-controller="Umbraco.PropertyEditors.BlockEditor.SimpleListController">
     <ul class="unstyled" ui-sortable="sortableOptions" ng-model="blocks">
-        <li ng-repeat="block in blocks" class="handle">
+        <li ng-repeat="block in blocks">
             <div class="handle">
-                <umb-block-editor-block></umb-block-editor-block>
+                <umb-block-editor-block view="views/propertyeditors/blockeditor/blockeditor.simplelist.block.html"></umb-block-editor-block>
             </div>
         </li>
     </ul>
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/simplegrid/simplegrid.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/simplegrid/simplegrid.html
index 3c95c536f3..ea0f004006 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/simplegrid/simplegrid.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/simplegrid/simplegrid.html
@@ -1 +1 @@
-<umb-block-editor blocks="model.value" config="model.config.blocks"></umb-block-editor>
+<umb-block-editor blocks="model.value" config="model.config.blocks" view="views/propertyeditors/blockeditor/blockeditor.simplelist.html"></umb-block-editor>

From 57e58c6cf75112c738ca08e9398dcc77915b64fb Mon Sep 17 00:00:00 2001
From: Kenn Jacobsen <kja@vertica.dk>
Date: Fri, 2 Aug 2019 11:43:22 +0200
Subject: [PATCH 30/46] Fix broken button to open content type from create
 dialog

---
 .../src/views/content/content.create.controller.js           | 5 +++++
 src/Umbraco.Web.UI.Client/src/views/content/create.html      | 2 +-
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/Umbraco.Web.UI.Client/src/views/content/content.create.controller.js b/src/Umbraco.Web.UI.Client/src/views/content/content.create.controller.js
index d04c707b25..f906369926 100644
--- a/src/Umbraco.Web.UI.Client/src/views/content/content.create.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/content/content.create.controller.js
@@ -94,6 +94,11 @@ function contentCreateController($scope,
         navigationService.hideDialog(showMenu);
     };
 
+    $scope.editContentType = function() {
+        $location.path("/settings/documenttypes/edit/" + $scope.contentTypeId).search("view", "permissions");
+        close();
+    }
+
     $scope.createBlank = createBlank;
     $scope.createOrSelectBlueprintIfAny = createOrSelectBlueprintIfAny;
     $scope.createFromBlueprint = createFromBlueprint;
diff --git a/src/Umbraco.Web.UI.Client/src/views/content/create.html b/src/Umbraco.Web.UI.Client/src/views/content/create.html
index 059b5eaf25..b8303efade 100644
--- a/src/Umbraco.Web.UI.Client/src/views/content/create.html
+++ b/src/Umbraco.Web.UI.Client/src/views/content/create.html
@@ -10,7 +10,7 @@
                 <p class="abstract" ng-if="!hasSettingsAccess"><localize key="create_noDocumentTypesWithNoSettingsAccess"/></p>
                 <div ng-if="hasSettingsAccess">
                     <p class="abstract"><localize key="create_noDocumentTypes" /></p>
-                    <button class="btn umb-outline" href="#settings/documentTypes/edit/{{contentTypeId}}?view=permissions" ng-click="close()">
+                    <button class="btn umb-outline" ng-click="editContentType()">
                         <localize key="create_noDocumentTypesEditPermissions"/>
                     </button>
                 </div>

From 0c83c3a9a9be8a4bb70136a995bda0ef84248b7c Mon Sep 17 00:00:00 2001
From: Shannon <sdeminick@gmail.com>
Date: Thu, 8 Aug 2019 19:02:55 +1000
Subject: [PATCH 31/46] Revert thumbnail changes

---
 src/Umbraco.Core/IO/SystemDirectories.cs      |  2 -
 src/Umbraco.Core/Models/ContentTypeBase.cs    | 19 +++------
 src/Umbraco.Core/Models/IContentTypeBase.cs   |  2 +-
 .../Packaging/PackageDataInstallation.cs      |  1 +
 .../Factories/ContentTypeFactory.cs           |  1 +
 .../Persistence/Mappers/ContentTypeMapper.cs  |  1 +
 .../Mapping/ContentTypeMapDefinition.cs       |  4 ++
 src/Umbraco.Web/Models/Trees/TreeNode.cs      | 42 +++++++++++++++++++
 8 files changed, 56 insertions(+), 16 deletions(-)

diff --git a/src/Umbraco.Core/IO/SystemDirectories.cs b/src/Umbraco.Core/IO/SystemDirectories.cs
index 9f74accd4a..2f33d82bdc 100644
--- a/src/Umbraco.Core/IO/SystemDirectories.cs
+++ b/src/Umbraco.Core/IO/SystemDirectories.cs
@@ -39,8 +39,6 @@ namespace Umbraco.Core.IO
 
         public static string Preview => Data + "/preview";
 
-        public static string Thumbnails => Config + "/thumbnails";
-
         private static string _root;
 
         /// <summary>
diff --git a/src/Umbraco.Core/Models/ContentTypeBase.cs b/src/Umbraco.Core/Models/ContentTypeBase.cs
index b04b30b3cc..04bcb7424a 100644
--- a/src/Umbraco.Core/Models/ContentTypeBase.cs
+++ b/src/Umbraco.Core/Models/ContentTypeBase.cs
@@ -2,10 +2,8 @@
 using System.Collections.Generic;
 using System.Collections.Specialized;
 using System.Diagnostics;
-using System.IO;
 using System.Linq;
 using System.Runtime.Serialization;
-using Umbraco.Core.IO;
 using Umbraco.Core.Models.Entities;
 using Umbraco.Core.Strings;
 
@@ -22,6 +20,7 @@ namespace Umbraco.Core.Models
         private string _alias;
         private string _description;
         private string _icon = "icon-folder";
+        private string _thumbnail = "folder.png";
         private bool _allowedAsRoot; // note: only one that's not 'pure element type'
         private bool _isContainer;
         private bool _isElement;
@@ -153,14 +152,8 @@ namespace Umbraco.Core.Models
         [DataMember]
         public string Thumbnail
         {
-            get
-            {
-                var thumbsFolder = new DirectoryInfo(IOHelper.MapPath(SystemDirectories.Thumbnails));
-                var files = Directory.GetFiles(thumbsFolder.FullName, $"{Alias}.*");
-
-                return files.Length == 1 ?
-                    IOHelper.ResolveVirtualUrl($"{SystemDirectories.Thumbnails}/{System.IO.Path.GetFileName(files[0])}") : null;
-            }
+            get => _thumbnail;
+            set => SetPropertyValueAndDetectChanges(value, ref _thumbnail, nameof(Thumbnail));
         }
 
         /// <summary>
@@ -479,7 +472,7 @@ namespace Umbraco.Core.Models
         {
             base.PerformDeepClone(clone);
 
-            var clonedEntity = (ContentTypeBase)clone;
+            var clonedEntity = (ContentTypeBase) clone;
 
             if (clonedEntity._noGroupPropertyTypes != null)
             {
@@ -488,14 +481,14 @@ namespace Umbraco.Core.Models
                 // we end up with duplicates, see: http://issues.umbraco.org/issue/U4-4842
 
                 clonedEntity._noGroupPropertyTypes.CollectionChanged -= PropertyTypesChanged;                    //clear this event handler if any
-                clonedEntity._noGroupPropertyTypes = (PropertyTypeCollection)_noGroupPropertyTypes.DeepClone(); //manually deep clone
+                clonedEntity._noGroupPropertyTypes = (PropertyTypeCollection) _noGroupPropertyTypes.DeepClone(); //manually deep clone
                 clonedEntity._noGroupPropertyTypes.CollectionChanged += clonedEntity.PropertyTypesChanged;              //re-assign correct event handler
             }
 
             if (clonedEntity._propertyGroups != null)
             {
                 clonedEntity._propertyGroups.CollectionChanged -= PropertyGroupsChanged;              //clear this event handler if any
-                clonedEntity._propertyGroups = (PropertyGroupCollection)_propertyGroups.DeepClone(); //manually deep clone
+                clonedEntity._propertyGroups = (PropertyGroupCollection) _propertyGroups.DeepClone(); //manually deep clone
                 clonedEntity._propertyGroups.CollectionChanged += clonedEntity.PropertyGroupsChanged;        //re-assign correct event handler
             }
         }
diff --git a/src/Umbraco.Core/Models/IContentTypeBase.cs b/src/Umbraco.Core/Models/IContentTypeBase.cs
index 773b80f917..5f1fe6ed49 100644
--- a/src/Umbraco.Core/Models/IContentTypeBase.cs
+++ b/src/Umbraco.Core/Models/IContentTypeBase.cs
@@ -33,7 +33,7 @@ namespace Umbraco.Core.Models
         /// <summary>
         /// Gets or Sets the Thumbnail for the ContentType
         /// </summary>
-        string Thumbnail { get; }
+        string Thumbnail { get; set; }
 
         /// <summary>
         /// Gets or Sets a boolean indicating whether this ContentType is allowed at the root
diff --git a/src/Umbraco.Core/Packaging/PackageDataInstallation.cs b/src/Umbraco.Core/Packaging/PackageDataInstallation.cs
index de8033ee3c..c811f484bc 100644
--- a/src/Umbraco.Core/Packaging/PackageDataInstallation.cs
+++ b/src/Umbraco.Core/Packaging/PackageDataInstallation.cs
@@ -572,6 +572,7 @@ namespace Umbraco.Core.Packaging
 
             contentType.Name = infoElement.Element("Name").Value;
             contentType.Icon = infoElement.Element("Icon").Value;
+            contentType.Thumbnail = infoElement.Element("Thumbnail").Value;
             contentType.Description = infoElement.Element("Description").Value;
 
             //NOTE AllowAtRoot is a new property in the package xml so we need to verify it exists before using it.
diff --git a/src/Umbraco.Core/Persistence/Factories/ContentTypeFactory.cs b/src/Umbraco.Core/Persistence/Factories/ContentTypeFactory.cs
index aab92c7605..54cfee0ffa 100644
--- a/src/Umbraco.Core/Persistence/Factories/ContentTypeFactory.cs
+++ b/src/Umbraco.Core/Persistence/Factories/ContentTypeFactory.cs
@@ -110,6 +110,7 @@ namespace Umbraco.Core.Persistence.Factories
             entity.Alias = dto.Alias;
             entity.Name = dto.NodeDto.Text;
             entity.Icon = dto.Icon;
+            entity.Thumbnail = dto.Thumbnail;
             entity.SortOrder = dto.NodeDto.SortOrder;
             entity.Description = dto.Description;
             entity.CreateDate = dto.NodeDto.CreateDate;
diff --git a/src/Umbraco.Core/Persistence/Mappers/ContentTypeMapper.cs b/src/Umbraco.Core/Persistence/Mappers/ContentTypeMapper.cs
index 987b87d65e..b14fc546c8 100644
--- a/src/Umbraco.Core/Persistence/Mappers/ContentTypeMapper.cs
+++ b/src/Umbraco.Core/Persistence/Mappers/ContentTypeMapper.cs
@@ -35,6 +35,7 @@ namespace Umbraco.Core.Persistence.Mappers
             DefineMap<ContentType, ContentTypeDto>(nameof(ContentType.Icon), nameof(ContentTypeDto.Icon));
             DefineMap<ContentType, ContentTypeDto>(nameof(ContentType.IsContainer), nameof(ContentTypeDto.IsContainer));
             DefineMap<ContentType, ContentTypeDto>(nameof(ContentType.IsElement), nameof(ContentTypeDto.IsElement));
+            DefineMap<ContentType, ContentTypeDto>(nameof(ContentType.Thumbnail), nameof(ContentTypeDto.Thumbnail));
         }
     }
 }
diff --git a/src/Umbraco.Web/Models/Mapping/ContentTypeMapDefinition.cs b/src/Umbraco.Web/Models/Mapping/ContentTypeMapDefinition.cs
index 9c66fc9c75..fc029eabe4 100644
--- a/src/Umbraco.Web/Models/Mapping/ContentTypeMapDefinition.cs
+++ b/src/Umbraco.Web/Models/Mapping/ContentTypeMapDefinition.cs
@@ -184,6 +184,7 @@ namespace Umbraco.Web.Models.Mapping
             target.Name = source.Name;
             target.ParentId = source.ParentId;
             target.Path = source.Path;
+            target.Thumbnail = source.Thumbnail;
             target.Trashed = source.Trashed;
             target.UpdateDate = source.UpdateDate;
         }
@@ -386,6 +387,7 @@ namespace Umbraco.Web.Models.Mapping
             target.Name = source.Name;
             target.ParentId = source.ParentId;
             target.Path = source.Path;
+            target.Thumbnail = source.Thumbnail;
 
             target.AllowedAsRoot = source.AllowAsRoot;
             target.AllowedContentTypes = source.AllowedContentTypes.Select((t, i) => new ContentTypeSort(t, i));
@@ -481,6 +483,7 @@ namespace Umbraco.Web.Models.Mapping
             target.Name = source.Name;
             target.ParentId = source.ParentId;
             target.Path = source.Path;
+            target.Thumbnail = source.Thumbnail;
             target.Udi = MapContentTypeUdi(source);
             target.UpdateDate = source.UpdateDate;
 
@@ -517,6 +520,7 @@ namespace Umbraco.Web.Models.Mapping
             target.Name = source.Name;
             target.ParentId = source.ParentId;
             target.Path = source.Path;
+            target.Thumbnail = source.Thumbnail;
             target.Trashed = source.Trashed;
             target.Udi = source.Udi;
         }
diff --git a/src/Umbraco.Web/Models/Trees/TreeNode.cs b/src/Umbraco.Web/Models/Trees/TreeNode.cs
index f32b10c34d..63614b141f 100644
--- a/src/Umbraco.Web/Models/Trees/TreeNode.cs
+++ b/src/Umbraco.Web/Models/Trees/TreeNode.cs
@@ -75,6 +75,48 @@ namespace Umbraco.Web.Models.Trees
         [DataMember(Name = "menuUrl")]
         public string MenuUrl { get; set; }
 
+        /// <summary>
+        /// Returns true if the icon represents a CSS class instead of a file path
+        /// </summary>
+        [DataMember(Name = "iconIsClass")]
+        public bool IconIsClass
+        {
+            get
+            {
+                if (Icon.IsNullOrWhiteSpace())
+                {
+                    return true;
+                }
+
+                if (Icon.StartsWith(".."))
+                    return false;
+
+
+                //if it starts with a '.' or doesn't contain a '.' at all then it is a class
+                return Icon.StartsWith(".") || Icon.Contains(".") == false;
+            }
+        }
+
+        /// <summary>
+        /// Returns the icon file path if the icon is not a class, otherwise returns an empty string
+        /// </summary>
+        [DataMember(Name = "iconFilePath")]
+        public string IconFilePath
+        {
+            get
+            {
+                if (IconIsClass)
+                    return string.Empty;
+
+                //absolute path with or without tilde
+                if (Icon.StartsWith("~") || Icon.StartsWith("/"))
+                    return IOHelper.ResolveUrl("~" + Icon.TrimStart('~'));
+
+                //legacy icon path
+                return string.Format("{0}images/umbraco/{1}", Current.Configs.Global().Path.EnsureEndsWith("/"), Icon);
+            }
+        }
+
         /// <summary>
         /// A list of additional/custom css classes to assign to the node
         /// </summary>

From b27e10c207c8a92875c1cfce4824d178a06f0291 Mon Sep 17 00:00:00 2001
From: Shannon <sdeminick@gmail.com>
Date: Thu, 8 Aug 2019 19:45:19 +1000
Subject: [PATCH 32/46] reverting thumbnail changes

---
 .../Persistence/Dtos/ContentTypeDto.cs          |   4 ++--
 src/Umbraco.Web.UI/Umbraco.Web.UI.csproj        |   1 -
 .../config/thumbnails/feature.jpg               | Bin 3883 -> 0 bytes
 .../config/thumbnails/feature1.jpg              | Bin 22446 -> 0 bytes
 .../config/thumbnails/feature11.jpg             | Bin 24788 -> 0 bytes
 src/Umbraco.Web.UI/config/thumbnails/rte.jpg    | Bin 7157 -> 0 bytes
 6 files changed, 2 insertions(+), 3 deletions(-)
 delete mode 100644 src/Umbraco.Web.UI/config/thumbnails/feature.jpg
 delete mode 100644 src/Umbraco.Web.UI/config/thumbnails/feature1.jpg
 delete mode 100644 src/Umbraco.Web.UI/config/thumbnails/feature11.jpg
 delete mode 100644 src/Umbraco.Web.UI/config/thumbnails/rte.jpg

diff --git a/src/Umbraco.Core/Persistence/Dtos/ContentTypeDto.cs b/src/Umbraco.Core/Persistence/Dtos/ContentTypeDto.cs
index 2bd2203089..609392fbee 100644
--- a/src/Umbraco.Core/Persistence/Dtos/ContentTypeDto.cs
+++ b/src/Umbraco.Core/Persistence/Dtos/ContentTypeDto.cs
@@ -28,8 +28,8 @@ namespace Umbraco.Core.Persistence.Dtos
         [NullSetting(NullSetting = NullSettings.Null)]
         public string Icon { get; set; }
 
-        //[Column("thumbnail")]
-        //[Constraint(Default = "folder.png")]
+        [Column("thumbnail")]
+        [Constraint(Default = "folder.png")]
         [ResultColumn]
         public string Thumbnail { get; set; }
 
diff --git a/src/Umbraco.Web.UI/Umbraco.Web.UI.csproj b/src/Umbraco.Web.UI/Umbraco.Web.UI.csproj
index 6dd37ed2aa..147912ed41 100644
--- a/src/Umbraco.Web.UI/Umbraco.Web.UI.csproj
+++ b/src/Umbraco.Web.UI/Umbraco.Web.UI.csproj
@@ -80,7 +80,6 @@
   </ItemGroup>
   <ItemGroup>
     <Folder Include="App_Data\" />
-    <Folder Include="Config\thumbnails\" />
     <Folder Include="Views\MacroPartials\" />
   </ItemGroup>
   <ItemGroup>
diff --git a/src/Umbraco.Web.UI/config/thumbnails/feature.jpg b/src/Umbraco.Web.UI/config/thumbnails/feature.jpg
deleted file mode 100644
index 8f8a62091c508245db21633613da895abc758498..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 3883
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

diff --git a/src/Umbraco.Web.UI/config/thumbnails/feature1.jpg b/src/Umbraco.Web.UI/config/thumbnails/feature1.jpg
deleted file mode 100644
index 9ddaadef20e4e2ce6a7f9e0daf1e8335d6ab577e..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 22446
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
R^*ZgqbDG1@Rs^;^{69@k@tptw

diff --git a/src/Umbraco.Web.UI/config/thumbnails/feature11.jpg b/src/Umbraco.Web.UI/config/thumbnails/feature11.jpg
deleted file mode 100644
index 0cc0715bda8b4ad78694687e7ba23eaa1c5ec0ae..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 24788
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
VQTW;U)LwN!B)Z%{9jtsj@;`z7qm}>w

diff --git a/src/Umbraco.Web.UI/config/thumbnails/rte.jpg b/src/Umbraco.Web.UI/config/thumbnails/rte.jpg
deleted file mode 100644
index 02d118ba17f04022a0c8c624824729197923217a..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 7157
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


From 3b6c99a05dc6acfdd373b747a36ab51d3053f4c6 Mon Sep 17 00:00:00 2001
From: Shannon <sdeminick@gmail.com>
Date: Thu, 8 Aug 2019 19:46:35 +1000
Subject: [PATCH 33/46] Revert "update models to make thumbnail get-only, and
 map to file"

This reverts commit 8279e6208b6749d8e5da67ea6444f1d2b9103570.
---
 .../Configuration/Grid/IGridEditorConfig.cs   |  2 -
 .../PropertyEditors/GridEditor.cs             | 16 -----
 .../Models/ContentEditing/ContentTypeBasic.cs | 65 +++++++++++++++++--
 .../NestedContentConfiguration.cs             | 15 -----
 4 files changed, 58 insertions(+), 40 deletions(-)

diff --git a/src/Umbraco.Core/Configuration/Grid/IGridEditorConfig.cs b/src/Umbraco.Core/Configuration/Grid/IGridEditorConfig.cs
index 8d74354b94..e447f7f493 100644
--- a/src/Umbraco.Core/Configuration/Grid/IGridEditorConfig.cs
+++ b/src/Umbraco.Core/Configuration/Grid/IGridEditorConfig.cs
@@ -10,8 +10,6 @@ namespace Umbraco.Core.Configuration.Grid
         string View { get; }
         string Render { get; }
         string Icon { get; }
-        string Thumbnail { get; }
-        string Description { get; }
         IDictionary<string, object> Config { get; }
     }
 }
diff --git a/src/Umbraco.Core/PropertyEditors/GridEditor.cs b/src/Umbraco.Core/PropertyEditors/GridEditor.cs
index a55502e089..986eed9ccc 100644
--- a/src/Umbraco.Core/PropertyEditors/GridEditor.cs
+++ b/src/Umbraco.Core/PropertyEditors/GridEditor.cs
@@ -1,5 +1,4 @@
 using System.Collections.Generic;
-using System.IO;
 using Newtonsoft.Json;
 using Umbraco.Core.Configuration.Grid;
 using Umbraco.Core.IO;
@@ -39,21 +38,6 @@ namespace Umbraco.Core.PropertyEditors
         [JsonProperty("icon", Required = Required.Always)]
         public string Icon { get; set; }
 
-        [JsonProperty("thumbnail")]
-        public string Thumbnail {
-            get
-            {
-                var thumbsFolder = new DirectoryInfo(IOHelper.MapPath(SystemDirectories.Thumbnails));
-                var files = Directory.GetFiles(thumbsFolder.FullName, $"{Alias}.*");
-
-                return files.Length == 1 ?
-                    IOHelper.ResolveVirtualUrl($"{SystemDirectories.Thumbnails}/{Path.GetFileName(files[0])}") : null;
-            }
-        }
-
-        [JsonProperty("description")]
-        public string Description { get; set; }
-
         [JsonProperty("config")]
         public IDictionary<string, object> Config { get; set; }
 
diff --git a/src/Umbraco.Web/Models/ContentEditing/ContentTypeBasic.cs b/src/Umbraco.Web/Models/ContentEditing/ContentTypeBasic.cs
index b0af0882d8..56d81a3189 100644
--- a/src/Umbraco.Web/Models/ContentEditing/ContentTypeBasic.cs
+++ b/src/Umbraco.Web/Models/ContentEditing/ContentTypeBasic.cs
@@ -2,7 +2,6 @@
 using System.Collections.Generic;
 using System.ComponentModel;
 using System.ComponentModel.DataAnnotations;
-using System.IO;
 using System.Runtime.Serialization;
 using Umbraco.Core;
 using Umbraco.Core.Composing;
@@ -46,19 +45,71 @@ namespace Umbraco.Web.Models.ContentEditing
         public string Description { get; set; }
 
         [DataMember(Name = "thumbnail")]
+        public string Thumbnail { get; set; }
+
+        /// <summary>
+        /// Returns true if the icon represents a CSS class instead of a file path
+        /// </summary>
+        [DataMember(Name = "iconIsClass")]
         [ReadOnly(true)]
-        public string Thumbnail
+        public bool IconIsClass
         {
             get
             {
-                var thumbsFolder = new DirectoryInfo(IOHelper.MapPath(SystemDirectories.Thumbnails));
-                var files = Directory.GetFiles(thumbsFolder.FullName, $"{Alias}.*");
-                if (files.Length == 1) // ignore duplicates
+                if (Icon.IsNullOrWhiteSpace())
                 {
-                    return IOHelper.ResolveVirtualUrl($"{SystemDirectories.Thumbnails}/{System.IO.Path.GetFileName(files[0])}");
+                    return true;
                 }
+                //if it starts with a '.' or doesn't contain a '.' at all then it is a class
+                return Icon.StartsWith(".") || Icon.Contains(".") == false;
+            }
+        }
 
-                return null;                
+        /// <summary>
+        /// Returns the icon file path if the icon is not a class, otherwise returns an empty string
+        /// </summary>
+        [DataMember(Name = "iconFilePath")]
+        [ReadOnly(true)]
+        public string IconFilePath
+        {
+            get
+            {
+                return IconIsClass
+                    ? string.Empty
+                    : string.Format("{0}images/umbraco/{1}", Current.Configs.Global().Path.EnsureEndsWith("/"), Icon);
+            }
+        }
+
+        /// <summary>
+        /// Returns true if the icon represents a CSS class instead of a file path
+        /// </summary>
+        [DataMember(Name = "thumbnailIsClass")]
+        [ReadOnly(true)]
+        public bool ThumbnailIsClass
+        {
+            get
+            {
+                if (Thumbnail.IsNullOrWhiteSpace())
+                {
+                    return true;
+                }
+                //if it starts with a '.' or doesn't contain a '.' at all then it is a class
+                return Thumbnail.StartsWith(".") || Thumbnail.Contains(".") == false;
+            }
+        }
+
+        /// <summary>
+        /// Returns the icon file path if the icon is not a class, otherwise returns an empty string
+        /// </summary>
+        [DataMember(Name = "thumbnailFilePath")]
+        [ReadOnly(true)]
+        public string ThumbnailFilePath
+        {
+            get
+            {
+                return ThumbnailIsClass
+                           ? string.Empty
+                           : IOHelper.ResolveUrl("~/umbraco/images/thumbnails/" + Thumbnail);
             }
         }
 
diff --git a/src/Umbraco.Web/PropertyEditors/NestedContentConfiguration.cs b/src/Umbraco.Web/PropertyEditors/NestedContentConfiguration.cs
index 74c3f452e7..b904a2250d 100644
--- a/src/Umbraco.Web/PropertyEditors/NestedContentConfiguration.cs
+++ b/src/Umbraco.Web/PropertyEditors/NestedContentConfiguration.cs
@@ -1,6 +1,4 @@
 using Newtonsoft.Json;
-using System.IO;
-using Umbraco.Core.IO;
 using Umbraco.Core.PropertyEditors;
 
 namespace Umbraco.Web.PropertyEditors
@@ -38,19 +36,6 @@ namespace Umbraco.Web.PropertyEditors
 
             [JsonProperty("nameTemplate")]
             public string Template { get; set; }
-
-            [JsonProperty("thumbnail")]
-            public string Thumbnail
-            {
-                get
-                {
-                    var thumbsFolder = new DirectoryInfo(IOHelper.MapPath(SystemDirectories.Thumbnails));
-                    var files = Directory.GetFiles(thumbsFolder.FullName, $"{Alias}.*");
-
-                    return files.Length == 1 ?
-                        IOHelper.ResolveVirtualUrl($"{SystemDirectories.Thumbnails}/{Path.GetFileName(files[0])}") : null;
-                }
-            }
         }
     }
 }

From a6afa4bb36df12a697e7e841b079d73d444a7aab Mon Sep 17 00:00:00 2001
From: Shannon <sdeminick@gmail.com>
Date: Thu, 8 Aug 2019 19:48:10 +1000
Subject: [PATCH 34/46] one more revert

---
 src/Umbraco.Core/Persistence/Dtos/ContentTypeDto.cs | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/Umbraco.Core/Persistence/Dtos/ContentTypeDto.cs b/src/Umbraco.Core/Persistence/Dtos/ContentTypeDto.cs
index 609392fbee..e7a14a26e2 100644
--- a/src/Umbraco.Core/Persistence/Dtos/ContentTypeDto.cs
+++ b/src/Umbraco.Core/Persistence/Dtos/ContentTypeDto.cs
@@ -30,7 +30,6 @@ namespace Umbraco.Core.Persistence.Dtos
 
         [Column("thumbnail")]
         [Constraint(Default = "folder.png")]
-        [ResultColumn]
         public string Thumbnail { get; set; }
 
         [Column("description")]

From cce8017155aef0b0ae21062bbf588448e4fa2b56 Mon Sep 17 00:00:00 2001
From: Shannon <sdeminick@gmail.com>
Date: Fri, 9 Aug 2019 11:21:44 +1000
Subject: [PATCH 35/46] reverts whitespaces changes, grid changes, thumbnail
 changes

---
 .../components/umbnodepreview.directive.js    |  2 +-
 .../src/less/components/card.less             | 70 +------------------
 .../itempicker/itempicker.controller.js       |  4 --
 .../overlays/itempicker/itempicker.html       | 52 ++++----------
 .../propertyeditors/grid/grid.controller.js   |  7 --
 .../src/views/propertyeditors/grid/grid.html  |  7 +-
 .../nestedcontent/nestedcontent.controller.js |  8 ---
 7 files changed, 20 insertions(+), 130 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbnodepreview.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbnodepreview.directive.js
index 4fb7abea9f..9f1f7a0d2e 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbnodepreview.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbnodepreview.directive.js
@@ -100,7 +100,7 @@
 
         function link(scope, el, attr, ctrl) {
             if (!scope.editLabelKey) {
-                scope.editLabelKey = "general_edit"; 
+                scope.editLabelKey = "general_edit";
             }
             userService.getCurrentUser().then(function (u) {
                 var isAdmin = u.userGroups.indexOf('admin') !== -1;
diff --git a/src/Umbraco.Web.UI.Client/src/less/components/card.less b/src/Umbraco.Web.UI.Client/src/less/components/card.less
index ce6119c1d1..bf9957c6b0 100644
--- a/src/Umbraco.Web.UI.Client/src/less/components/card.less
+++ b/src/Umbraco.Web.UI.Client/src/less/components/card.less
@@ -8,15 +8,7 @@
     background: white;
     width: 100%;
 
-    .title {
-        padding: 12px;
-        color: @gray-3;
-        border-bottom: 1px solid @gray-8;
-        font-weight: 400;
-        font-size: 16px;
-        text-transform: none;
-        margin: 0 -10px 10px -10px;
-    }
+    .title{padding: 12px; color: @gray-3; border-bottom: 1px solid @gray-8; font-weight: 400; font-size: 16px; text-transform: none; margin: 0 -10px 10px -10px;}
 
 }
 
@@ -34,19 +26,8 @@
 }
 
 .umb-card-content {
-    .item-title {
-        color: @blackLight;
-        font-weight: 400;
-        border: none;
-        font-size: 16px;
-        text-transform: none;
-        margin-bottom: 3px;
-    }
-
-    p {
-        color: @gray-3;
-        margin-bottom: 1px;
-    }
+    .item-title{color: @blackLight; font-weight: 400; border: none; font-size: 16px; text-transform: none; margin-bottom: 3px;}
+    p{color: @gray-3; margin-bottom: 1px;}
 }
 
 .umb-card-actions {
@@ -152,51 +133,6 @@
     }
 }
 
-.umb-card-grid.-detailed {
-    .umb-card-grid-item {
-        padding-top: 0;
-
-        > div {
-            padding: 10px;
-            text-align: left;
-            font-size: 0;
-            overflow: hidden;
-        }
-    }
-
-    li {
-        flex: 0 0 auto;
-        max-width: 50%;
-        width: 50%;
-    }
-
-    .umb-card-grid-item--title {
-        font-size: 15px;
-        font-weight: 700;
-    }
-
-    .umb-card-grid-item--description {
-        font-size: 12px;
-        display: block;
-    }
-
-    .umb-card-grid-item--thumbnail,
-    i {
-        max-width: 120px;
-        margin-right: 10px;
-        float: left;
-        border-radius:3px;
-    }
-
-    i {
-        width: 120px;
-        height: 80px;
-        display: flex;
-        justify-content: center;
-        align-items: center;
-        font-size: 60px;
-    }
-}
 
 .umb-card-grid .umb-card-grid-item:hover,
 .umb-card-grid .umb-card-grid-item:focus {
diff --git a/src/Umbraco.Web.UI.Client/src/views/common/overlays/itempicker/itempicker.controller.js b/src/Umbraco.Web.UI.Client/src/views/common/overlays/itempicker/itempicker.controller.js
index 0eb8b8f099..967b68aee5 100644
--- a/src/Umbraco.Web.UI.Client/src/views/common/overlays/itempicker/itempicker.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/common/overlays/itempicker/itempicker.controller.js
@@ -14,10 +14,6 @@ function ItemPickerOverlay($scope, localizationService) {
         }
     }
 
-    $scope.hasThumbs = function () {
-        return $scope.model.availableItems.some(x => x.thumbnail);
-    };
-
     $scope.selectItem = function (item) {
         $scope.model.selectedItem = item;
         $scope.submitForm($scope.model);
diff --git a/src/Umbraco.Web.UI.Client/src/views/common/overlays/itempicker/itempicker.html b/src/Umbraco.Web.UI.Client/src/views/common/overlays/itempicker/itempicker.html
index 4d6b251ece..b16734cf47 100644
--- a/src/Umbraco.Web.UI.Client/src/views/common/overlays/itempicker/itempicker.html
+++ b/src/Umbraco.Web.UI.Client/src/views/common/overlays/itempicker/itempicker.html
@@ -1,30 +1,26 @@
 <div ng-controller="Umbraco.Overlays.ItemPickerOverlay" class="umb-itempicker">
 
-    <div class="form-search" 
-         ng-hide="model.filter === false" 
-         style="margin-bottom: 15px;">
+    <div class="form-search" ng-hide="model.filter === false" style="margin-bottom: 15px;">
         <i class="icon-search"></i>
-        
         <input type="text" 
                ng-model="searchTerm" 
                class="umb-search-field search-query input-block-level -full-width-input" 
-               localize="placeholder" placeholder="@placeholders_filter" 
-               umb-auto-focus no-dirty-check />
+               localize="placeholder"
+               placeholder="@placeholders_filter"
+               umb-auto-focus
+               no-dirty-check />
     </div>
 
     <div class="umb-overlay__section-header" ng-if="(model.pasteItems | filter:searchTerm).length > 0">
-        <h5>
-            <localize key="content_createFromClipboard">Paste from clipboard</localize>
-        </h5>
-        <button ng-if="model.clickClearPaste" 
-                ng-click="model.clickClearPaste($event)" 
-                alt="Clear clipboard for entries accepted in this context.">
+        <h5><localize key="content_createFromClipboard">Paste from clipboard</localize></h5>
+        <button ng-if="model.clickClearPaste" ng-click="model.clickClearPaste($event)" alt="Clear clipboard for entries accepted in this context.">
             <i class="icon-trash"></i>
         </button>
     </div>
 
     <ul class="umb-card-grid" ng-class="{'-three-in-row': model.availableItems.length < 7, '-four-in-row': model.availableItems.length >= 7}">
-        <li ng-repeat="pasteItem in model.pasteItems | filter:searchTerm" ng-click="model.clickPasteItem(pasteItem)">
+        <li ng-repeat="pasteItem in model.pasteItems | filter:searchTerm"
+            ng-click="model.clickPasteItem(pasteItem)">
             <a class="umb-card-grid-item" href="" title="{{ pasteItem.name }}">
                 <span>
                     <i class="{{ pasteItem.icon }}"></i>
@@ -35,37 +31,19 @@
     </ul>
 
     <div class="umb-overlay__section-header" ng-if="model.pasteItems.length > 0 && (model.availableItems | filter:searchTerm).length > 0">
-        <h5>
-            <localize key="content_createEmpty">Create new</localize>
-        </h5>
+        <h5><localize key="content_createEmpty">Create new</localize></h5>
     </div>
 
-
-    <ul class="umb-card-grid" ng-class="{'-three-in-row': model.availableItems.length < 7, '-four-in-row': model.availableItems.length >= 7, '-detailed': hasThumbs()}">
-        <li ng-repeat="availableItem in model.availableItems | compareArrays:model.selectedItems:'alias' | orderBy:model.orderBy | filter:searchTerm" ng-click="selectItem(availableItem)">
-            <a class="umb-card-grid-item" 
-               ng-class="{'-has-thumbnail': availableItem.thumbnail}" 
-               href="" 
-               title="{{ availableItem.name }}">
-                <span ng-if="!hasThumbs()">
+    <ul class="umb-card-grid" ng-class="{'-three-in-row': model.availableItems.length < 7, '-four-in-row': model.availableItems.length >= 7}">
+        <li ng-repeat="availableItem in model.availableItems | compareArrays:model.selectedItems:'alias' | orderBy:model.orderBy | filter:searchTerm"
+            ng-click="selectItem(availableItem)">
+            <a class="umb-card-grid-item" href="" title="{{ availableItem.name }}">
+                <span>
                     <i class="{{ availableItem.icon }}"></i>
                     {{ availableItem.name }}
                 </span>
-                <div ng-if="hasThumbs()" class="flex">
-                    <i ng-if="!availableItem.thumbnail" class="{{ availableItem.icon }}"></i>
-                    <img ng-if="availableItem.thumbnail" 
-                         class="umb-card-grid-item--thumbnail self-start" 
-                         ng-src="{{ availableItem.thumbnail }}?width=120px" />
-                    <div class="flex flex-column justify-center">
-                        <span class="umb-card-grid-item--title" ng-bind="availableItem.name"></span>
-                        <span ng-if="availableItem.description" 
-                              class="umb-card-grid-item--description" 
-                              ng-bind="availableItem.description"></span>
-                    </div>
-                </div>
             </a>
         </li>
     </ul>
 
-
 </div>
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.controller.js
index 5790a5764a..e5ad83e450 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.controller.js
@@ -307,29 +307,22 @@ angular.module("umbraco")
             $scope.openEditorOverlay = function (event, area, index, key) {
                 var title = "";
                 localizationService.localize("grid_insertControl").then(function (value) {
-                    if (area.$allowedEditors.length > 1) {
                         title = value;
                         $scope.editorOverlay = {
                             view: "itempicker", 
                             filter: area.$allowedEditors.length > 15,
                             title: title,
-                            size: area.$allowedEditors.some(x => x.thumbnail) ? 'large' : 'small',
                             availableItems: area.$allowedEditors,
                             event: event,
                             show: true,
                             submit: function (model) {
                                 if (model.selectedItem) {
-                                    console.log(model.selectedItem);
                                     $scope.addControl(model.selectedItem, area, index);
                                     $scope.editorOverlay.show = false;
                                     $scope.editorOverlay = null;
                                 }
                             }
                         };
-                    } else {
-                        console.log(area.$allowedEditors[0]);
-                        $scope.addControl(area.$allowedEditors[0], area, index);
-                    }
                 });
             };
 
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.html
index e3704713cb..6b739a9b86 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.html
@@ -226,11 +226,7 @@
 
                                                       <!-- if area is empty tools -->
                                                       <div class="umb-grid-add-more-content" ng-if="area.controls.length > 0 && !sortMode && (area.maxItems == undefined || area.maxItems == '' || area.maxItems == 0 || area.maxItems > area.controls.length)">
-                                                          <div class="cell-tools-add -bar newbtn" ng-click="openEditorOverlay($event, area, 0, area.$uniqueId);">
-                                                              <localize key="grid_addElement" ng-if="area.$allowedEditors.length > 1"></localize>
-                                                              <span ng-show="area.$allowedEditors.length === 1">
-                                                                  <localize key="general_add"></localize> {{ area.$allowedEditors[0].name }}</span>
-                                                          </div>
+                                                          <div class="cell-tools-add -bar newbtn" ng-click="openEditorOverlay($event, area, 0, area.$uniqueId);"><localize key="grid_addElement" /></div>
                                                       </div>
 
                                                  </div>
@@ -304,7 +300,6 @@
       ng-if="editorOverlay.show"
       model="editorOverlay"
       view="editorOverlay.view"
-      size="editorOverlay.size"
       position="target">
     </umb-overlay>
 
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/nestedcontent/nestedcontent.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/nestedcontent/nestedcontent.controller.js
index c3da4894ab..2fa9244076 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/nestedcontent/nestedcontent.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/nestedcontent/nestedcontent.controller.js
@@ -185,7 +185,6 @@ angular.module("umbraco").controller("Umbraco.PropertyEditors.NestedContent.Prop
                     alias: scaffold.contentTypeAlias,
                     name: scaffold.contentTypeName,
                     icon: iconHelper.convertFromLegacyIcon(scaffold.icon),
-                    thumbnail: scaffold.thumbnail,
                     description: scaffold.documentType.description
                 });
             });
@@ -194,11 +193,7 @@ angular.module("umbraco").controller("Umbraco.PropertyEditors.NestedContent.Prop
                 return;
             }
             
-            if ($scope.overlayMenu.availableItems.some(x => x.thumbnail)) {
-                $scope.overlayMenu.size = 'large';
-            } else {
                 $scope.overlayMenu.size = $scope.overlayMenu.availableItems.length > 6 ? "medium" : "small";            
-            }    
             
             $scope.overlayMenu.pasteItems = [];
             var availableNodesForPaste = clipboardService.retriveDataOfType("elementType", contentTypeAliases);
@@ -434,9 +429,6 @@ angular.module("umbraco").controller("Umbraco.PropertyEditors.NestedContent.Prop
                             });
                     }
 
-                    // pass the thumbnail on to the scaffold
-                    scaffold.thumbnail = contentType.thumbnail;
-                    
                     // Store the scaffold object
                     $scope.scaffolds.push(scaffold);
                 }

From 11d18a6446234d760de2846ac58d5bd952fcdcd0 Mon Sep 17 00:00:00 2001
From: Shannon <sdeminick@gmail.com>
Date: Fri, 9 Aug 2019 11:23:20 +1000
Subject: [PATCH 36/46] reverts whitespaces changes

---
 .../src/less/components/card.less             | 205 +++++++++---------
 1 file changed, 102 insertions(+), 103 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/less/components/card.less b/src/Umbraco.Web.UI.Client/src/less/components/card.less
index bf9957c6b0..8324698685 100644
--- a/src/Umbraco.Web.UI.Client/src/less/components/card.less
+++ b/src/Umbraco.Web.UI.Client/src/less/components/card.less
@@ -2,9 +2,9 @@
 	Library of card related compoents, like the right-hand icon list on the grid "cards"
 */
 
-.umb-card {
-    position: relative;
-    padding: 5px 10px 5px 10px;
+.umb-card{
+	position: relative;
+	padding: 5px 10px 5px 10px;
     background: white;
     width: 100%;
 
@@ -12,10 +12,10 @@
 
 }
 
-.umb-card-thumb {
+.umb-card-thumb{
     text-align: center;
 
-    i {
+    i{
         text-align: center;
         font-size: 20px;
         line-height: 40px;
@@ -25,51 +25,51 @@
     }
 }
 
-.umb-card-content {
+.umb-card-content{
     .item-title{color: @blackLight; font-weight: 400; border: none; font-size: 16px; text-transform: none; margin-bottom: 3px;}
     p{color: @gray-3; margin-bottom: 1px;}
 }
 
-.umb-card-actions {
+.umb-card-actions{
     padding-top: 10px;
     border-top: @gray-10 1px solid;
     clear: both;
 }
 
-.umb-card-icons {
-    text-align: center;
-    vertical-align: middle;
-    display: block;
-    list-style: none;
-    margin: 0;
-    padding: 0;
+.umb-card-icons{
+	text-align: center;
+	vertical-align: middle;
+	display: block;
+	list-style: none;
+	margin: 0;
+	padding: 0;
 }
 
-.umb-card-icons.vertical {
-    position: absolute;
-    top: 7px;
-    right: 7px;
-    text-align: right;
-    width: 1px;
+.umb-card-icons.vertical{
+	position: absolute;
+	top: 7px;
+	right: 7px;
+	text-align: right;
+	width: 1px;
 }
 
-.umb-card-icons li {
-    display: inline-block;
-    margin: 0 2px 0 2px;
+.umb-card-icons li{
+	display: inline-block;
+	margin: 0 2px 0 2px;
 }
 
-.umb-card-icons.vertical li {
-    float: right;
-    display: block;
-    margin-bottom: 3px;
+.umb-card-icons.vertical li{
+	float: right;
+	display: block;
+	margin-bottom: 3px;
 }
 
 //card iocn list
-.umb-card-list {
-    display: block;
-    padding: 0;
-    margin: 0;
-}
+.umb-card-list{
+     display: block;
+     padding: 0;
+     margin: 0;
+ }
 
 .umb-card-list li {
     border-bottom: @gray-10 1px solid;
@@ -81,23 +81,23 @@
 
 
 //Card icon grid for picking items off a card
-.umb-card-grid {
-    padding: 0;
-    margin: 0 auto;
-    list-style: none;
+.umb-card-grid{
+	padding: 0;
+	margin: 0 auto;
+	list-style: none;
     width: 100%;
-
-    display: flex;
-    flex-flow: row wrap;
-    justify-content: flex-start;
+    
+	display: flex;
+	flex-flow: row wrap;
+	justify-content: flex-start;
 }
 
 .umb-card-grid li {
-    overflow: hidden;
-    font-size: 12px;
-    text-align: center;
-    box-sizing: border-box;
-    position: relative;
+	overflow: hidden;
+	font-size: 12px;
+	text-align: center;
+	box-sizing: border-box;
+	position: relative;
     width: 100px;
 }
 
@@ -107,18 +107,19 @@
 }
 
 .umb-card-grid.-three-in-row li {
-    flex: 0 0 33.33%;
-    max-width: 33.33%;
+	flex: 0 0 33.33%;
+    max-width:33.33%;
 }
 
 .umb-card-grid .umb-card-grid-item {
     position: relative;
-    display: block;
-    width: 100%;
+	display: block;
+	width: 100%;
+	//height: 100%;
     padding-top: 100%;
-    border-radius: 3px;
+	border-radius: 3px;
     transition: background-color 120ms;
-
+    
     > span {
         position: absolute;
         top: 10px;
@@ -136,8 +137,8 @@
 
 .umb-card-grid .umb-card-grid-item:hover,
 .umb-card-grid .umb-card-grid-item:focus {
-    background-color: @ui-option-hover;
-    color: @ui-option-type-hover;
+	background-color: @ui-option-hover;
+	color: @ui-option-type-hover;
 }
 
 .umb-card-grid a {
@@ -152,82 +153,80 @@
     display: block;
 }
 
-.umb-card-grid .umb-card-grid-item__loading {
-    position: absolute;
-    background-color: rgba(255, 255, 255, 0.8);
-    top: 0;
-    right: 0;
-    bottom: 0;
-    left: 0;
-}
+ .umb-card-grid .umb-card-grid-item__loading {
+	 position: absolute;
+	 background-color: rgba(255,255,255,0.8);
+	 top: 0;
+	 right: 0;
+	 bottom: 0;
+	 left: 0;
+ }
 
 
 //Round icon-like button - this should be somewhere else
-.umb-btn-round {
-    padding: 4px 6px 4px 6px;
+.umb-btn-round{
+	padding: 4px 6px 4px 6px;
     display: inline-block;
     cursor: pointer;
     border-radius: 200px;
     background: @gray-10;
-    border: 1px solid @gray-6;
+    border:1px solid @gray-6;
     margin: 2px;
 }
 
-.umb-btn-round:hover,
-.umb-btn-round:hover * {
-    background: @blueDark  !important;
-    color: @white  !important;
-    border-color: @blueDark  !important;
-    text-decoration: none;
-}
+.umb-btn-round:hover, .umb-btn-round:hover *{
+  background: @blueDark !important;
+  color: @white !important;
+  border-color: @blueDark !important;
+  text-decoration:none;
+ }
 
-.umb-btn-round a:hover {
-    text-decoration: none;
-    color: @white  !important;
-}
+ .umb-btn-round a:hover {
+     text-decoration:none;
+     color: @white !important;
+ }
 
-.umb-btn-round i {
-    font-size: 16px !important;
-    color: @gray-8;
-    display: block;
-}
+ .umb-btn-round i {
+     font-size:16px !important;
+     color: @gray-8;
+     display:block;
+ }
 
-.umb-btn-round.alert:hover,
-.umb-btn-round.alert:hover * {
-    background: @red  !important;
-    color: @white  !important;
-    border-color: @red  !important;
-    text-decoration: none;
-}
+ .umb-btn-round.alert:hover, .umb-btn-round.alert:hover *{
+ 	background: @red !important;
+  	color: @white !important;
+  	border-color: @red !important;
+  	text-decoration:none;
+ }
 
-.umb-btn-round.no-border {
+.umb-btn-round.no-border{
     border: none !important;
     background: none !important;
 }
 
 .umb-training-videos {
-    display: grid;
-    grid-gap: 10px;
-    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
+	display: grid;
+	grid-gap: 10px;
+	grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
 }
 
 .umb-training-video {
-    background: @white;
-    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.16);
-    border-radius: @baseBorderRadius;
-    transition: box-shadow 0.1s ease-in-out, border 0.1s ease-in-out;
-    box-sizing: border-box;
-    padding: 20px;
+	background: @white;
+	box-shadow: 0 1px 1px 0 rgba(0,0,0,0.16);
+	border-radius: @baseBorderRadius;
+	transition: box-shadow 0.1s ease-in-out, border 0.1s ease-in-out;
+	box-sizing: border-box;
+	padding: 20px;
 }
 
 .umb-training-video:hover {
-    box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
-    text-decoration: none;
+	box-shadow: 0 3px 6px 0 rgba(0,0,0,0.16);
+	text-decoration: none;
 }
 
 .umb-training-video__label {
     font-weight: bold;
-    margin-top: 20px;
-    display: block;
-    text-align: center;
-}
\ No newline at end of file
+	margin-top: 20px;
+	display: block;
+	text-align: center;
+}

From f2908211dbc57949af25092aafb78058eb5e60af Mon Sep 17 00:00:00 2001
From: Shannon <sdeminick@gmail.com>
Date: Fri, 9 Aug 2019 11:24:30 +1000
Subject: [PATCH 37/46] reverts whitespaces changes

---
 .../views/common/overlays/itempicker/itempicker.controller.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/views/common/overlays/itempicker/itempicker.controller.js b/src/Umbraco.Web.UI.Client/src/views/common/overlays/itempicker/itempicker.controller.js
index 967b68aee5..74a677b7c6 100644
--- a/src/Umbraco.Web.UI.Client/src/views/common/overlays/itempicker/itempicker.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/common/overlays/itempicker/itempicker.controller.js
@@ -4,7 +4,7 @@ function ItemPickerOverlay($scope, localizationService) {
         $scope.model.hideSubmitButton = true;
 
         if (!$scope.model.title) {
-            localizationService.localize("defaultdialogs_selectItem").then(function (value) {
+            localizationService.localize("defaultdialogs_selectItem").then(function(value){
                 $scope.model.title = value;
             });
         }
@@ -14,7 +14,7 @@ function ItemPickerOverlay($scope, localizationService) {
         }
     }
 
-    $scope.selectItem = function (item) {
+    $scope.selectItem = function(item) {
         $scope.model.selectedItem = item;
         $scope.submitForm($scope.model);
     };

From 1c141f1f020e8ea13a2fb579a84c9a75e0fde5a4 Mon Sep 17 00:00:00 2001
From: Shannon <sdeminick@gmail.com>
Date: Fri, 9 Aug 2019 11:25:16 +1000
Subject: [PATCH 38/46] reverts whitespaces changes

---
 .../src/views/common/overlays/itempicker/itempicker.html    | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/views/common/overlays/itempicker/itempicker.html b/src/Umbraco.Web.UI.Client/src/views/common/overlays/itempicker/itempicker.html
index b16734cf47..a9f57fe304 100644
--- a/src/Umbraco.Web.UI.Client/src/views/common/overlays/itempicker/itempicker.html
+++ b/src/Umbraco.Web.UI.Client/src/views/common/overlays/itempicker/itempicker.html
@@ -2,9 +2,9 @@
 
     <div class="form-search" ng-hide="model.filter === false" style="margin-bottom: 15px;">
         <i class="icon-search"></i>
-        <input type="text" 
-               ng-model="searchTerm" 
-               class="umb-search-field search-query input-block-level -full-width-input" 
+        <input type="text"
+               ng-model="searchTerm"
+               class="umb-search-field search-query input-block-level -full-width-input"
                localize="placeholder"
                placeholder="@placeholders_filter"
                umb-auto-focus

From 5386fabf3c3ab9116b0514504b36c844e72fbcf2 Mon Sep 17 00:00:00 2001
From: Shannon <sdeminick@gmail.com>
Date: Fri, 9 Aug 2019 11:52:43 +1000
Subject: [PATCH 39/46] Removes refs to SimpleGrid, adds fixme and other notes

---
 .../blockeditor.html}                           |  0
 .../blockeditor.settings.controller.js          | 17 +++++++++++++++--
 .../blockeditor.simplelist.block.html           |  2 +-
 .../PropertyEditors/BlockEditorConfiguration.cs |  2 +-
 .../BlockEditorConfigurationEditor.cs           |  9 +++++++++
 .../BlockEditorPropertyEditor.cs                | 17 +++++++++++++++++
 .../PropertyEditors/SimpleGridConfiguration.cs  |  6 ------
 .../SimpleGridConfigurationEditor.cs            |  9 ---------
 .../PropertyEditors/SimpleGridPropertyEditor.cs | 17 -----------------
 src/Umbraco.Web/Umbraco.Web.csproj              |  5 ++---
 10 files changed, 45 insertions(+), 39 deletions(-)
 rename src/Umbraco.Web.UI.Client/src/views/propertyeditors/{simplegrid/simplegrid.html => blockeditor/blockeditor.html} (100%)
 create mode 100644 src/Umbraco.Web/PropertyEditors/BlockEditorConfigurationEditor.cs
 create mode 100644 src/Umbraco.Web/PropertyEditors/BlockEditorPropertyEditor.cs
 delete mode 100644 src/Umbraco.Web/PropertyEditors/SimpleGridConfiguration.cs
 delete mode 100644 src/Umbraco.Web/PropertyEditors/SimpleGridConfigurationEditor.cs
 delete mode 100644 src/Umbraco.Web/PropertyEditors/SimpleGridPropertyEditor.cs

diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/simplegrid/simplegrid.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
similarity index 100%
rename from src/Umbraco.Web.UI.Client/src/views/propertyeditors/simplegrid/simplegrid.html
rename to src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.controller.js
index a148d83fe7..2d4f11d3cf 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.settings.controller.js
@@ -1,4 +1,14 @@
-angular.module("umbraco")
+/**
+ * @ngdoc controller
+ * @name Umbraco.PropertyEditors.BlockEditor.SettingsController
+ * @function
+ *
+ * @description
+ * The controller for the block editor's data type configuration
+ */
+
+//fixme: Rename this! it shouldn't be called Settings, it should be called Configuration because that is what we call pre-values in v8 (data type config)
+angular.module("umbraco")
     .controller("Umbraco.PropertyEditors.BlockEditor.SettingsController", [
         "$scope",
         "contentTypeResource",
@@ -23,8 +33,9 @@
                 $scope.model.value = $scope.blocks;
             });
 
+            //fixme: This shouldn't be a method, using methods to return values in angular is a performance issue
             $scope.getBlockName = function(udi) {
-                return 'Get block name from somewhere...';
+                return 'TODO: Get block name from somewhere...';
             }
             
             $scope.addBlock = function () {
@@ -62,10 +73,12 @@
                 $scope.model.value.splice(index, 1);
             };
 
+            //fixme: This currently doesn't work or do anything
             $scope.editSettings = function (block) {
 
                 var pickerOptions = {
                     title: "Block settings",
+                    //fixme: This file needs to be renamed since it's inconsistent with other blockeditor file names, probably blockeditor.blocksettings.html
                     view: "views/propertyeditors/blockeditor/block.settings.html",
                     size: "small",                    
                     submit: function (model) {
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.simplelist.block.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.simplelist.block.html
index 47d621188f..544bd00edc 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.simplelist.block.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.simplelist.block.html
@@ -1,7 +1,7 @@
 <div class="umb-node-preview umb-node-preview--sortable">
     <i ng-if="block.icon" class="umb-node-preview__icon {{ block.icon }}"></i>
     <div class="umb-node-preview__content">        
-        <div class="umb-node-preview__name" ng-attr-title="{{block.alias}}">A name for block to identify it</div>
+        <div class="umb-node-preview__name" ng-attr-title="{{block.alias}}">TODO: Figure out how to name a block</div>
         <div class="umb-node-preview__description" ng-if="block.description">{{ block.description }}</div>
     </div>
     <div class="umb-node-preview__actions">
diff --git a/src/Umbraco.Web/PropertyEditors/BlockEditorConfiguration.cs b/src/Umbraco.Web/PropertyEditors/BlockEditorConfiguration.cs
index ed1c3ad8df..daef33eea9 100644
--- a/src/Umbraco.Web/PropertyEditors/BlockEditorConfiguration.cs
+++ b/src/Umbraco.Web/PropertyEditors/BlockEditorConfiguration.cs
@@ -4,7 +4,7 @@ using Umbraco.Core.PropertyEditors;
 
 namespace Umbraco.Web.PropertyEditors
 {
-    public abstract class BlockEditorConfiguration
+    public class BlockEditorConfiguration
     {
         [ConfigurationField("blocks", "Blocks", "views/propertyeditors/blockeditor/blockeditor.settings.html")]
         public Block[] Blocks { get; set; }
diff --git a/src/Umbraco.Web/PropertyEditors/BlockEditorConfigurationEditor.cs b/src/Umbraco.Web/PropertyEditors/BlockEditorConfigurationEditor.cs
new file mode 100644
index 0000000000..b46e52923b
--- /dev/null
+++ b/src/Umbraco.Web/PropertyEditors/BlockEditorConfigurationEditor.cs
@@ -0,0 +1,9 @@
+using Umbraco.Core.PropertyEditors;
+
+namespace Umbraco.Web.PropertyEditors
+{
+    public class BlockEditorConfigurationEditor : ConfigurationEditor<BlockEditorConfiguration>
+    {
+
+    }
+}
diff --git a/src/Umbraco.Web/PropertyEditors/BlockEditorPropertyEditor.cs b/src/Umbraco.Web/PropertyEditors/BlockEditorPropertyEditor.cs
new file mode 100644
index 0000000000..17c541e457
--- /dev/null
+++ b/src/Umbraco.Web/PropertyEditors/BlockEditorPropertyEditor.cs
@@ -0,0 +1,17 @@
+using Umbraco.Core.Logging;
+using Umbraco.Core.PropertyEditors;
+
+namespace Umbraco.Web.PropertyEditors
+{
+    [DataEditor("Umbraco.BlockEditor", EditorType.PropertyValue , "Block Editor", "blockeditor", ValueType = ValueTypes.Json, Group="rich content", Icon="icon-application-window-alt")]
+    public class BlockEditorPropertyEditor : DataEditor
+    {
+        public BlockEditorPropertyEditor(ILogger logger)
+            : base(logger)
+        { }
+
+        protected override IConfigurationEditor CreateConfigurationEditor() => new BlockEditorConfigurationEditor();
+
+        protected override IDataValueEditor CreateValueEditor() => base.CreateValueEditor();
+    }
+}
diff --git a/src/Umbraco.Web/PropertyEditors/SimpleGridConfiguration.cs b/src/Umbraco.Web/PropertyEditors/SimpleGridConfiguration.cs
deleted file mode 100644
index 8664c3b40c..0000000000
--- a/src/Umbraco.Web/PropertyEditors/SimpleGridConfiguration.cs
+++ /dev/null
@@ -1,6 +0,0 @@
-namespace Umbraco.Web.PropertyEditors
-{
-    public class SimpleGridConfiguration : BlockEditorConfiguration
-    {
-    }
-}
diff --git a/src/Umbraco.Web/PropertyEditors/SimpleGridConfigurationEditor.cs b/src/Umbraco.Web/PropertyEditors/SimpleGridConfigurationEditor.cs
deleted file mode 100644
index eaa054ff7e..0000000000
--- a/src/Umbraco.Web/PropertyEditors/SimpleGridConfigurationEditor.cs
+++ /dev/null
@@ -1,9 +0,0 @@
-using Umbraco.Core.PropertyEditors;
-
-namespace Umbraco.Web.PropertyEditors
-{
-    internal class SimpleGridConfigurationEditor : ConfigurationEditor<SimpleGridConfiguration>
-    {
-
-    }
-}
diff --git a/src/Umbraco.Web/PropertyEditors/SimpleGridPropertyEditor.cs b/src/Umbraco.Web/PropertyEditors/SimpleGridPropertyEditor.cs
deleted file mode 100644
index eb20a177ea..0000000000
--- a/src/Umbraco.Web/PropertyEditors/SimpleGridPropertyEditor.cs
+++ /dev/null
@@ -1,17 +0,0 @@
-using Umbraco.Core.Logging;
-using Umbraco.Core.PropertyEditors;
-
-namespace Umbraco.Web.PropertyEditors
-{
-    [DataEditor("Umbraco.SimpleGrid", EditorType.PropertyValue , "Simple Grid", "simplegrid", ValueType = ValueTypes.Json, Group="rich content", Icon="icon-application-window-alt")]
-    public class SimpleGridPropertyEditor : DataEditor
-    {
-        public SimpleGridPropertyEditor(ILogger logger)
-            : base(logger)
-        { }
-
-        protected override IConfigurationEditor CreateConfigurationEditor() => new SimpleGridConfigurationEditor();
-
-        protected override IDataValueEditor CreateValueEditor() => base.CreateValueEditor();
-    }
-}
diff --git a/src/Umbraco.Web/Umbraco.Web.csproj b/src/Umbraco.Web/Umbraco.Web.csproj
index 14c444c2ff..3ed07445bd 100755
--- a/src/Umbraco.Web/Umbraco.Web.csproj
+++ b/src/Umbraco.Web/Umbraco.Web.csproj
@@ -223,9 +223,8 @@
     <Compile Include="Mvc\ModelBindingExceptionFilter.cs" />
     <Compile Include="Mvc\SurfaceControllerTypeCollectionBuilder.cs" />
     <Compile Include="PropertyEditors\BlockEditorConfiguration.cs" />
-    <Compile Include="PropertyEditors\SimpleGridConfiguration.cs" />
-    <Compile Include="PropertyEditors\SimpleGridConfigurationEditor.cs" />
-    <Compile Include="PropertyEditors\SimpleGridPropertyEditor.cs" />
+    <Compile Include="PropertyEditors\BlockEditorConfigurationEditor.cs" />
+    <Compile Include="PropertyEditors\BlockEditorPropertyEditor.cs" />
     <Compile Include="Mvc\ValidateUmbracoFormRouteStringAttribute.cs" />
     <Compile Include="Profiling\WebProfilingController.cs" />
     <Compile Include="PublishedCache\NuCache\PublishedSnapshotServiceOptions.cs" />

From 22eef489e0c96fce1cdeaba2d89ad7fe37d1a584 Mon Sep 17 00:00:00 2001
From: Shannon <sdeminick@gmail.com>
Date: Fri, 9 Aug 2019 12:05:19 +1000
Subject: [PATCH 40/46] Moves and renames angular files to where they are
 supposed to be

---
 .../umbblockeditor.directive.controller.js}   |   0
 .../blockeditor/umbblockeditor.directive.js   | 235 ++++++++++++++++++
 .../umbblockeditorblock.directive.js          |   3 +-
 .../components/umbblockeditor.directive.js    |  15 --
 .../blockeditor/umb-blockeditor.html}         |   0
 5 files changed, 237 insertions(+), 16 deletions(-)
 rename src/Umbraco.Web.UI.Client/src/{views/propertyeditors/blockeditor/blockeditor.directive.controller.js => common/directives/components/blockeditor/umbblockeditor.directive.controller.js} (100%)
 create mode 100644 src/Umbraco.Web.UI.Client/src/common/directives/components/blockeditor/umbblockeditor.directive.js
 rename src/Umbraco.Web.UI.Client/src/common/directives/components/{ => blockeditor}/umbblockeditorblock.directive.js (68%)
 delete mode 100644 src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditor.directive.js
 rename src/Umbraco.Web.UI.Client/src/views/{propertyeditors/blockeditor/blockeditor.directive.html => components/blockeditor/umb-blockeditor.html} (100%)

diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.directive.controller.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/blockeditor/umbblockeditor.directive.controller.js
similarity index 100%
rename from src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.directive.controller.js
rename to src/Umbraco.Web.UI.Client/src/common/directives/components/blockeditor/umbblockeditor.directive.controller.js
diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/blockeditor/umbblockeditor.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/blockeditor/umbblockeditor.directive.js
new file mode 100644
index 0000000000..5a7e6193f8
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/blockeditor/umbblockeditor.directive.js
@@ -0,0 +1,235 @@
+//fixme: this needs to be component not a directive
+angular.module("umbraco.directives").directive('umbBlockEditor', [
+    function () {
+        return {
+            restrict: "E", 
+            templateUrl: "views/components/blockeditor/umb-blockeditor.html",
+            scope: {
+                config: "=",
+                view: "@",
+                blocks: "="
+            },
+            controller: function ($scope, contentResource, editorService, iconHelper, clipboardService) {
+                var vm = this;
+
+                vm.scaffolds = [];
+                vm.loading = true;
+
+                let allowedElements = [];
+
+                // it would be awesome if we could load all scaffolds in one go... however we need to have an eye out for performance,
+                // oddly enough it's been shown to actually be slower to load them all at once instead of one at a time
+                var scaffoldsLoaded = 0;
+
+                function init() {
+                    if (!$scope.blocks) {
+                        $scope.blocks = [];
+                    }
+
+                    _.each($scope.config, function (config) {
+                        contentResource.getScaffoldByUdi(-20, config.elementType).then(function (scaffold) {
+                            if (scaffold.isElement) {
+                                // the scaffold udi is not the same as the element type udi, but we need it to be for comparison
+                                scaffold.udi = config.elementType;
+                                // shift this up to be consistent with other entities
+                                scaffold.thumbnail = scaffold.documentType.thumbnail;
+                                vm.scaffolds.push(scaffold);
+                            }
+                            scaffoldsLoaded++;
+                            initIfAllScaffoldsHaveLoaded();
+                        }, function (error) {
+                            scaffoldsLoaded++;
+                            initIfAllScaffoldsHaveLoaded();
+                        });
+                    });
+                }
+
+                function initIfAllScaffoldsHaveLoaded() {
+                    // Initialize when all scaffolds have loaded
+                    if ($scope.config.length === scaffoldsLoaded) {
+                        vm.scaffolds = _.sortBy(vm.scaffolds, function (scaffold) {
+                            return _.findIndex($scope.config, function (blockConfig) {
+                                return blockConfig.elementType === scaffold.udi;
+                            });
+                        });
+
+                        _.each($scope.blocks, function (block) {
+                            applyFakeSettings(block);
+                        });
+
+                        allowedElements = vm.scaffolds.map(x => x.contentTypeAlias);
+
+                        vm.loading = false;
+                    }
+                }
+
+
+                vm.openNodeTypePicker = function ($event) {
+
+                    vm.overlayMenu = {
+                        show: false,
+                        style: {},
+                        filter: vm.scaffolds.length > 12 ? true : false,
+                        orderBy: "$index",
+                        view: "itempicker",
+                        event: $event,
+                        clickPasteItem: function (item) {
+                            vm.pasteFromClipboard(item.data);
+                            vm.overlayMenu.show = false;
+                            vm.overlayMenu = null;
+                        },
+                        submit: function (model) {
+                            if (model && model.selectedItem) {
+                                vm.add(vm.scaffolds.filter(x => x.contentTypeAlias === model.selectedItem.alias)[0]);
+                            }
+                            vm.overlayMenu.show = false;
+                            vm.overlayMenu = null;
+                        },
+                        close: function () {
+                            vm.overlayMenu.show = false;
+                            vm.overlayMenu = null;
+                        }
+                    };
+
+                    // this could be used for future limiting on node types
+                    vm.overlayMenu.availableItems = [];
+                    vm.scaffolds.forEach(function (scaffold) {
+                        vm.overlayMenu.availableItems.push({
+                            alias: scaffold.contentTypeAlias,
+                            name: scaffold.contentTypeName,
+                            icon: iconHelper.convertFromLegacyIcon(scaffold.icon),
+                            thumbnail: scaffold.thumbnail,
+                            description: scaffold.documentType.description
+                        });
+                    });
+
+                    if (vm.overlayMenu.availableItems.length === 0) {
+                        return;
+                    }
+
+                    if (vm.overlayMenu.availableItems.some(x => x.thumbnail)) {
+                        vm.overlayMenu.size = 'large';
+                    } else {
+                        vm.overlayMenu.size = vm.overlayMenu.availableItems.length > 6 ? "medium" : "small";
+                    }
+
+                    vm.overlayMenu.pasteItems = [];
+                    var availableNodesForPaste = clipboardService.retriveDataOfType("elementType", allowedElements);
+                    availableNodesForPaste.forEach(function (node) {
+                        vm.overlayMenu.pasteItems.push({
+                            alias: node.contentTypeAlias,
+                            name: node.name, //contentTypeName
+                            data: node,
+                            icon: iconHelper.convertFromLegacyIcon(node.icon)
+                        });
+                    });
+
+                    vm.overlayMenu.clickClearPaste = function ($event) {
+                        $event.stopPropagation();
+                        $event.preventDefault();
+                        clipboardService.clearEntriesOfType("elementType", allowedElements);
+                        vm.overlayMenu.pasteItems = []; // This dialog is not connected via the clipboardService events, so we need to update manually.
+                    };
+
+                    if (vm.overlayMenu.availableItems.length === 1 && vm.overlayMenu.pasteItems.length === 0) {
+                        // only one scaffold type - no need to display the picker
+                        vm.add(vm.scaffolds[0]);
+                        return;
+                    }
+
+                    vm.overlayMenu.show = true;
+                }
+
+                vm.add = function (scaffold) {
+                    var element = angular.copy(scaffold);
+                    var block = {
+                        udi: element.udi,
+                        icon: element.icon,
+                        description: element.documentType.description, // probably don't want to persist these.
+                        content: {},
+                        settings: {
+                            view: 'views/propertyeditors/blockeditor/blockeditor.block.html'
+                        }
+                    };
+                    vm.openContent(element, block);
+                }
+
+                vm.editContent = function (block) {
+                    var scaffold = _.findWhere(vm.scaffolds, {
+                        udi: block.udi
+                    });
+                    var element = angular.copy(scaffold);
+                    _.each(element.variants[0].tabs, function (tab) {
+                        _.each(tab.properties, function (property) {
+                            if (block.content[property.alias]) {
+                                property.value = block.content[property.alias];
+                            }
+                        });
+                    });
+
+                    vm.openContent(element, block);
+                }
+
+                vm.openContent = function (element, block) {
+                    var options = {
+                        element: element,
+                        title: 'Edit block',
+                        view: "views/propertyeditors/blockeditor/blockeditor.editcontent.html",
+                        submit: function (model) {
+                            _.each(element.variants[0].tabs, function (tab) {
+                                _.each(tab.properties, function (property) {
+                                    block.content[property.alias] = property.value;
+                                });
+                            });
+                            if ($scope.blocks.indexOf(block) < 0) {
+                                $scope.blocks.push(block);
+                                applyFakeSettings(block);
+                            }
+
+                            editorService.close();
+                        },
+                        close: function () {
+                            editorService.close();
+                        }
+                    };
+                    editorService.open(options);
+                }
+
+                vm.editSettings = function (block) {
+                    var options = {
+                        settings: block.settings,
+                        title: "Edit settings",
+                        view: "views/propertyeditors/blockeditor/blockeditor.editsettings.html",
+                        size: "small",
+                        submit: function (model) {
+                            editorService.close();
+                        },
+                        close: function () {
+                            editorService.close();
+                        }
+                    };
+                    editorService.open(options);
+                }
+
+                vm.remove = function (block) {
+                    // this should be replaced by a custom dialog (pending some PRs)
+                    if (confirm("TODO: Are you sure?")) {
+                        $scope.blocks.splice($scope.blocks.indexOf(block), 1);
+                    }
+                }
+
+                // TODO: remove this (only for testing)
+                // currently pushes random values for setting a css grid location
+                function applyFakeSettings(block) {
+                    block.settings["col"] = 1 + Math.floor(Math.random() * 7);
+                    block.settings["row"] = 1 + Math.floor(Math.random() * 7);
+                    block.settings["w"] = 1 + Math.floor(Math.random() * 3);
+                    block.settings["h"] = 1 + Math.floor(Math.random() * 3);
+                }
+
+                init();
+            },
+            controllerAs: "vm"
+        };
+    } 
+]); 
diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblock.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/blockeditor/umbblockeditorblock.directive.js
similarity index 68%
rename from src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblock.directive.js
rename to src/Umbraco.Web.UI.Client/src/common/directives/components/blockeditor/umbblockeditorblock.directive.js
index 3916468e6e..4a29fd7ea7 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditorblock.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/blockeditor/umbblockeditorblock.directive.js
@@ -1,4 +1,5 @@
-angular.module("umbraco.directives").directive('umbBlockEditorBlock', [
+//fixme: this needs to be component not a directive
+angular.module("umbraco.directives").directive('umbBlockEditorBlock', [
     function () {
         var link = function (scope, el, attr, ctrl) {
             scope.view = scope.block.view || attr.view;
diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditor.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditor.directive.js
deleted file mode 100644
index fae2d1ced0..0000000000
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbblockeditor.directive.js
+++ /dev/null
@@ -1,15 +0,0 @@
-angular.module("umbraco.directives").directive('umbBlockEditor', [
-    function () {
-        return {
-            restrict: "E", 
-            templateUrl: "views/propertyeditors/blockeditor/blockeditor.directive.html",
-            scope: {
-                config: "=",
-                view: "@",
-                blocks: "="
-            },
-            controller: "Umbraco.PropertyEditors.BlockEditor.DirectiveController",
-            controllerAs: "vm"
-        };
-    } 
-]); 
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.directive.html b/src/Umbraco.Web.UI.Client/src/views/components/blockeditor/umb-blockeditor.html
similarity index 100%
rename from src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.directive.html
rename to src/Umbraco.Web.UI.Client/src/views/components/blockeditor/umb-blockeditor.html

From 277d5968a61ecc6b0e89dd8546b26dd8ebc7109f Mon Sep 17 00:00:00 2001
From: Shannon <sdeminick@gmail.com>
Date: Fri, 9 Aug 2019 12:06:55 +1000
Subject: [PATCH 41/46] adds the constant back

---
 src/Umbraco.Core/Constants-PropertyEditors.cs    | 5 +++++
 src/Umbraco.Web.UI/config/umbracoSettings.config | 2 +-
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/Umbraco.Core/Constants-PropertyEditors.cs b/src/Umbraco.Core/Constants-PropertyEditors.cs
index 0b5d2873f9..cc461a5775 100644
--- a/src/Umbraco.Core/Constants-PropertyEditors.cs
+++ b/src/Umbraco.Core/Constants-PropertyEditors.cs
@@ -36,6 +36,11 @@ namespace Umbraco.Core
             /// </summary>
             public static class Aliases
             {
+                /// <summary>
+                /// Block Editor.
+                /// </summary>
+                public const string BlockEditor = "Umbraco.BlockEditor";
+
                 /// <summary>
                 /// CheckBox List.
                 /// </summary>
diff --git a/src/Umbraco.Web.UI/config/umbracoSettings.config b/src/Umbraco.Web.UI/config/umbracoSettings.config
index f647e1ae1e..b97d44d8cc 100644
--- a/src/Umbraco.Web.UI/config/umbracoSettings.config
+++ b/src/Umbraco.Web.UI/config/umbracoSettings.config
@@ -60,7 +60,7 @@
 
   <security>
     <!-- set to true to auto update login interval (and there by disabling the lock screen -->
-    <keepUserLoggedIn>false</keepUserLoggedIn>
+    <keepUserLoggedIn>true</keepUserLoggedIn>
     <!-- by default this is true and if not specified in config will be true. set to false to always show a separate username field in the back office user editor -->
     <usernameIsEmail>true</usernameIsEmail>
     <!-- change in 4.8: Disabled users are now showed dimmed and last in the tree. If you prefer not to display them set this to true -->

From 47a47292e822dc7fdd14cf5bf2d0a90951de6d69 Mon Sep 17 00:00:00 2001
From: Shannon <sdeminick@gmail.com>
Date: Fri, 9 Aug 2019 12:08:41 +1000
Subject: [PATCH 42/46] adds the constant back

---
 .../umbblockeditor.directive.controller.js    | 221 ------------------
 .../BlockEditorPropertyEditor.cs              |   5 +-
 2 files changed, 3 insertions(+), 223 deletions(-)
 delete mode 100644 src/Umbraco.Web.UI.Client/src/common/directives/components/blockeditor/umbblockeditor.directive.controller.js

diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/blockeditor/umbblockeditor.directive.controller.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/blockeditor/umbblockeditor.directive.controller.js
deleted file mode 100644
index 9022e16a2c..0000000000
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/blockeditor/umbblockeditor.directive.controller.js
+++ /dev/null
@@ -1,221 +0,0 @@
-function BlockEditorDirectiveController($scope, contentResource, editorService, iconHelper, clipboardService) {  
-    var vm = this;
-
-    vm.scaffolds = []; 
-    vm.loading = true;
-
-    let allowedElements = []; 
-     
-    // it would be awesome if we could load all scaffolds in one go... however we need to have an eye out for performance,
-    // oddly enough it's been shown to actually be slower to load them all at once instead of one at a time
-    var scaffoldsLoaded = 0;
- 
-    function init() {
-        if (!$scope.blocks) {
-            $scope.blocks = [];
-        }
-
-        _.each($scope.config, function (config) {
-            contentResource.getScaffoldByUdi(-20, config.elementType).then(function (scaffold) {
-                if (scaffold.isElement) {
-                    // the scaffold udi is not the same as the element type udi, but we need it to be for comparison
-                    scaffold.udi = config.elementType;
-                    // shift this up to be consistent with other entities
-                    scaffold.thumbnail = scaffold.documentType.thumbnail;
-                    vm.scaffolds.push(scaffold);
-                }
-                scaffoldsLoaded++;
-                initIfAllScaffoldsHaveLoaded();
-            }, function (error) {
-                scaffoldsLoaded++;
-                initIfAllScaffoldsHaveLoaded();
-            });
-        });
-    }
-
-    function initIfAllScaffoldsHaveLoaded() { 
-        // Initialize when all scaffolds have loaded
-        if ($scope.config.length === scaffoldsLoaded) {
-            vm.scaffolds = _.sortBy(vm.scaffolds, function (scaffold) {
-                return _.findIndex($scope.config, function (blockConfig) {
-                    return blockConfig.elementType === scaffold.udi;
-                });
-            });
-
-            _.each($scope.blocks, function (block) {
-                applyFakeSettings(block);
-            });
-            
-            allowedElements = vm.scaffolds.map(x => x.contentTypeAlias);
-            
-            vm.loading = false;
-        }
-    }
-
-    
-    vm.openNodeTypePicker = function($event) {
-        
-        vm.overlayMenu = {
-            show: false,
-            style: {},
-            filter: vm.scaffolds.length > 12 ? true : false,
-            orderBy: "$index",
-            view: "itempicker",
-            event: $event,
-            clickPasteItem: function (item) {
-                vm.pasteFromClipboard(item.data);
-                vm.overlayMenu.show = false;
-                vm.overlayMenu = null;
-            },
-            submit: function (model) {
-                if (model && model.selectedItem) {                    
-                    vm.add(vm.scaffolds.filter(x => x.contentTypeAlias === model.selectedItem.alias)[0]);
-                }
-                vm.overlayMenu.show = false;
-                vm.overlayMenu = null; 
-            },
-            close: function () {
-                vm.overlayMenu.show = false;
-                vm.overlayMenu = null;
-            }
-        };
-
-        // this could be used for future limiting on node types
-        vm.overlayMenu.availableItems = [];
-        vm.scaffolds.forEach(function (scaffold) {
-            vm.overlayMenu.availableItems.push({
-                alias: scaffold.contentTypeAlias,
-                name: scaffold.contentTypeName,
-                icon: iconHelper.convertFromLegacyIcon(scaffold.icon),
-                thumbnail: scaffold.thumbnail,
-                description: scaffold.documentType.description
-            });
-        });
-
-        if (vm.overlayMenu.availableItems.length === 0) {
-            return;
-        }
-
-        if (vm.overlayMenu.availableItems.some(x => x.thumbnail)) {
-            vm.overlayMenu.size = 'large';
-        } else {
-            vm.overlayMenu.size = vm.overlayMenu.availableItems.length > 6 ? "medium" : "small";
-        }
-
-        vm.overlayMenu.pasteItems = [];
-        var availableNodesForPaste = clipboardService.retriveDataOfType("elementType", allowedElements);
-        availableNodesForPaste.forEach(function (node) {
-            vm.overlayMenu.pasteItems.push({
-                alias: node.contentTypeAlias,
-                name: node.name, //contentTypeName
-                data: node,
-                icon: iconHelper.convertFromLegacyIcon(node.icon)
-            });
-        });
-
-        vm.overlayMenu.clickClearPaste = function ($event) {
-            $event.stopPropagation();
-            $event.preventDefault();
-            clipboardService.clearEntriesOfType("elementType", allowedElements);
-            vm.overlayMenu.pasteItems = []; // This dialog is not connected via the clipboardService events, so we need to update manually.
-        };
-
-        if (vm.overlayMenu.availableItems.length === 1 && vm.overlayMenu.pasteItems.length === 0) {
-            // only one scaffold type - no need to display the picker
-            vm.add(vm.scaffolds[0]);
-            return;
-        }
-
-        vm.overlayMenu.show = true;
-    } 
-    
-     vm.add = function(scaffold) {
-        var element = angular.copy(scaffold);
-        var block = {
-            udi: element.udi,
-            icon: element.icon, 
-            description: element.documentType.description, // probably don't want to persist these.
-            content: {},
-            settings: {
-                view: 'views/propertyeditors/blockeditor/blockeditor.block.html'
-            }  
-        };
-        vm.openContent(element, block);
-    }
-
-    vm.editContent = function(block) {
-        var scaffold = _.findWhere(vm.scaffolds, {
-            udi: block.udi 
-        });
-        var element = angular.copy(scaffold);
-        _.each(element.variants[0].tabs, function (tab) {
-            _.each(tab.properties, function (property) {
-                if (block.content[property.alias]) {
-                    property.value = block.content[property.alias];
-                }
-            });
-        });
-
-        vm.openContent(element, block);
-    }
-
-    vm.openContent = function(element, block) {
-        var options = {
-            element: element,
-            title: 'Edit block',
-            view: "views/propertyeditors/blockeditor/blockeditor.editcontent.html",
-            submit: function (model) {
-                _.each(element.variants[0].tabs, function (tab) {
-                    _.each(tab.properties, function (property) {
-                        block.content[property.alias] = property.value;
-                    });
-                });
-                if ($scope.blocks.indexOf(block) < 0) {
-                    $scope.blocks.push(block);
-                    applyFakeSettings(block);
-                }
-                
-                editorService.close();
-            },
-            close: function () {
-                editorService.close();
-            }
-        };
-        editorService.open(options);
-    }
-
-    vm.editSettings = function(block) {
-        var options = {
-            settings: block.settings,
-            title: "Edit settings",
-            view: "views/propertyeditors/blockeditor/blockeditor.editsettings.html",
-            size: "small",
-            submit: function(model) {
-                editorService.close();
-            },
-            close: function () {
-                editorService.close();
-            }
-        };
-        editorService.open(options);
-    }
-
-    vm.remove = function(block) {
-        // this should be replaced by a custom dialog (pending some PRs)
-        if (confirm("TODO: Are you sure?")) {
-            $scope.blocks.splice($scope.blocks.indexOf(block), 1);
-        }
-    }
-    
-        // TODO: remove this (only for testing)
-    // currently pushes random values for setting a css grid location
-    function applyFakeSettings(block) {
-        block.settings["col"] = 1 + Math.floor(Math.random() * 7);
-        block.settings["row"] = 1 + Math.floor(Math.random() * 7);
-        block.settings["w"] = 1 + Math.floor(Math.random() * 3);
-        block.settings["h"] = 1 + Math.floor(Math.random() * 3);
-    }
-    
-    init();
-}
-angular.module("umbraco").controller("Umbraco.PropertyEditors.BlockEditor.DirectiveController", ['$scope', 'contentResource', 'editorService', 'iconHelper', 'clipboardService', BlockEditorDirectiveController]);
diff --git a/src/Umbraco.Web/PropertyEditors/BlockEditorPropertyEditor.cs b/src/Umbraco.Web/PropertyEditors/BlockEditorPropertyEditor.cs
index 17c541e457..f486af4c3d 100644
--- a/src/Umbraco.Web/PropertyEditors/BlockEditorPropertyEditor.cs
+++ b/src/Umbraco.Web/PropertyEditors/BlockEditorPropertyEditor.cs
@@ -1,9 +1,10 @@
-using Umbraco.Core.Logging;
+using Umbraco.Core;
+using Umbraco.Core.Logging;
 using Umbraco.Core.PropertyEditors;
 
 namespace Umbraco.Web.PropertyEditors
 {
-    [DataEditor("Umbraco.BlockEditor", EditorType.PropertyValue , "Block Editor", "blockeditor", ValueType = ValueTypes.Json, Group="rich content", Icon="icon-application-window-alt")]
+    [DataEditor(Constants.PropertyEditors.Aliases.BlockEditor, EditorType.PropertyValue , "Block Editor", "blockeditor", ValueType = ValueTypes.Json, Group="rich content", Icon="icon-application-window-alt")]
     public class BlockEditorPropertyEditor : DataEditor
     {
         public BlockEditorPropertyEditor(ILogger logger)

From e940f6dfdc166084a30b95e3d209ed83010cce70 Mon Sep 17 00:00:00 2001
From: Shannon <sdeminick@gmail.com>
Date: Fri, 9 Aug 2019 12:43:21 +1000
Subject: [PATCH 43/46] adds notes, starting to remove directives since these
 don't make sense in this context

---
 .../blockeditor/umbblockeditor.directive.js         |  2 ++
 .../blockeditor/umbblockeditorblock.directive.js    | 13 -------------
 .../blockeditor.editcontent.controller.js           | 11 ++++++++++-
 .../blockeditor.editsettings.controller.js          | 12 +++++++++++-
 .../propertyeditors/blockeditor/blockeditor.html    |  5 ++++-
 .../blockeditor/blockeditor.simplelist.block.html   | 12 ------------
 .../blockeditor/blockeditor.simplelist.html         | 13 ++++++++++++-
 7 files changed, 39 insertions(+), 29 deletions(-)
 delete mode 100644 src/Umbraco.Web.UI.Client/src/common/directives/components/blockeditor/umbblockeditorblock.directive.js
 delete mode 100644 src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.simplelist.block.html

diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/blockeditor/umbblockeditor.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/blockeditor/umbblockeditor.directive.js
index 5a7e6193f8..9549b05036 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/blockeditor/umbblockeditor.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/blockeditor/umbblockeditor.directive.js
@@ -174,6 +174,7 @@ angular.module("umbraco.directives").directive('umbBlockEditor', [
                     var options = {
                         element: element,
                         title: 'Edit block',
+                        //fixme: This isn't really a component if its strongly tied to views in the property editor :/
                         view: "views/propertyeditors/blockeditor/blockeditor.editcontent.html",
                         submit: function (model) {
                             _.each(element.variants[0].tabs, function (tab) {
@@ -199,6 +200,7 @@ angular.module("umbraco.directives").directive('umbBlockEditor', [
                     var options = {
                         settings: block.settings,
                         title: "Edit settings",
+                        //fixme: This isn't really a component if its strongly tied to views in the property editor :/
                         view: "views/propertyeditors/blockeditor/blockeditor.editsettings.html",
                         size: "small",
                         submit: function (model) {
diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/blockeditor/umbblockeditorblock.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/blockeditor/umbblockeditorblock.directive.js
deleted file mode 100644
index 4a29fd7ea7..0000000000
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/blockeditor/umbblockeditorblock.directive.js
+++ /dev/null
@@ -1,13 +0,0 @@
-//fixme: this needs to be component not a directive
-angular.module("umbraco.directives").directive('umbBlockEditorBlock', [
-    function () {
-        var link = function (scope, el, attr, ctrl) {
-            scope.view = scope.block.view || attr.view;
-        };
-        return {
-            restrict: "E",
-            template: "<div ng-include='view'></div>",
-            link: link
-        };
-    }
-]);
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editcontent.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editcontent.controller.js
index f05799b398..73eb392162 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editcontent.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editcontent.controller.js
@@ -1,4 +1,13 @@
-function BlockEditorEditContentController($scope) {
+/**
+ * @ngdoc controller
+ * @name Umbraco.PropertyEditors.BlockEditor.EditContentController
+ * @function
+ *
+ * @description
+ * The controller for editing content with the block editor
+ */
+
+function BlockEditorEditContentController($scope) {
     var vm = this;
     vm.submit = submit;
     vm.close = close;
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editsettings.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editsettings.controller.js
index c0a91ce5c9..bb375d558b 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editsettings.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.editsettings.controller.js
@@ -1,4 +1,14 @@
-function BlockEditorEditSettingsController($scope) {
+/**
+ * @ngdoc controller
+ * @name Umbraco.PropertyEditors.BlockEditor.EditSettingsController
+ * @function
+ *
+ * @description
+ * The controller for editing the configuration of an individual block
+ */
+
+//fixme: Need to figure out the name of a block settings, is it block config or block settings?
+function BlockEditorEditSettingsController($scope) {
 
     this.submit = () => {
         if($scope.model.submit) {
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
index ea0f004006..bcaab4998f 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
@@ -1 +1,4 @@
-<umb-block-editor blocks="model.value" config="model.config.blocks" view="views/propertyeditors/blockeditor/blockeditor.simplelist.html"></umb-block-editor>
+<umb-block-editor blocks="model.value"
+                  config="model.config.blocks"
+                  view="views/propertyeditors/blockeditor/blockeditor.simplelist.html">
+</umb-block-editor>
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.simplelist.block.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.simplelist.block.html
deleted file mode 100644
index 544bd00edc..0000000000
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.simplelist.block.html
+++ /dev/null
@@ -1,12 +0,0 @@
-<div class="umb-node-preview umb-node-preview--sortable">
-    <i ng-if="block.icon" class="umb-node-preview__icon {{ block.icon }}"></i>
-    <div class="umb-node-preview__content">        
-        <div class="umb-node-preview__name" ng-attr-title="{{block.alias}}">TODO: Figure out how to name a block</div>
-        <div class="umb-node-preview__description" ng-if="block.description">{{ block.description }}</div>
-    </div>
-    <div class="umb-node-preview__actions">
-        <a class="umb-node-preview__action" title="Edit" href="" ng-click="vm.editContent(block)"><localize key="general_edit">Edit</localize></a>
-        <a class="umb-node-preview__action" title="Settings" href="" ng-click="vm.editSettings(block)"><localize key="general_settings">Settings</localize></a>
-        <a class="umb-node-preview__action umb-node-preview__action--red" title="Remove" ng-href="" ng-click="vm.remove(block)"><localize key="general_remove">Remove</localize></a>
-    </div>
-</div> 
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.simplelist.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.simplelist.html
index 2e36a68dac..bb711683d0 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.simplelist.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.simplelist.html
@@ -2,7 +2,18 @@
     <ul class="unstyled" ui-sortable="sortableOptions" ng-model="blocks">
         <li ng-repeat="block in blocks">
             <div class="handle">
-                <umb-block-editor-block view="views/propertyeditors/blockeditor/blockeditor.simplelist.block.html"></umb-block-editor-block>
+                <div class="umb-node-preview umb-node-preview--sortable">
+                    <i ng-if="block.icon" class="umb-node-preview__icon {{ block.icon }}"></i>
+                    <div class="umb-node-preview__content">
+                        <div class="umb-node-preview__name" ng-attr-title="{{block.alias}}">TODO: Figure out how to name a block</div>
+                        <div class="umb-node-preview__description" ng-if="block.description">{{ block.description }}</div>
+                    </div>
+                    <div class="umb-node-preview__actions">
+                        <a class="umb-node-preview__action" title="Edit" href="" ng-click="vm.editContent(block)"><localize key="general_edit">Edit</localize></a>
+                        <a class="umb-node-preview__action" title="Settings" href="" ng-click="vm.editSettings(block)"><localize key="general_settings">Settings</localize></a>
+                        <a class="umb-node-preview__action umb-node-preview__action--red" title="Remove" ng-href="" ng-click="vm.remove(block)"><localize key="general_remove">Remove</localize></a>
+                    </div>
+                </div>
             </div>
         </li>
     </ul>

From 3dd5224ea30fb9a4a2399fde80587332b3c3af0e Mon Sep 17 00:00:00 2001
From: Shannon <sdeminick@gmail.com>
Date: Fri, 9 Aug 2019 13:07:19 +1000
Subject: [PATCH 44/46] Simplifies everything, no directives for now until this
 all makes sense and no directives that are coupled to the property editor, no
 ng-include

---
 .../blockeditor/umbblockeditor.directive.js   | 237 ------------------
 .../blockeditor/umb-blockeditor.html          |  24 --
 .../blockeditor/blockeditor.controller.js     | 228 +++++++++++++++++
 .../blockeditor/blockeditor.html              |  46 +++-
 .../blockeditor/blockeditor.simplelist.html   |  20 --
 5 files changed, 270 insertions(+), 285 deletions(-)
 delete mode 100644 src/Umbraco.Web.UI.Client/src/common/directives/components/blockeditor/umbblockeditor.directive.js
 delete mode 100644 src/Umbraco.Web.UI.Client/src/views/components/blockeditor/umb-blockeditor.html
 create mode 100644 src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js
 delete mode 100644 src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.simplelist.html

diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/blockeditor/umbblockeditor.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/blockeditor/umbblockeditor.directive.js
deleted file mode 100644
index 9549b05036..0000000000
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/blockeditor/umbblockeditor.directive.js
+++ /dev/null
@@ -1,237 +0,0 @@
-//fixme: this needs to be component not a directive
-angular.module("umbraco.directives").directive('umbBlockEditor', [
-    function () {
-        return {
-            restrict: "E", 
-            templateUrl: "views/components/blockeditor/umb-blockeditor.html",
-            scope: {
-                config: "=",
-                view: "@",
-                blocks: "="
-            },
-            controller: function ($scope, contentResource, editorService, iconHelper, clipboardService) {
-                var vm = this;
-
-                vm.scaffolds = [];
-                vm.loading = true;
-
-                let allowedElements = [];
-
-                // it would be awesome if we could load all scaffolds in one go... however we need to have an eye out for performance,
-                // oddly enough it's been shown to actually be slower to load them all at once instead of one at a time
-                var scaffoldsLoaded = 0;
-
-                function init() {
-                    if (!$scope.blocks) {
-                        $scope.blocks = [];
-                    }
-
-                    _.each($scope.config, function (config) {
-                        contentResource.getScaffoldByUdi(-20, config.elementType).then(function (scaffold) {
-                            if (scaffold.isElement) {
-                                // the scaffold udi is not the same as the element type udi, but we need it to be for comparison
-                                scaffold.udi = config.elementType;
-                                // shift this up to be consistent with other entities
-                                scaffold.thumbnail = scaffold.documentType.thumbnail;
-                                vm.scaffolds.push(scaffold);
-                            }
-                            scaffoldsLoaded++;
-                            initIfAllScaffoldsHaveLoaded();
-                        }, function (error) {
-                            scaffoldsLoaded++;
-                            initIfAllScaffoldsHaveLoaded();
-                        });
-                    });
-                }
-
-                function initIfAllScaffoldsHaveLoaded() {
-                    // Initialize when all scaffolds have loaded
-                    if ($scope.config.length === scaffoldsLoaded) {
-                        vm.scaffolds = _.sortBy(vm.scaffolds, function (scaffold) {
-                            return _.findIndex($scope.config, function (blockConfig) {
-                                return blockConfig.elementType === scaffold.udi;
-                            });
-                        });
-
-                        _.each($scope.blocks, function (block) {
-                            applyFakeSettings(block);
-                        });
-
-                        allowedElements = vm.scaffolds.map(x => x.contentTypeAlias);
-
-                        vm.loading = false;
-                    }
-                }
-
-
-                vm.openNodeTypePicker = function ($event) {
-
-                    vm.overlayMenu = {
-                        show: false,
-                        style: {},
-                        filter: vm.scaffolds.length > 12 ? true : false,
-                        orderBy: "$index",
-                        view: "itempicker",
-                        event: $event,
-                        clickPasteItem: function (item) {
-                            vm.pasteFromClipboard(item.data);
-                            vm.overlayMenu.show = false;
-                            vm.overlayMenu = null;
-                        },
-                        submit: function (model) {
-                            if (model && model.selectedItem) {
-                                vm.add(vm.scaffolds.filter(x => x.contentTypeAlias === model.selectedItem.alias)[0]);
-                            }
-                            vm.overlayMenu.show = false;
-                            vm.overlayMenu = null;
-                        },
-                        close: function () {
-                            vm.overlayMenu.show = false;
-                            vm.overlayMenu = null;
-                        }
-                    };
-
-                    // this could be used for future limiting on node types
-                    vm.overlayMenu.availableItems = [];
-                    vm.scaffolds.forEach(function (scaffold) {
-                        vm.overlayMenu.availableItems.push({
-                            alias: scaffold.contentTypeAlias,
-                            name: scaffold.contentTypeName,
-                            icon: iconHelper.convertFromLegacyIcon(scaffold.icon),
-                            thumbnail: scaffold.thumbnail,
-                            description: scaffold.documentType.description
-                        });
-                    });
-
-                    if (vm.overlayMenu.availableItems.length === 0) {
-                        return;
-                    }
-
-                    if (vm.overlayMenu.availableItems.some(x => x.thumbnail)) {
-                        vm.overlayMenu.size = 'large';
-                    } else {
-                        vm.overlayMenu.size = vm.overlayMenu.availableItems.length > 6 ? "medium" : "small";
-                    }
-
-                    vm.overlayMenu.pasteItems = [];
-                    var availableNodesForPaste = clipboardService.retriveDataOfType("elementType", allowedElements);
-                    availableNodesForPaste.forEach(function (node) {
-                        vm.overlayMenu.pasteItems.push({
-                            alias: node.contentTypeAlias,
-                            name: node.name, //contentTypeName
-                            data: node,
-                            icon: iconHelper.convertFromLegacyIcon(node.icon)
-                        });
-                    });
-
-                    vm.overlayMenu.clickClearPaste = function ($event) {
-                        $event.stopPropagation();
-                        $event.preventDefault();
-                        clipboardService.clearEntriesOfType("elementType", allowedElements);
-                        vm.overlayMenu.pasteItems = []; // This dialog is not connected via the clipboardService events, so we need to update manually.
-                    };
-
-                    if (vm.overlayMenu.availableItems.length === 1 && vm.overlayMenu.pasteItems.length === 0) {
-                        // only one scaffold type - no need to display the picker
-                        vm.add(vm.scaffolds[0]);
-                        return;
-                    }
-
-                    vm.overlayMenu.show = true;
-                }
-
-                vm.add = function (scaffold) {
-                    var element = angular.copy(scaffold);
-                    var block = {
-                        udi: element.udi,
-                        icon: element.icon,
-                        description: element.documentType.description, // probably don't want to persist these.
-                        content: {},
-                        settings: {
-                            view: 'views/propertyeditors/blockeditor/blockeditor.block.html'
-                        }
-                    };
-                    vm.openContent(element, block);
-                }
-
-                vm.editContent = function (block) {
-                    var scaffold = _.findWhere(vm.scaffolds, {
-                        udi: block.udi
-                    });
-                    var element = angular.copy(scaffold);
-                    _.each(element.variants[0].tabs, function (tab) {
-                        _.each(tab.properties, function (property) {
-                            if (block.content[property.alias]) {
-                                property.value = block.content[property.alias];
-                            }
-                        });
-                    });
-
-                    vm.openContent(element, block);
-                }
-
-                vm.openContent = function (element, block) {
-                    var options = {
-                        element: element,
-                        title: 'Edit block',
-                        //fixme: This isn't really a component if its strongly tied to views in the property editor :/
-                        view: "views/propertyeditors/blockeditor/blockeditor.editcontent.html",
-                        submit: function (model) {
-                            _.each(element.variants[0].tabs, function (tab) {
-                                _.each(tab.properties, function (property) {
-                                    block.content[property.alias] = property.value;
-                                });
-                            });
-                            if ($scope.blocks.indexOf(block) < 0) {
-                                $scope.blocks.push(block);
-                                applyFakeSettings(block);
-                            }
-
-                            editorService.close();
-                        },
-                        close: function () {
-                            editorService.close();
-                        }
-                    };
-                    editorService.open(options);
-                }
-
-                vm.editSettings = function (block) {
-                    var options = {
-                        settings: block.settings,
-                        title: "Edit settings",
-                        //fixme: This isn't really a component if its strongly tied to views in the property editor :/
-                        view: "views/propertyeditors/blockeditor/blockeditor.editsettings.html",
-                        size: "small",
-                        submit: function (model) {
-                            editorService.close();
-                        },
-                        close: function () {
-                            editorService.close();
-                        }
-                    };
-                    editorService.open(options);
-                }
-
-                vm.remove = function (block) {
-                    // this should be replaced by a custom dialog (pending some PRs)
-                    if (confirm("TODO: Are you sure?")) {
-                        $scope.blocks.splice($scope.blocks.indexOf(block), 1);
-                    }
-                }
-
-                // TODO: remove this (only for testing)
-                // currently pushes random values for setting a css grid location
-                function applyFakeSettings(block) {
-                    block.settings["col"] = 1 + Math.floor(Math.random() * 7);
-                    block.settings["row"] = 1 + Math.floor(Math.random() * 7);
-                    block.settings["w"] = 1 + Math.floor(Math.random() * 3);
-                    block.settings["h"] = 1 + Math.floor(Math.random() * 3);
-                }
-
-                init();
-            },
-            controllerAs: "vm"
-        };
-    } 
-]); 
diff --git a/src/Umbraco.Web.UI.Client/src/views/components/blockeditor/umb-blockeditor.html b/src/Umbraco.Web.UI.Client/src/views/components/blockeditor/umb-blockeditor.html
deleted file mode 100644
index 068cb99fc7..0000000000
--- a/src/Umbraco.Web.UI.Client/src/views/components/blockeditor/umb-blockeditor.html
+++ /dev/null
@@ -1,24 +0,0 @@
-<div attr>
-    <div style="position:relative" ng-if="vm.loading">
-        <umb-load-indicator />
-    </div>
-
-    <div ng-if="!vm.loading" ng-include="view"></div>    
-    
-    <div ng-if="!vm.loading" class="umb-nested-content__footer-bar">
-        <a href class="umb-nested-content__add-content" ng-class="{ '--disabled': !vm.scaffolds.length }" ng-click="vm.openNodeTypePicker($event)" prevent-default>
-            <localize key="grid_addElement" ng-if="vm.scaffolds.length > 1"></localize>
-            <span ng-if="vm.scaffolds.length === 1">
-                <localize key="general_add"></localize> {{ vm.scaffolds[0].contentTypeName }}
-            </span>
-        </a>
-    </div>
-     
-    <umb-overlay 
-        ng-if="vm.overlayMenu.show"
-        position="target"
-        size="vm.overlayMenu.size"
-        view="vm.overlayMenu.view"
-        model="vm.overlayMenu">
-    </umb-overlay>
-</div>
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js
new file mode 100644
index 0000000000..15a548bac9
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js
@@ -0,0 +1,228 @@
+(function () {
+    "use strict";
+
+    function BlockEditorController($scope, contentResource, editorService, iconHelper, clipboardService) {
+        var vm = this;
+
+        vm.scaffolds = [];
+        vm.loading = true;
+        vm.blocks = $scope.model.value ? $scope.model.value : [];
+        vm.config = $scope.model.config ? $scope.model.config.blocks : [];
+
+        let allowedElements = [];
+
+        // it would be awesome if we could load all scaffolds in one go... however we need to have an eye out for performance,
+        // oddly enough it's been shown to actually be slower to load them all at once instead of one at a time
+        var scaffoldsLoaded = 0;
+
+        function init() {
+            
+            _.each(vm.config, function (config) {
+                contentResource.getScaffoldByUdi(-20, config.elementType).then(function (scaffold) {
+                    if (scaffold.isElement) {
+                        // the scaffold udi is not the same as the element type udi, but we need it to be for comparison
+                        scaffold.udi = config.elementType;
+                        // shift this up to be consistent with other entities
+                        scaffold.thumbnail = scaffold.documentType.thumbnail;
+                        vm.scaffolds.push(scaffold);
+                    }
+                    scaffoldsLoaded++;
+                    initIfAllScaffoldsHaveLoaded();
+                }, function (error) {
+                    scaffoldsLoaded++;
+                    initIfAllScaffoldsHaveLoaded();
+                });
+            });
+        }
+
+        function initIfAllScaffoldsHaveLoaded() {
+            // Initialize when all scaffolds have loaded
+            if (vm.config.length === scaffoldsLoaded) {
+                vm.scaffolds = _.sortBy(vm.scaffolds, function (scaffold) {
+                    return _.findIndex(vm.config, function (blockConfig) {
+                        return blockConfig.elementType === scaffold.udi;
+                    });
+                });
+
+                _.each(vm.blocks, function (block) {
+                    applyFakeSettings(block);
+                });
+
+                allowedElements = vm.scaffolds.map(x => x.contentTypeAlias);
+
+                vm.loading = false;
+            }
+        }
+
+
+        vm.openNodeTypePicker = function ($event) {
+
+            vm.overlayMenu = {
+                show: false,
+                style: {},
+                filter: vm.scaffolds.length > 12 ? true : false,
+                orderBy: "$index",
+                view: "itempicker",
+                event: $event,
+                clickPasteItem: function (item) {
+                    vm.pasteFromClipboard(item.data);
+                    vm.overlayMenu.show = false;
+                    vm.overlayMenu = null;
+                },
+                submit: function (model) {
+                    if (model && model.selectedItem) {
+                        vm.add(vm.scaffolds.filter(x => x.contentTypeAlias === model.selectedItem.alias)[0]);
+                    }
+                    vm.overlayMenu.show = false;
+                    vm.overlayMenu = null;
+                },
+                close: function () {
+                    vm.overlayMenu.show = false;
+                    vm.overlayMenu = null;
+                }
+            };
+
+            // this could be used for future limiting on node types
+            vm.overlayMenu.availableItems = [];
+            vm.scaffolds.forEach(function (scaffold) {
+                vm.overlayMenu.availableItems.push({
+                    alias: scaffold.contentTypeAlias,
+                    name: scaffold.contentTypeName,
+                    icon: iconHelper.convertFromLegacyIcon(scaffold.icon),
+                    thumbnail: scaffold.thumbnail,
+                    description: scaffold.documentType.description
+                });
+            });
+
+            if (vm.overlayMenu.availableItems.length === 0) {
+                return;
+            }
+
+            if (vm.overlayMenu.availableItems.some(x => x.thumbnail)) {
+                vm.overlayMenu.size = 'large';
+            } else {
+                vm.overlayMenu.size = vm.overlayMenu.availableItems.length > 6 ? "medium" : "small";
+            }
+
+            vm.overlayMenu.pasteItems = [];
+            var availableNodesForPaste = clipboardService.retriveDataOfType("elementType", allowedElements);
+            availableNodesForPaste.forEach(function (node) {
+                vm.overlayMenu.pasteItems.push({
+                    alias: node.contentTypeAlias,
+                    name: node.name, //contentTypeName
+                    data: node,
+                    icon: iconHelper.convertFromLegacyIcon(node.icon)
+                });
+            });
+
+            vm.overlayMenu.clickClearPaste = function ($event) {
+                $event.stopPropagation();
+                $event.preventDefault();
+                clipboardService.clearEntriesOfType("elementType", allowedElements);
+                vm.overlayMenu.pasteItems = []; // This dialog is not connected via the clipboardService events, so we need to update manually.
+            };
+
+            if (vm.overlayMenu.availableItems.length === 1 && vm.overlayMenu.pasteItems.length === 0) {
+                // only one scaffold type - no need to display the picker
+                vm.add(vm.scaffolds[0]);
+                return;
+            }
+
+            vm.overlayMenu.show = true;
+        }
+
+        vm.add = function (scaffold) {
+            var element = angular.copy(scaffold);
+            var block = {
+                udi: element.udi,
+                icon: element.icon,
+                description: element.documentType.description, // probably don't want to persist these.
+                content: {},
+                settings: {
+                    view: 'views/propertyeditors/blockeditor/blockeditor.block.html'
+                }
+            };
+            vm.openContent(element, block);
+        }
+
+        vm.editContent = function (block) {
+            var scaffold = _.findWhere(vm.scaffolds, {
+                udi: block.udi
+            });
+            var element = angular.copy(scaffold);
+            _.each(element.variants[0].tabs, function (tab) {
+                _.each(tab.properties, function (property) {
+                    if (block.content[property.alias]) {
+                        property.value = block.content[property.alias];
+                    }
+                });
+            });
+
+            vm.openContent(element, block);
+        }
+
+        vm.openContent = function (element, block) {
+            var options = {
+                element: element,
+                title: 'Edit block',
+                //fixme: This isn't really a component if its strongly tied to views in the property editor :/
+                view: "views/propertyeditors/blockeditor/blockeditor.editcontent.html",
+                submit: function (model) {
+                    _.each(element.variants[0].tabs, function (tab) {
+                        _.each(tab.properties, function (property) {
+                            block.content[property.alias] = property.value;
+                        });
+                    });
+                    if (vm.blocks.indexOf(block) < 0) {
+                        vm.blocks.push(block);
+                        applyFakeSettings(block);
+                    }
+
+                    editorService.close();
+                },
+                close: function () {
+                    editorService.close();
+                }
+            };
+            editorService.open(options);
+        }
+
+        vm.editSettings = function (block) {
+            var options = {
+                settings: block.settings,
+                title: "Edit settings",
+                //fixme: This isn't really a component if its strongly tied to views in the property editor :/
+                view: "views/propertyeditors/blockeditor/blockeditor.editsettings.html",
+                size: "small",
+                submit: function (model) {
+                    editorService.close();
+                },
+                close: function () {
+                    editorService.close();
+                }
+            };
+            editorService.open(options);
+        }
+
+        vm.remove = function (block) {
+            // this should be replaced by a custom dialog (pending some PRs)
+            if (confirm("TODO: Are you sure?")) {
+                vm.blocks.splice($scope.blocks.indexOf(block), 1);
+            }
+        }
+
+        // TODO: remove this (only for testing)
+        // currently pushes random values for setting a css grid location
+        function applyFakeSettings(block) {
+            block.settings["col"] = 1 + Math.floor(Math.random() * 7);
+            block.settings["row"] = 1 + Math.floor(Math.random() * 7);
+            block.settings["w"] = 1 + Math.floor(Math.random() * 3);
+            block.settings["h"] = 1 + Math.floor(Math.random() * 3);
+        }
+
+        init();
+    }
+
+    angular.module("umbraco").controller("Umbraco.PropertyEditors.BlockEditorController", BlockEditorController);
+
+})();
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
index bcaab4998f..4af6379344 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
@@ -1,4 +1,42 @@
-<umb-block-editor blocks="model.value"
-                  config="model.config.blocks"
-                  view="views/propertyeditors/blockeditor/blockeditor.simplelist.html">
-</umb-block-editor>
+<div ng-controller="Umbraco.PropertyEditors.BlockEditorController as vm">
+    <div style="position:relative" ng-if="vm.loading">
+        <umb-load-indicator />
+    </div>
+
+    <div ng-if="!vm.loading">
+        <ul class="unstyled" ui-sortable="sortableOptions" ng-model="vm.blocks">
+            <li ng-repeat="block in vm.blocks">
+                <div class="handle">
+                    <div class="umb-node-preview umb-node-preview--sortable">
+                        <i ng-if="block.icon" class="umb-node-preview__icon {{ block.icon }}"></i>
+                        <div class="umb-node-preview__content">
+                            <div class="umb-node-preview__name" ng-attr-title="{{block.alias}}">TODO: Figure out how to name a block</div>
+                            <div class="umb-node-preview__description" ng-if="block.description">{{ block.description }}</div>
+                        </div>
+                        <div class="umb-node-preview__actions">
+                            <a class="umb-node-preview__action" title="Edit" href="" ng-click="vm.editContent(block)"><localize key="general_edit">Edit</localize></a>
+                            <a class="umb-node-preview__action" title="Settings" href="" ng-click="vm.editSettings(block)"><localize key="general_settings">Settings</localize></a>
+                            <a class="umb-node-preview__action umb-node-preview__action--red" title="Remove" ng-href="" ng-click="vm.remove(block)"><localize key="general_remove">Remove</localize></a>
+                        </div>
+                    </div>
+                </div>
+            </li>
+        </ul>
+    </div>
+
+    <div ng-if="!vm.loading" class="umb-nested-content__footer-bar">
+        <a href class="umb-nested-content__add-content" ng-class="{ '--disabled': !vm.scaffolds.length }" ng-click="vm.openNodeTypePicker($event)" prevent-default>
+            <localize key="grid_addElement" ng-if="vm.scaffolds.length > 1"></localize>
+            <span ng-if="vm.scaffolds.length === 1">
+                <localize key="general_add"></localize> {{ vm.scaffolds[0].contentTypeName }}
+            </span>
+        </a>
+    </div>
+
+    <umb-overlay ng-if="vm.overlayMenu.show"
+                 position="target"
+                 size="vm.overlayMenu.size"
+                 view="vm.overlayMenu.view"
+                 model="vm.overlayMenu">
+    </umb-overlay>
+</div>
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.simplelist.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.simplelist.html
deleted file mode 100644
index bb711683d0..0000000000
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.simplelist.html
+++ /dev/null
@@ -1,20 +0,0 @@
-<div ng-controller="Umbraco.PropertyEditors.BlockEditor.SimpleListController">
-    <ul class="unstyled" ui-sortable="sortableOptions" ng-model="blocks">
-        <li ng-repeat="block in blocks">
-            <div class="handle">
-                <div class="umb-node-preview umb-node-preview--sortable">
-                    <i ng-if="block.icon" class="umb-node-preview__icon {{ block.icon }}"></i>
-                    <div class="umb-node-preview__content">
-                        <div class="umb-node-preview__name" ng-attr-title="{{block.alias}}">TODO: Figure out how to name a block</div>
-                        <div class="umb-node-preview__description" ng-if="block.description">{{ block.description }}</div>
-                    </div>
-                    <div class="umb-node-preview__actions">
-                        <a class="umb-node-preview__action" title="Edit" href="" ng-click="vm.editContent(block)"><localize key="general_edit">Edit</localize></a>
-                        <a class="umb-node-preview__action" title="Settings" href="" ng-click="vm.editSettings(block)"><localize key="general_settings">Settings</localize></a>
-                        <a class="umb-node-preview__action umb-node-preview__action--red" title="Remove" ng-href="" ng-click="vm.remove(block)"><localize key="general_remove">Remove</localize></a>
-                    </div>
-                </div>
-            </div>
-        </li>
-    </ul>
-</div>

From aed223c16dd1f8d11afb122e4ae4cf5e62479529 Mon Sep 17 00:00:00 2001
From: Shannon <sdeminick@gmail.com>
Date: Fri, 9 Aug 2019 15:11:36 +1000
Subject: [PATCH 45/46] creates a proper component for the item list

---
 .../blockeditor/blocklist.directive.js        |  65 +++++++++++
 .../blockeditor/umb-block-list.html           |  18 +++
 .../blockeditor/blockeditor.controller.js     | 104 +++++++-----------
 .../blockeditor/blockeditor.html              |  25 ++---
 4 files changed, 130 insertions(+), 82 deletions(-)
 create mode 100644 src/Umbraco.Web.UI.Client/src/common/directives/components/blockeditor/blocklist.directive.js
 create mode 100644 src/Umbraco.Web.UI.Client/src/views/components/blockeditor/umb-block-list.html

diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/blockeditor/blocklist.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/blockeditor/blocklist.directive.js
new file mode 100644
index 0000000000..d01d8c0bd9
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/blockeditor/blocklist.directive.js
@@ -0,0 +1,65 @@
+(function () {
+    "use strict";
+
+    /**
+     * A component used to render a list of blocks
+     */
+    var umbBlockList = {
+        templateUrl: 'views/components/blockeditor/umb-block-list.html',
+        bindings: {
+            blocks: "<",
+            config: "<",
+            scaffolds: "<",
+            onEdit: "&",
+            onRemove: "&",
+            onSettings: "&",           
+            onSort: "&?"
+        },
+        controllerAs: 'vm',
+        controller: umbBlockListController
+    };
+
+    function umbBlockListController() { 
+        var vm = this;
+
+        vm.sortableOptions = {
+            axis: "y",
+            cursor: "move",
+            handle: ".handle",
+            tolerance: 'pointer',
+            update: function (e, ui) {
+                if (vm.onSort) {
+                    vm.onSort({ e: e, ui: ui });
+                }
+            }
+        };
+
+        vm.editContent = function (block) {
+            var scaffold = _.findWhere(vm.scaffolds, {
+                udi: block.udi
+            });
+            var element = angular.copy(scaffold);
+            _.each(element.variants[0].tabs, function (tab) {
+                _.each(tab.properties, function (property) {
+                    if (block.content[property.alias]) {
+                        property.value = block.content[property.alias];
+                    }
+                });
+            });
+
+            vm.onEdit({ element: element, block: block });
+        }
+
+        vm.remove = function (block) {
+            // this should be replaced by a custom dialog (pending some PRs)
+            if (confirm("TODO: Are you sure?")) {
+                vm.onRemove({ block: block });
+            }
+        }
+
+    }
+
+    angular.module('umbraco').component('umbBlockList', umbBlockList);
+
+
+})();
diff --git a/src/Umbraco.Web.UI.Client/src/views/components/blockeditor/umb-block-list.html b/src/Umbraco.Web.UI.Client/src/views/components/blockeditor/umb-block-list.html
new file mode 100644
index 0000000000..5a7251e2f3
--- /dev/null
+++ b/src/Umbraco.Web.UI.Client/src/views/components/blockeditor/umb-block-list.html
@@ -0,0 +1,18 @@
+<ul class="unstyled" ui-sortable="vm.sortableOptions" ng-model="vm.blocks">
+    <li ng-repeat="block in vm.blocks">
+        <div class="handle">
+            <div class="umb-node-preview umb-node-preview--sortable">
+                <i ng-if="block.icon" class="umb-node-preview__icon {{ block.icon }}"></i>
+                <div class="umb-node-preview__content">
+                    <div class="umb-node-preview__name" ng-attr-title="{{block.alias}}">TODO: Figure out how to name a block</div>
+                    <div class="umb-node-preview__description" ng-if="block.description">{{ block.description }}</div>
+                </div>
+                <div class="umb-node-preview__actions">
+                    <a class="umb-node-preview__action" title="Edit" href="" ng-click="vm.editContent(block)"><localize key="general_edit">Edit</localize></a>
+                    <a class="umb-node-preview__action" title="Settings" href="" ng-click="vm.onSettings({block: block})"><localize key="general_settings">Settings</localize></a>
+                    <a class="umb-node-preview__action umb-node-preview__action--red" title="Remove" ng-href="" ng-click="vm.remove(block)"><localize key="general_remove">Remove</localize></a>
+                </div>
+            </div>
+        </div>
+    </li>
+</ul>
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js
index 15a548bac9..6d59022652 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.controller.js
@@ -6,9 +6,7 @@
 
         vm.scaffolds = [];
         vm.loading = true;
-        vm.blocks = $scope.model.value ? $scope.model.value : [];
-        vm.config = $scope.model.config ? $scope.model.config.blocks : [];
-
+        
         let allowedElements = [];
 
         // it would be awesome if we could load all scaffolds in one go... however we need to have an eye out for performance,
@@ -17,13 +15,11 @@
 
         function init() {
             
-            _.each(vm.config, function (config) {
+            _.each($scope.model.config.blocks, function (config) {
                 contentResource.getScaffoldByUdi(-20, config.elementType).then(function (scaffold) {
                     if (scaffold.isElement) {
                         // the scaffold udi is not the same as the element type udi, but we need it to be for comparison
                         scaffold.udi = config.elementType;
-                        // shift this up to be consistent with other entities
-                        scaffold.thumbnail = scaffold.documentType.thumbnail;
                         vm.scaffolds.push(scaffold);
                     }
                     scaffoldsLoaded++;
@@ -37,14 +33,14 @@
 
         function initIfAllScaffoldsHaveLoaded() {
             // Initialize when all scaffolds have loaded
-            if (vm.config.length === scaffoldsLoaded) {
+            if ($scope.model.config.blocks.length === scaffoldsLoaded) {
                 vm.scaffolds = _.sortBy(vm.scaffolds, function (scaffold) {
-                    return _.findIndex(vm.config, function (blockConfig) {
+                    return _.findIndex($scope.model.config.blocks, function (blockConfig) {
                         return blockConfig.elementType === scaffold.udi;
                     });
                 });
 
-                _.each(vm.blocks, function (block) {
+                _.each($scope.model.value, function (block) {
                     applyFakeSettings(block);
                 });
 
@@ -89,7 +85,6 @@
                     alias: scaffold.contentTypeAlias,
                     name: scaffold.contentTypeName,
                     icon: iconHelper.convertFromLegacyIcon(scaffold.icon),
-                    thumbnail: scaffold.thumbnail,
                     description: scaffold.documentType.description
                 });
             });
@@ -98,11 +93,8 @@
                 return;
             }
 
-            if (vm.overlayMenu.availableItems.some(x => x.thumbnail)) {
-                vm.overlayMenu.size = 'large';
-            } else {
-                vm.overlayMenu.size = vm.overlayMenu.availableItems.length > 6 ? "medium" : "small";
-            }
+            //TODO: If we support larger thumbnails of some sort one day, this could be large
+            vm.overlayMenu.size = vm.overlayMenu.availableItems.length > 6 ? "medium" : "small";
 
             vm.overlayMenu.pasteItems = [];
             var availableNodesForPaste = clipboardService.retriveDataOfType("elementType", allowedElements);
@@ -142,56 +134,13 @@
                     view: 'views/propertyeditors/blockeditor/blockeditor.block.html'
                 }
             };
-            vm.openContent(element, block);
-        }
-
-        vm.editContent = function (block) {
-            var scaffold = _.findWhere(vm.scaffolds, {
-                udi: block.udi
-            });
-            var element = angular.copy(scaffold);
-            _.each(element.variants[0].tabs, function (tab) {
-                _.each(tab.properties, function (property) {
-                    if (block.content[property.alias]) {
-                        property.value = block.content[property.alias];
-                    }
-                });
-            });
-
-            vm.openContent(element, block);
-        }
-
-        vm.openContent = function (element, block) {
-            var options = {
-                element: element,
-                title: 'Edit block',
-                //fixme: This isn't really a component if its strongly tied to views in the property editor :/
-                view: "views/propertyeditors/blockeditor/blockeditor.editcontent.html",
-                submit: function (model) {
-                    _.each(element.variants[0].tabs, function (tab) {
-                        _.each(tab.properties, function (property) {
-                            block.content[property.alias] = property.value;
-                        });
-                    });
-                    if (vm.blocks.indexOf(block) < 0) {
-                        vm.blocks.push(block);
-                        applyFakeSettings(block);
-                    }
-
-                    editorService.close();
-                },
-                close: function () {
-                    editorService.close();
-                }
-            };
-            editorService.open(options);
+            openContent(element, block);
         }
 
         vm.editSettings = function (block) {
             var options = {
                 settings: block.settings,
                 title: "Edit settings",
-                //fixme: This isn't really a component if its strongly tied to views in the property editor :/
                 view: "views/propertyeditors/blockeditor/blockeditor.editsettings.html",
                 size: "small",
                 submit: function (model) {
@@ -204,11 +153,38 @@
             editorService.open(options);
         }
 
-        vm.remove = function (block) {
-            // this should be replaced by a custom dialog (pending some PRs)
-            if (confirm("TODO: Are you sure?")) {
-                vm.blocks.splice($scope.blocks.indexOf(block), 1);
-            }
+        vm.onRemove = function (block) {
+            $scope.model.value.splice($scope.model.value.indexOf(block), 1);
+        }
+
+        vm.onEdit = function (element, block) {
+            openContent(element, block);
+        }
+
+        function openContent(element, block) {
+            var options = {
+                element: element,
+                title: 'Edit block',
+                //fixme: This isn't really a component if its strongly tied to views in the property editor :/
+                view: "views/propertyeditors/blockeditor/blockeditor.editcontent.html",
+                submit: function (model) {
+                    _.each(element.variants[0].tabs, function (tab) {
+                        _.each(tab.properties, function (property) {
+                            block.content[property.alias] = property.value;
+                        });
+                    });
+                    if ($scope.model.value.indexOf(block) < 0) {
+                        $scope.model.value.push(block);
+                        applyFakeSettings(block);
+                    }
+
+                    editorService.close();
+                },
+                close: function () {
+                    editorService.close();
+                }
+            };
+            editorService.open(options);
         }
 
         // TODO: remove this (only for testing)
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
index 4af6379344..c0eae888b9 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/blockeditor/blockeditor.html
@@ -4,24 +4,13 @@
     </div>
 
     <div ng-if="!vm.loading">
-        <ul class="unstyled" ui-sortable="sortableOptions" ng-model="vm.blocks">
-            <li ng-repeat="block in vm.blocks">
-                <div class="handle">
-                    <div class="umb-node-preview umb-node-preview--sortable">
-                        <i ng-if="block.icon" class="umb-node-preview__icon {{ block.icon }}"></i>
-                        <div class="umb-node-preview__content">
-                            <div class="umb-node-preview__name" ng-attr-title="{{block.alias}}">TODO: Figure out how to name a block</div>
-                            <div class="umb-node-preview__description" ng-if="block.description">{{ block.description }}</div>
-                        </div>
-                        <div class="umb-node-preview__actions">
-                            <a class="umb-node-preview__action" title="Edit" href="" ng-click="vm.editContent(block)"><localize key="general_edit">Edit</localize></a>
-                            <a class="umb-node-preview__action" title="Settings" href="" ng-click="vm.editSettings(block)"><localize key="general_settings">Settings</localize></a>
-                            <a class="umb-node-preview__action umb-node-preview__action--red" title="Remove" ng-href="" ng-click="vm.remove(block)"><localize key="general_remove">Remove</localize></a>
-                        </div>
-                    </div>
-                </div>
-            </li>
-        </ul>
+        <umb-block-list blocks="model.value"
+                        config="model.config.blocks"
+                        scaffolds="vm.scaffolds"
+                        on-edit="vm.onEdit(element, block)"
+                        on-remove="vm.onRemove(element, block)"
+                        on-settings="vm.editSettings(block)">
+        </umb-block-list>
     </div>
 
     <div ng-if="!vm.loading" class="umb-nested-content__footer-bar">

From fec3d8b74049a23f9951a84c4628a333414c34c9 Mon Sep 17 00:00:00 2001
From: Shannon <sdeminick@gmail.com>
Date: Fri, 9 Aug 2019 17:02:46 +1000
Subject: [PATCH 46/46] fix test

---
 src/Umbraco.Tests/Composing/TypeLoaderTests.cs | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/Umbraco.Tests/Composing/TypeLoaderTests.cs b/src/Umbraco.Tests/Composing/TypeLoaderTests.cs
index 7459ae848b..9cd4f39c17 100644
--- a/src/Umbraco.Tests/Composing/TypeLoaderTests.cs
+++ b/src/Umbraco.Tests/Composing/TypeLoaderTests.cs
@@ -268,7 +268,7 @@ AnotherContentFinder
         public void GetDataEditors()
         {
             var types = _typeLoader.GetDataEditors();
-            Assert.AreEqual(38, types.Count());
+            Assert.AreEqual(39, types.Count());
         }
 
         /// <summary>