From f043a2e4eea1b47d816c719de6e8e71e21e57580 Mon Sep 17 00:00:00 2001
From: Mads Rasmussen <mads@umbraco.com>
Date: Mon, 24 Jul 2017 14:18:36 +0200
Subject: [PATCH] fixes: U4-10109 Need to indicate that granular permission
 entries can be edited

---
 .../directives/components/umbnodepreview.directive.js    | 6 +++++-
 .../src/less/components/umb-node-preview.less            | 4 ++--
 .../src/views/components/umb-node-preview.html           | 9 +++++----
 .../src/views/users/group.controller.js                  | 7 +++++--
 src/Umbraco.Web.UI.Client/src/views/users/group.html     | 4 +++-
 5 files changed, 20 insertions(+), 10 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 9966e94b70..e935557ce9 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
@@ -82,8 +82,10 @@
 @param {boolean} sortable (<code>binding</code>): Will add a move cursor on the node preview. Can used in combination with ui-sortable.
 @param {boolean} allowRemove (<code>binding</code>): Show/Hide the remove button.
 @param {boolean} allowOpen (<code>binding</code>): Show/Hide the open button.
+@param {boolean} allowEdit (<code>binding</code>): Show/Hide the edit button (Added in version 7.7.0).
 @param {function} onRemove (<code>expression</code>): Callback function when the remove button is clicked.
 @param {function} onOpen (<code>expression</code>): Callback function when the open button is clicked.
+@param {function} onEdit (<code>expression</code>): Callback function when the edit button is clicked (Added in version 7.7.0).
 **/
 
 (function () {
@@ -108,8 +110,10 @@
                 sortable: "=?",
                 allowOpen: "=?",
                 allowRemove: "=?",
+                allowEdit: "=?",
                 onOpen: "&?",
-                onRemove: "&?"
+                onRemove: "&?",
+                onEdit: "&?"
             },
             link: link
         };
diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-node-preview.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-node-preview.less
index 667754faaa..ed3bd04f8d 100644
--- a/src/Umbraco.Web.UI.Client/src/less/components/umb-node-preview.less
+++ b/src/Umbraco.Web.UI.Client/src/less/components/umb-node-preview.less
@@ -1,8 +1,6 @@
 .umb-node-preview {
     padding: 7px 0;
-    border-radius: 3px;
     display: flex;
-    align-items: center;
     max-width: 66.6%;
     box-sizing: border-box;
     border-bottom: 1px solid @gray-9;
@@ -37,10 +35,12 @@
 
 .umb-node-preview__content {
     flex: 1 1 auto;
+    margin-right: 25px;
 }
 
 .umb-node-preview__name {
     color: @black;
+    margin-top: 2px;
 }
 
 .umb-node-preview__description {
diff --git a/src/Umbraco.Web.UI.Client/src/views/components/umb-node-preview.html b/src/Umbraco.Web.UI.Client/src/views/components/umb-node-preview.html
index a48d522e3b..b03f4b40c8 100644
--- a/src/Umbraco.Web.UI.Client/src/views/components/umb-node-preview.html
+++ b/src/Umbraco.Web.UI.Client/src/views/components/umb-node-preview.html
@@ -1,10 +1,10 @@
 <div class="umb-node-preview" ng-class="{'umb-node-preview--sortable': sortable, 'umb-node-preview--unpublished': published === false }">
     <i ng-if="icon" class="umb-node-preview__icon {{ icon }}"></i>
     <div class="umb-node-preview__content">
-        <div class="flex items-center">
-            <div class="umb-node-preview__name">{{ name }}</div>
-            <div ng-if="description" class="umb-node-preview__description">{{ description }}</div>
-        </div>
+        
+        <div class="umb-node-preview__name">{{ name }}</div>
+        <div class="umb-node-preview__description" ng-if="description">{{ description }}</div>
+
         <div class="umb-user-group-preview__permission" ng-if="permissions">
             <span>
                 <span class="bold">Permissions:</span>
@@ -13,6 +13,7 @@
         </div>
     </div>
     <div class="umb-node-preview__actions">
+        <a class="umb-node-preview__action" title="Open" href="" ng-if="allowEdit"  ng-click="onEdit()"><localize key="general_edit">Edit</localize></a>
         <a class="umb-node-preview__action" title="Open" href="" ng-if="allowOpen"  ng-click="onOpen()"><localize key="general_open">Open</localize></a>
         <a class="umb-node-preview__action umb-node-preview__action--red" title="Remove" href="" ng-if="allowRemove" ng-click="onRemove()"><localize key="general_remove">Remove</localize></i></a>
     <div>
diff --git a/src/Umbraco.Web.UI.Client/src/views/users/group.controller.js b/src/Umbraco.Web.UI.Client/src/views/users/group.controller.js
index 659a1f0c47..9d58e483e4 100644
--- a/src/Umbraco.Web.UI.Client/src/views/users/group.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/users/group.controller.js
@@ -19,6 +19,7 @@
         vm.clearStartNode = clearStartNode;
         vm.save = save;
         vm.openGranularPermissionsPicker = openGranularPermissionsPicker;
+        vm.setPermissionsForNode = setPermissionsForNode;
 
         function init() {
 
@@ -251,8 +252,10 @@
                     vm.nodePermissions.show = false;
                     vm.nodePermissions = null;
                     // close content picker overlay
-                    vm.contentPicker.show = false;
-                    vm.contentPicker = null;
+                    if(vm.contentPicker) {
+                        vm.contentPicker.show = false;
+                        vm.contentPicker = null;
+                    }
                 },
                 close: function (oldModel) {
                     vm.nodePermissions.show = false;
diff --git a/src/Umbraco.Web.UI.Client/src/views/users/group.html b/src/Umbraco.Web.UI.Client/src/views/users/group.html
index 62ac90d56f..2110d8f1f0 100644
--- a/src/Umbraco.Web.UI.Client/src/views/users/group.html
+++ b/src/Umbraco.Web.UI.Client/src/views/users/group.html
@@ -115,7 +115,9 @@
                                             name="node.name"
                                             permissions="node.allowedPermissions"
                                             allow-remove="true"
-                                            on-remove="vm.removeSelectedItem($index, vm.userGroup.assignedPermissions)">
+                                            on-remove="vm.removeSelectedItem($index, vm.userGroup.assignedPermissions)"
+                                            allow-edit="true"
+                                            on-edit="vm.setPermissionsForNode(node)">
                                         </umb-node-preview>
 
                                         <a href=""