From fadc161ac95de345e650a627b6c41ba2928317f7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <nsl@umbraco.dk>
Date: Fri, 10 Jan 2020 13:00:26 +0100
Subject: [PATCH] correcting datatype creation flow

---
 .../datatypeconfigurationpicker.controller.js | 31 +++++-----------
 .../datatypeconfigurationpicker.html          |  4 +-
 .../datatypepicker.controller.js              | 37 ++++++++++++++++---
 .../datatypepicker/datatypepicker.html        |  2 +-
 4 files changed, 43 insertions(+), 31 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/datatypeconfigurationpicker/datatypeconfigurationpicker.controller.js b/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/datatypeconfigurationpicker/datatypeconfigurationpicker.controller.js
index a0b3f35a57..9ee80488af 100644
--- a/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/datatypeconfigurationpicker/datatypeconfigurationpicker.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/datatypeconfigurationpicker/datatypeconfigurationpicker.controller.js
@@ -18,8 +18,8 @@
         
         vm.loading = true;
         
-        vm.newConfig = newConfig;
-        vm.pickConfig = pickConfig;
+        vm.newDataType = newDataType;
+        vm.pickDataType = pickDataType;
         vm.close = close;
 
         function activate() {
@@ -44,7 +44,7 @@
                 
                 _.each(configs, function(configGroup) {
                         for(var i = 0; i<configGroup.length; i++) {
-                            if (configGroup[i].alias === $scope.model.dataType.alias) {
+                            if (configGroup[i].alias === $scope.model.editor.alias) {
                                 filteredConfigs.push(configGroup[i]);
                             }
                         }
@@ -57,17 +57,17 @@
 
         }
         
-        function newConfig() {
+        function newDataType() {
 
             var dataTypeSettings = {
-                propertyEditor: $scope.model.dataType,
+                propertyEditor: $scope.model.editor,
                 property: $scope.model.property,
                 contentTypeName: $scope.model.contentTypeName,
                 create: true,
                 view: "views/common/infiniteeditors/datatypesettings/datatypesettings.html",
                 submit: function(model) {
                     contentTypeResource.getPropertyTypeScaffold(model.dataType.id).then(function(propertyType) {
-                        submit(model.dataType, propertyType, true);
+                        $scope.model.submit(model.dataType, propertyType, true);
                         editorService.close();
                     });
                 },
@@ -80,30 +80,17 @@
 
         }
 
-        function pickConfig(selectedConfig) {
+        function pickDataType(selectedConfig) {
+
             selectedConfig.loading = true;
             dataTypeResource.getById(selectedConfig.id).then(function(dataType) {
                 contentTypeResource.getPropertyTypeScaffold(dataType.id).then(function(propertyType) {
                     selectedConfig.loading = false;
-                    submit(dataType, propertyType, false);
+                    $scope.model.submit(dataType, propertyType, false);
                 });
             });
         }
         
-        function submit(dataType, propertyType, isNew) {
-            // update property
-            $scope.model.property.config = propertyType.config;
-            $scope.model.property.editor = propertyType.editor;
-            $scope.model.property.view = propertyType.view;
-            $scope.model.property.dataTypeId = dataType.id;
-            $scope.model.property.dataTypeIcon = dataType.icon;
-            $scope.model.property.dataTypeName = dataType.name;
-
-            $scope.model.updateSameDataTypes = isNew;
-            
-            $scope.model.submit($scope.model);
-        }
-        
         function close() {
             if($scope.model.close) {
                 $scope.model.close();
diff --git a/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/datatypeconfigurationpicker/datatypeconfigurationpicker.html b/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/datatypeconfigurationpicker/datatypeconfigurationpicker.html
index 36c8292d4f..aa99248dfc 100644
--- a/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/datatypeconfigurationpicker/datatypeconfigurationpicker.html
+++ b/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/datatypeconfigurationpicker/datatypeconfigurationpicker.html
@@ -22,7 +22,7 @@
                         <ul class="umb-card-grid -three-in-row">
                             <li ng-repeat="dataTypeConfig in vm.configs | orderBy:'name'"
                                 data-element="datatypeconfig-{{dataTypeConfig.name}}"
-                                ng-click="vm.pickConfig(dataTypeConfig)">
+                                ng-click="vm.pickDataType(dataTypeConfig)">
                                 <div ng-if="dataTypeConfig.loading" class="umb-card-grid-item__loading">
                                     <div class="umb-button__progress"></div>
                                 </div>
@@ -35,7 +35,7 @@
                             </li>
                         </ul>
                         <ul class="umb-card-grid -three-in-row">
-                            <li ng-click="vm.newConfig()">
+                            <li ng-click="vm.newDataType()">
                                 <a class="umb-card-grid-item-slot" href="" title="Create a new configuration of {{ model.dataType.name }}">
                                     <span>
                                         <i class="icon icon-add"></i>
diff --git a/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/datatypepicker/datatypepicker.controller.js b/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/datatypepicker/datatypepicker.controller.js
index 144dce3ecc..d622ccea52 100644
--- a/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/datatypepicker/datatypepicker.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/datatypepicker/datatypepicker.controller.js
@@ -21,7 +21,8 @@
         vm.searchTerm = "";
         vm.searchResult = null;
         
-        vm.pickType = pickType;
+        vm.viewOptionsForEditor = viewOptionsForEditor;
+        vm.pickDataType = pickDataType;
         vm.pickEditor = pickEditor;
         vm.close = close;
         vm.searchTermChanged = searchTermChanged;
@@ -105,17 +106,17 @@
         }
 
         
-        function pickType(dataType) {
+        function viewOptionsForEditor(editor) {
             
             var dataTypeConfigurationPicker = {
-                dataType: dataType,
+                editor: editor,
                 property: $scope.model.property,
                 contentTypeName: $scope.model.contentTypeName,
                 view: "views/common/infiniteeditors/datatypeconfigurationpicker/datatypeconfigurationpicker.html",
                 size: "small",
-                submit: function(model) {
+                submit: function(dataType, propertyType, isNew) {
+                    submit(dataType, propertyType, isNew);
                     editorService.close();
-                    $scope.model.submit(model);
                 },
                 close: function() {
                     editorService.close();
@@ -126,6 +127,16 @@
 
         }
 
+        function pickDataType(selectedDataType) {
+            selectedDataType.loading = true;
+            dataTypeResource.getById(selectedDataType.id).then(function(dataType) {
+                contentTypeResource.getPropertyTypeScaffold(dataType.id).then(function(propertyType) {
+                    selectedDataType.loading = false;
+                    submit(dataType, propertyType, false);
+                });
+            });
+        }
+
         function pickEditor(propertyEditor) {
 
             var dataTypeSettings = {
@@ -136,7 +147,7 @@
                 view: "views/common/infiniteeditors/datatypesettings/datatypesettings.html",
                 submit: function(model) {
                     contentTypeResource.getPropertyTypeScaffold(model.dataType.id).then(function(propertyType) {
-                        $scope.model.submit(model);
+                        submit(model.dataType, propertyType, true);
                         editorService.close();
                     });
                 },
@@ -148,6 +159,20 @@
             editorService.open(dataTypeSettings);
 
         }
+
+        function submit(dataType, propertyType, isNew) {
+            // update property
+            $scope.model.property.config = propertyType.config;
+            $scope.model.property.editor = propertyType.editor;
+            $scope.model.property.view = propertyType.view;
+            $scope.model.property.dataTypeId = dataType.id;
+            $scope.model.property.dataTypeIcon = dataType.icon;
+            $scope.model.property.dataTypeName = dataType.name;
+
+            $scope.model.updateSameDataTypes = isNew;
+
+            $scope.model.submit($scope.model);
+        }
         
         function close() {
             if($scope.model.close) {
diff --git a/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/datatypepicker/datatypepicker.html b/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/datatypepicker/datatypepicker.html
index dbc8b0235c..957e03b64d 100644
--- a/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/datatypepicker/datatypepicker.html
+++ b/src/Umbraco.Web.UI.Client/src/views/common/infiniteeditors/datatypepicker/datatypepicker.html
@@ -38,7 +38,7 @@
                             <ul class="umb-card-grid -six-in-row">
                                 <li ng-repeat="dataType in value | orderBy:'name'"
                                     data-element="datatype-{{dataType.name}}"
-                                    ng-click="vm.pickType(dataType)">
+                                    ng-click="vm.viewOptionsForEditor(dataType)">
                                     <a class="umb-card-grid-item" href="" title="{{ dataType.name }}">
                                         <span>
                                             <i class="{{ dataType.icon }}" ng-class="{'icon-autofill': dataType.icon == null}"></i>