Open composition doctypes in infinite editor (#6387)

src/Umbraco.Web.UI.Client/src/common/directives/components/umbgroupsbuilder.directive.js

@@ -364,6 +364,22 @@
       };
 
 
+      scope.openDocumentType = function (documentTypeId) {
+          const editor = {
+              id: documentTypeId,
+              submit: function (model) {
+                  const args = { node: scope.model };
+                  eventsService.emit("editors.documentType.reload", args);
+                  editorService.close();
+              },
+              close: function () {
+                  editorService.close();
+              }
+          };
+          editorService.documentTypeEditor(editor);
+
+      };
+
       /* ---------- GROUPS ---------- */
 
       scope.addGroup = function(group) {

src/Umbraco.Web.UI.Client/src/less/utilities/_spacing.less

@@ -66,3 +66,5 @@
 .ml5 { margin-left: @spacing-extra-large; }
 .ml6 { margin-left: @spacing-extra-extra-large; }
 .ml7 { margin-left: @spacing-extra-extra-extra-large; }
+
+.p0 { padding: @spacing-none; }

src/Umbraco.Web.UI.Client/src/views/components/umb-groups-builder.html

@@ -81,7 +81,7 @@
                         <i class="icon icon-merge"></i>
                         <localize key="contentTypeEditor_inheritedFrom"></localize>: {{ tab.inheritedFromName }}
                         <span ng-repeat="contentTypeName in tab.parentTabContentTypeNames">
-                            <a href="#/settings/documentTypes/edit/{{tab.parentTabContentTypes[$index]}}">{{ contentTypeName }}</a>
+                            <button type="button" class="btn-link btn-small p0" ng-click="openDocumentType(tab.parentTabContentTypes[$index])">{{ contentTypeName }}</button>
                             <span ng-if="!$last">, </span>
                         </span>
                     </div>

src/Umbraco.Web.UI.Client/src/views/documenttypes/edit.controller.js

@@ -497,6 +497,12 @@
             loadDocumentType();
         }));
 
+        evts.push(eventsService.on("editors.documentType.reload", function (name, args) {
+            if (args && args.node && vm.contentType.id === args.node.id) {
+                loadDocumentType();
+            }
+        }));
+
         evts.push(eventsService.on("editors.documentType.saved", function(name, args) {
             if(args.documentType.allowedTemplates.length > 0){
                 navigationService.syncTree({ tree: "templates", path: [], forceReload: true })