add group sharing role create functionality

components/device-mgt/org.wso2.carbon.device.mgt.api/src/main/java/org/wso2/carbon/device/mgt/jaxrs/service/api/GroupManagementService.java

@@ -35,6 +35,7 @@ import org.wso2.carbon.device.mgt.jaxrs.beans.DeviceGroupShare;
 import org.wso2.carbon.device.mgt.jaxrs.beans.DeviceGroupUsersList;
 import org.wso2.carbon.device.mgt.jaxrs.beans.DeviceList;
 import org.wso2.carbon.device.mgt.jaxrs.beans.ErrorResponse;
+import org.wso2.carbon.device.mgt.jaxrs.beans.RoleInfo;
 
 import javax.validation.Valid;
 import javax.ws.rs.Consumes;
@@ -467,6 +468,65 @@ public interface GroupManagementService {
                                      required = true)
                              @PathParam("groupId") int groupId);
 
+
+    @Path("id/{groupId}/roles/create")
+    @POST
+    @ApiOperation(
+            produces = MediaType.APPLICATION_JSON,
+            httpMethod = HTTPConstants.HEADER_GET,
+            value = "Create a group sharing role to a device group.",
+            notes = "Group sharing is done through a group sharing role.",
+            tags = "Device Group Management")
+    @ApiResponses(value = {
+            @ApiResponse(code = 200, message = "OK. \n Successfully created the role.",
+                    response = DeviceGroupUsersList.class,
+                    responseHeaders = {
+                            @ResponseHeader(
+                                    name = "Content-Type",
+                                    description = "The content type of the body"),
+                            @ResponseHeader(
+                                    name = "ETag",
+                                    description = "Entity Tag of the response resource.\n" +
+                                            "Used by caches, or in conditional requests."),
+                            @ResponseHeader(
+                                    name = "Last-Modified",
+                                    description = "Date and time the resource has been modified the last time.\n" +
+                                            "Used by caches, or in conditional requests."),
+                    }),
+            @ApiResponse(
+                    code = 304,
+                    message = "Not Modified. \n Empty body because the client has already the latest version of " +
+                            "the requested resource."),
+            @ApiResponse(
+                    code = 404,
+                    message = "No groups found.",
+                    response = ErrorResponse.class),
+            @ApiResponse(
+                    code = 406,
+                    message = "Not Acceptable.\n The requested media type is not supported."),
+            @ApiResponse(
+                    code = 500,
+                    message = "Internal Server Error. \n Server error occurred while creating the role.",
+                    response = ErrorResponse.class)
+    })
+    @Permission(name = "Create roles", permission = "/device-mgt/groups/roles/create")
+    Response createGroupSharingRole(
+            @ApiParam(
+                    name = "groupId",
+                    value = "ID of the group.",
+                    required = true)
+            @PathParam("groupId") int groupId,
+            @ApiParam(
+                    name = "userName",
+                    value = "User name of the current user.",
+                    required = false)
+            @QueryParam("userName") String userName,
+            @ApiParam(
+                    name = "roleInfo",
+                    value = "Group role information with permissions and users",
+                    required = true)
+            @Valid RoleInfo roleInfo);
+
     @Path("/id/{groupId}/roles")
     @GET
     @ApiOperation(
@@ -621,7 +681,7 @@ public interface GroupManagementService {
                                            required = true)
                                @PathParam("groupId") int groupId);
 
-    @Path("/id/{groupId}/devices")
+    @Path("/id/{groupId}/devices/add")
     @POST
     @ApiOperation(
             produces = MediaType.APPLICATION_JSON,
@@ -672,8 +732,8 @@ public interface GroupManagementService {
                                        required = true)
                                @Valid List<DeviceIdentifier> deviceIdentifiers);
 
-    @Path("/id/{groupId}/devices")
-    @DELETE
+    @Path("/id/{groupId}/devices/remove")
+    @POST
     @ApiOperation(
             produces = MediaType.APPLICATION_JSON,
             httpMethod = HTTPConstants.HEADER_DELETE,

components/device-mgt/org.wso2.carbon.device.mgt.api/src/main/java/org/wso2/carbon/device/mgt/jaxrs/service/api/UserManagementService.java

@@ -408,6 +408,40 @@ public interface UserManagementService {
     @Permission(name = "View Users", permission = "/device-mgt/users/view")
     Response getUserCount();
 
+    @GET
+    @Path("/checkUser")
+    @ApiOperation(
+            produces = MediaType.APPLICATION_JSON,
+            httpMethod = "GET",
+            value = "Getting the User existence status",
+            notes = "Check if the user exists in the user store.",
+            tags = "User Management")
+    @ApiResponses(value = {
+            @ApiResponse(
+                    code = 200,
+                    message = "OK. \n Successfully fetched user exist status.",
+                    response = BasicUserInfoList.class,
+                    responseHeaders = {
+                            @ResponseHeader(
+                                    name = "Content-Type",
+                                    description = "The content type of the body")
+                    }),
+            @ApiResponse(
+                    code = 406,
+                    message = "Not Acceptable.\n The requested media type is not supported",
+                    response = ErrorResponse.class),
+            @ApiResponse(
+                    code = 500,
+                    message = "Internal Server Error. \n Server error occurred while fetching the total user exist status.",
+                    response = ErrorResponse.class)
+    })
+    @Permission(name = "View Users", permission = "/device-mgt/users/view")
+    Response isUserExists(@ApiParam(
+                    name = "username",
+                    value = "The username of the user.",
+                    required = true)
+            @QueryParam("username") String userName);
+
     @GET
     @Path("/search/usernames")
     @ApiOperation(

components/device-mgt/org.wso2.carbon.device.mgt.api/src/main/java/org/wso2/carbon/device/mgt/jaxrs/service/impl/GroupManagementServiceImpl.java

@@ -38,7 +38,8 @@ import org.wso2.carbon.device.mgt.jaxrs.beans.*;
 import org.wso2.carbon.device.mgt.jaxrs.service.api.GroupManagementService;
 import org.wso2.carbon.device.mgt.jaxrs.service.impl.util.RequestValidationUtil;
 import org.wso2.carbon.device.mgt.jaxrs.util.DeviceMgtAPIUtils;
-import org.wso2.carbon.user.core.UserStoreException;
+import org.wso2.carbon.user.api.UserStoreException;
+import org.wso2.carbon.user.api.UserStoreManager;
 import org.wso2.carbon.user.core.multiplecredentials.UserDoesNotExistException;
 
 import javax.ws.rs.core.Response;
@@ -200,11 +201,32 @@ public class GroupManagementServiceImpl implements GroupManagementService {
         }
     }
 
+    @Override
+    public Response createGroupSharingRole(int groupId, String userName, RoleInfo roleInfo) {
+        try {
+            DeviceMgtAPIUtils.getGroupManagementProviderService()
+                    .addGroupSharingRole(userName, groupId, roleInfo.getRoleName(), roleInfo.getPermissions());
+            return Response.status(Response.Status.CREATED).build();
+        } catch (GroupManagementException e) {
+            String msg = "Error occurred while creating group sharing role.";
+            log.error(msg, e);
+            return Response.status(Response.Status.INTERNAL_SERVER_ERROR).entity(msg).build();
+        }
+    }
+
     @Override
     public Response getRolesOfGroup(int groupId, String userName) {
         try {
             List<String> groupRoles;
             if(userName != null) {
+                UserStoreManager userStoreManager = DeviceMgtAPIUtils.getUserStoreManager();
+                if (!userStoreManager.isExistingUser(userName)) {
+                    // returning response with bad request state
+                    return Response.status(Response.Status.CONFLICT).entity(
+                            new ErrorResponse.ErrorResponseBuilder().setMessage("User by username: " +
+                                    userName + " doesn't exists. Therefore, request made to get user " +
+                                    "was refused.").build()).build();
+                }
                 groupRoles = DeviceMgtAPIUtils.getGroupManagementProviderService().getRoles(userName, groupId);
             } else {
                 groupRoles = DeviceMgtAPIUtils.getGroupManagementProviderService().getRoles(groupId);
@@ -275,8 +297,7 @@ public class GroupManagementServiceImpl implements GroupManagementService {
         }
     }
 
-    @Override
-    public Response removeDevicesFromGroup(int groupId, List<DeviceIdentifier> deviceIdentifiers) {
+    @Override public Response removeDevicesFromGroup(int groupId, List<DeviceIdentifier> deviceIdentifiers) {
         try {
             DeviceMgtAPIUtils.getGroupManagementProviderService().removeDevice(groupId, deviceIdentifiers);
             return Response.status(Response.Status.OK).build();

components/device-mgt/org.wso2.carbon.device.mgt.api/src/main/java/org/wso2/carbon/device/mgt/jaxrs/service/impl/UserManagementServiceImpl.java

@@ -359,6 +359,25 @@ public class UserManagementServiceImpl implements UserManagementService {
         }
     }
 
+    @GET
+    @Path("/checkUser")
+    @Override public Response isUserExists(@QueryParam("username") String userName) {
+        try {
+            UserStoreManager userStoreManager = DeviceMgtAPIUtils.getUserStoreManager();
+            boolean userExists = false;
+            if (userStoreManager.isExistingUser(userName)) {
+                userExists = true;
+                return Response.status(Response.Status.OK).entity(userExists).build();
+            } else {
+                return Response.status(Response.Status.OK).entity(userExists).build();
+            }
+        } catch (UserStoreException e) {
+            String msg = "Error while retrieving the user.";
+            log.error(msg, e);
+            return Response.status(Response.Status.INTERNAL_SERVER_ERROR).entity(msg).build();
+        }
+    }
+
     @GET
     @Path("/search/usernames")
     @Override

components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/modules/business-controllers/user.js

@@ -512,9 +512,33 @@ var userModule = function () {
         if (publicMethods.isAuthorized("/permission/admin/device-mgt/users/add")) {
             permissions["ADD_USER"] = true;
         }
+        if (publicMethods.isAuthorized("/permission/admin/device-mgt/groups/devices/add")) {
+            permissions["ADD_GROUP_DEVICES"] = true;
+        }
+        if (publicMethods.isAuthorized("/permission/admin/device-mgt/groups/devices/remove")) {
+            permissions["REMOVE_GROUP_DEVICES"] = true;
+        }
+        if (publicMethods.isAuthorized("/permission/admin/device-mgt/groups/devices/view")) {
+            permissions["VIEW_GROUP_DEVICES"] = true;
+        }
+        if (publicMethods.isAuthorized("/permission/admin/device-mgt/groups/roles/create")) {
+            permissions["CREATE_GROUP_ROLES"] = true;
+        }
+        if (publicMethods.isAuthorized("/permission/admin/device-mgt/groups/roles/view")) {
+            permissions["VIEW_GROUP_ROLES"] = true;
+        }
+        if (publicMethods.isAuthorized("/permission/admin/device-mgt/groups/update")) {
+            permissions["UPDATE_GROUP"] = true;
+        }
+        if (publicMethods.isAuthorized("/permission/admin/device-mgt/groups/share")) {
+            permissions["SHARE_GROUP"] = true;
+        }
         if (publicMethods.isAuthorized("/permission/admin/device-mgt/users/remove")) {
             permissions["REMOVE_USER"] = true;
         }
+        if (publicMethods.isAuthorized("/permission/admin/device-mgt/groups/remove")) {
+            permissions["REMOVE_GROUP"] = true;
+        }
         if (publicMethods.isAuthorized("/permission/admin/device-mgt/roles/add")) {
             permissions["ADD_ROLE"] = true;
         }

components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/pages/cdmf.page.devices/devices.hbs

@@ -190,21 +190,39 @@
                 {{/if}}
 
                 <div id="group-device-modal-content" class="hide">
-                    <div class="modal-content">
-                        <div class="row">
-                            <div class="col-md-3 col-centered">
-                                <h3>Please select group</h3>
+                    <div class="modal-header">
+                        <h3 class="pull-left modal-title">
+                            <span>
+                                <span class="fw-stack">
+                                    <i class="fw fw-ring fw-stack-2x"></i>
+                                    <i class="fw fw-grouping fw-stack-1x"></i>
+                                </span> Device Grouping
+                            </span>
+                        </h3>
+                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i
+                                class="fw fw-cancel"></i></button>
+                    </div>
+                    <div class="modal-body add-margin-top-2x add-margin-bottom-2x">
+                        <div id="notification-error-msg" class="alert alert-danger hidden" role="alert">
+                            <i class="icon fw fw-error"></i><span></span>
+                        </div>
+                        <div>
+                            <h4>
+                                Please select group
+                                <br>
                                 <div id="user-groups">Loading...</div>
-                                <div class="buttons">
-                                    <a href="#" id="group-device-yes-link" class="btn-operations">
-                                        Assign
-                                    </a>
+                            </h4>
+                        </div>
+                    </div>
+                    <div class="modal-footer">
+                        <div class="buttons">
+                            <a href="#" id="group-device-yes-link" class="btn-operations">
+                                Assign
+                            </a>
 
-                                    <a href="#" id="group-device-cancel-link" class="btn-operations btn-default">
-                                        Cancel
-                                    </a>
-                                </div>
-                            </div>
+                            <a href="#" id="group-device-cancel-link" class="btn-operations btn-default">
+                                Cancel
+                            </a>
                         </div>
                     </div>
                 </div>
@@ -273,6 +291,25 @@
                     </div>
                 </div>
 
+                <div id="remove-device-from-group-200-content" class="hide">
+                    <div class="modal-header">
+                        <h3 class="pull-left modal-title">
+                            Device was successfully removed from group.
+                        </h3>
+                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i
+                                class="fw fw-cancel"></i>
+                        </button>
+                    </div>
+                    <div class="modal-body add-margin-top-2x add-margin-bottom-2x">
+
+                    </div>
+                    <div class="modal-footer">
+                        <div class="buttons">
+                            <a href="javascript:hidePopup()" class="btn-operations">Ok</a>
+                        </div>
+                    </div>
+                </div>
+
                 <div id="edit-device-modal-content" class="hide">
                     <div class="modal-header">
                         <h3 class="pull-left modal-title">

components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/pages/cdmf.page.devices/public/js/listing.js

@@ -51,7 +51,7 @@ function InitiateViewOption(url) {
 var deviceCheckbox = "#ast-container .ctrl-wr-asset .itm-select input[type='checkbox']";
 var assetContainer = "#ast-container";
 
-var deviceListing, currentUser, groupName, groupOwner;
+var deviceListing, currentUser, groupName, groupId;
 
 /*
  * DOM ready functions.
@@ -71,7 +71,7 @@ $(document).ready(function () {
     currentUser = deviceListing.data("current-user");
 
     groupName = getParameterByName("groupName");
-    groupOwner = getParameterByName("groupOwner");
+    groupId = getParameterByName("groupId");
 
     /* Adding selected class for selected devices */
     $(deviceCheckbox).each(function () {
@@ -161,9 +161,9 @@ function toTitleCase(str) {
 
 function loadDevices(searchType, searchParam) {
     var serviceURL;
-    if (groupName && groupOwner && permissionsUtil.hasPermission("LIST_OWN_DEVICES")) {
-        serviceURL = "/api/device-mgt/v1.0/groups/owner/" + groupOwner + "/name/" + groupName + "/devices";
-    } else if (permissionsUtil.hasPermission("LIST_DEVICES")) {
+    if (groupName && groupId && $.hasPermission("LIST_OWN_DEVICES")) {
+        serviceURL = "/api/device-mgt/v1.0/groups/id/" + groupId + "/devices";
+    } else if ($.hasPermission("LIST_DEVICES")) {
         serviceURL = "/api/device-mgt/v1.0/devices";
     } else if (permissionsUtil.hasPermission("LIST_OWN_DEVICES")) {
         //Get authenticated users devices
@@ -351,7 +351,7 @@ function loadDevices(searchType, searchParam) {
                             '<span class="hidden-xs hidden-on-grid-view">Analytics</span>';
                     }
 
-                    if (groupingEnabled(deviceType) && (!groupName || !groupOwner)) {
+                    if (!groupName || !groupId) {
                         html +=
                             '<a href="#" data-click-event="remove-form" class="btn padding-reduce-on-grid-view group-device-link" '
                             +
@@ -602,8 +602,8 @@ function attachDeviceEvents() {
                 $("a#group-device-yes-link").show();
                 $("a#group-device-yes-link").click(function () {
                     var selectedGroup = $('#assign-group-selector').val();
-                    serviceURL = "/api/device-mgt/v1.0/groups/id/" + selectedGroup + "/devices";
-                    var deviceIdentifiers = [{"id":deviceId,"type":deviceType}];
+                    serviceURL = "/api/device-mgt/v1.0/groups/id/" + selectedGroup + "/devices/add";
+                    var deviceIdentifiers = [{"id": deviceId, "type": deviceType}];
                     invokerUtil.post(serviceURL, deviceIdentifiers, function (data) {
                         $(modalPopupContent).html($('#group-associate-device-200-content').html());
                         setTimeout(function () {
@@ -646,15 +646,29 @@ function attachDeviceEvents() {
         showPopup();
 
         $("a#remove-device-yes-link").click(function () {
-            invokerUtil.delete(serviceURL, function (message) {
-                $(modalPopupContent).html($('#remove-device-200-content').html());
-                setTimeout(function () {
-                    hidePopup();
-                    location.reload(false);
-                }, 2000);
-            }, function (message) {
-                displayDeviceErrors(jqXHR);
-            });
+            if(groupId && groupName) {
+                var deviceIdentifiers = [{"id": deviceId,"type": deviceType}];
+                serviceURL = "/api/device-mgt/v1.0/groups/id/" + groupId + "/devices/remove";
+                invokerUtil.post(serviceURL, deviceIdentifiers, function (message) {
+                    $(modalPopupContent).html($('#remove-device-from-group-200-content').html());
+                    setTimeout(function () {
+                        hidePopup();
+                        location.reload(false);
+                    }, 2000);
+                }, function (message) {
+                    displayDeviceErrors(message);
+                });
+            } else {
+                invokerUtil.delete(serviceURL, function (message) {
+                    $(modalPopupContent).html($('#remove-device-200-content').html());
+                    setTimeout(function () {
+                        hidePopup();
+                        location.reload(false);
+                    }, 2000);
+                }, function (message) {
+                    displayDeviceErrors(jqXHR);
+                });
+            }
         });
 
         $("a#remove-device-cancel-link").click(function () {

components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/pages/cdmf.page.groups/groups.hbs

@@ -18,6 +18,7 @@
 {{unit "cdmf.unit.ui.title" pageTitle="Group Management"}}
 {{unit "cdmf.unit.ui.content.title" pageHeader="Groups"}}
 
+{{unit "cdmf.unit.lib.service-invoker-utility"}}
 {{unit "cdmf.unit.data-tables-extended"}}
 {{unit "cdmf.unit.lib.ui-permissions-utility"}}
 
@@ -96,46 +97,140 @@
                 {{/if}}
 
                 <div id="share-group-w1-modal-content" class="hide">
-                    <div class="content">
-                        <div class="row">
-                            <div class="col-lg-5 col-md-6 col-centered">
-                                <h3>Enter user name to manage group sharing</h3>
-                                <div id="user-names">
-                                    <br />
-                                    <input type="text" id="share-user-selector" style="color:#3f3f3f;padding:5px;width:250px;">
-                                    </input>
-                                </div>
-                                <div class="buttons">
-                                    <a href="#" id="share-group-next-link" class="btn-operations">
-                                        Next
-                                    </a>
+                    <div class="modal-header">
+                        <h3 class="pull-left modal-title">
+                            <span>
+                                <span class="fw-stack">
+                                    <i class="fw fw-ring fw-stack-2x"></i>
+                                    <i class="fw fw-share fw-stack-1x"></i>
+                                </span> Group Sharing
+                            </span>
+                        </h3>
+                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i
+                                class="fw fw-cancel"></i></button>
+                    </div>
+                    <div class="modal-body add-margin-top-2x add-margin-bottom-2x">
+                        <div id="notification-error-msg" class="alert alert-danger hidden" role="alert">
+                            <i class="icon fw fw-error"></i><span></span>
+                        </div>
+                        <div id="user-names">
+                            <h4>
+                                Enter user name to manage group sharing
+                                <br><br>
+                                <input type="text" id="share-user-selector" class="form-control modal-input operationDataKeys">
+                                </input>
+                            </h4>
+                        </div>
+                    </div>
+                    <div class="modal-footer">
+                        <div class="buttons">
+                            <a href="#" id="share-group-next-link" class="btn-operations">
+                                Next
+                            </a>
 
-                                    <a href="#" id="share-group-w1-cancel-link" class="btn-operations btn-default">
-                                        Cancel
-                                    </a>
-                                </div>
-                            </div>
+                            <a href="#" id="share-group-w1-cancel-link" class="btn-operations btn-default">
+                                Cancel
+                            </a>
                         </div>
                     </div>
                 </div>
 
                 <div id="share-group-w2-modal-content" class="hide">
-                    <div class="content">
-                        <div class="row">
-                            <div class="col-lg-5 col-md-6 col-centered">
-                                <h3>Select sharing roles</h3>
-                                <br/>
-                                <div id="user-roles">Loading...</div>
-                                <div class="buttons">
-                                    <a href="#" id="share-group-yes-link" class="btn-operations">
-                                        OK
-                                    </a>
-
-                                    <a href="#" id="share-group-w2-cancel-link" class="btn-operations btn-default">
-                                        Cancel
-                                    </a>
-                                </div>
+                    <div class="modal-header">
+                        <h3 class="pull-left modal-title">
+                            <span>
+                                <span class="fw-stack">
+                                    <i class="fw fw-ring fw-stack-2x"></i>
+                                    <i class="fw fw-share fw-stack-1x"></i>
+                                </span> Group Sharing
+                            </span>
+                        </h3>
+                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i
+                                class="fw fw-cancel"></i></button>
+                    </div>
+                    <div class="modal-body add-margin-top-2x add-margin-bottom-2x">
+                        <div id="notification-error-msg" class="alert alert-danger hidden" role="alert">
+                            <i class="icon fw fw-error"></i><span></span>
+                        </div>
+                        <div id="user-roles">
+                            <h4>
+                                Select sharing roles
+                                <br><br>
+                            </h4>
+                        </div>
+                        {{#if permissions.CREATE_GROUP_ROLES}}
+                            <div class="buttons">
+                                <a href="#" id="share-group-w2-add-new-role-link" class="btn-operations">
+                                    <span class="fw-stack"><i class="fw fw-ring fw-stack-2x"></i><i class="fw fw-add fw-stack-1x"></i></span> Add New Role
+                                </a>
                             </div>
+                        {{/if}}
+                    </div>
+                    <div class="modal-footer">
+                        <div class="buttons">
+                            <a href="#" id="share-group-yes-link" class="btn-operations">
+                                OK
+                            </a>
+
+                            <a href="#" id="share-group-w2-cancel-link" class="btn-operations btn-default">
+                                Cancel
+                            </a>
+
+                        </div>
+                    </div>
+                </div>
+
+                <div id="share-group-w3-modal-content" class="hide">
+                    <div class="modal-header">
+                        <h3 class="pull-left modal-title">
+                            <span>
+                                <span class="fw-stack">
+                                    <i class="fw fw-ring fw-stack-2x"></i>
+                                    <i class="fw fw-bookmark fw-stack-1x"></i>
+                                </span> Group Sharing Role
+                            </span>
+                        </h3>
+                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i
+                                class="fw fw-cancel"></i></button>
+                    </div>
+                    <div class="modal-body add-margin-top-2x add-margin-bottom-2x">
+                        <div id="notification-error-msg" class="alert alert-danger hidden" role="alert">
+                            <i class="icon fw fw-error"></i><span></span>
+                        </div>
+                        <div id="user-roles">
+                            <h4>
+                                Enter Group Sharing Role Name
+                                <br><br>
+                                <input type="text" id="group-sharing-role-name" class="form-control modal-input operationDataKeys"/>
+                                <br><br>
+                                Role Permissions
+                                <br><br>
+                            </h4>
+                            <table class="table">
+                                <tbody id="permission-table-container">
+                                {{#each groupPermissions}}
+                                    <tr>
+                                        <td>{{this}}</td>
+                                        <td>
+                                            <a href="#" class="btn-operations btn-default" onclick="togglePermissionAction(this)" data-value="unchecked">
+                                                <span class="fw-stack"><i class="fw fw-ring fw-stack-2x"></i><i class="fw fw-add fw-stack-1x"></i></span>
+                                            </a>
+                                        </td>
+                                    </tr>
+                                {{/each}}
+                                </tbody>
+                            </table>
+                        </div>
+                    </div>
+                    <div class="modal-footer">
+                        <div class="buttons">
+                            <a href="#" id="share-group-w3-yes-link" class="btn-operations">
+                                OK
+                            </a>
+
+                            <a href="#" id="share-group-w3-cancel-link" class="btn-operations btn-default">
+                                Cancel
+                            </a>
                         </div>
                     </div>
                 </div>
@@ -181,34 +276,46 @@
                 </div>
 
                 <div id="edit-group-modal-content" class="hide">
-                    <div class="content">
-                        <div class="row">
-                            <div class="col-lg-5 col-md-6 col-centered">
-                                <h3>Please enter new name and description for the group</h3>
-                                <br/>
-
-                                <div>
-                                    <input id="edit-group-name" style="color:#3f3f3f;padding:5px" type="text"
-                                           value=""
-                                           placeholder="Group Name" size="60">
-                                </div>
-                                <br/>
-
-                                <div>
-                                    <input id="edit-group-description" style="color:#3f3f3f;padding:5px" type="text"
-                                           value=""
-                                           placeholder="Group Description" size="60">
-                                </div>
-                                <div class="buttons">
-                                    <a href="#" id="edit-group-yes-link" class="btn-operations">
-                                        Update
-                                    </a>
+                    <div class="modal-header">
+                        <h3 class="pull-left modal-title">
+                            <span>
+                                <span class="fw-stack">
+                                    <i class="fw fw-ring fw-stack-2x"></i>
+                                    <i class="fw fw-edit fw-stack-1x"></i>
+                                </span> Update Group
+                            </span>
+                        </h3>
+                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i
+                                class="fw fw-cancel"></i></button>
+                    </div>
+                    <div class="modal-body add-margin-top-2x add-margin-bottom-2x">
+                        <div id="notification-error-msg" class="alert alert-danger hidden" role="alert">
+                            <i class="icon fw fw-error"></i><span></span>
+                        </div>
+                        <div>
+                            <h4>
+                                Enter new name and description for the group
+                                <br><br>
+                                <input type="text" id="edit-group-name"
+                                       class="form-control modal-input operationDataKeys" placeholder="Group Name"
+                                       value="">
+                                </input>
+                                <br>
+                                <input type="text" id="edit-group-description"
+                                       class="form-control modal-input operationDataKeys"
+                                       placeholder="Group Description" value="">
+                            </h4>
+                        </div>
+                    </div>
+                    <div class="modal-footer">
+                        <div class="buttons">
+                            <a href="#" id="edit-group-yes-link" class="btn-operations">
+                                Update
+                            </a>
 
-                                    <a href="#" id="edit-group-cancel-link" class="btn-operations btn-default">
-                                        Cancel
-                                    </a>
-                                </div>
-                            </div>
+                            <a href="#" id="edit-group-cancel-link" class="btn-operations btn-default">
+                                Cancel
+                            </a>
                         </div>
                     </div>
                 </div>

components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/pages/cdmf.page.groups/groups.js

@@ -20,11 +20,13 @@ function onRequest(context) {
     var groupModule = require("/app/modules/business-controllers/group.js")["groupModule"];
     var userModule = require("/app/modules/business-controllers/user.js")["userModule"];
     var constants = require("/app/modules/constants.js");
+    var groupPermissions = require("/app/pages/cdmf.page.groups/public/group-permissions.json");
     var currentUser = session.get(constants.USER_SESSION_KEY);
     var page = {};
     if (currentUser) {
         page.permissions = userModule.getUIPermissions();
         page.permissions.list = stringify(page.permissions);
+        page.groupPermissions = groupPermissions.permissionList;
         page.currentUser = currentUser;
         var groupCount = groupModule.getGroupCount();
         if (groupCount > 0) {

components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/pages/cdmf.page.groups/public/group-permissions.json

@@ -0,0 +1,15 @@
+{
+    "permissionList":["device-mgt/admin/groups/view",
+        "device-mgt/groups/add",
+        "device-mgt/groups/devices/add",
+        "device-mgt/groups/devices/remove",
+        "device-mgt/groups/devices/view",
+        "device-mgt/groups/remove",
+        "device-mgt/groups/roles/create",
+        "device-mgt/groups/roles/view",
+        "device-mgt/groups/share",
+        "device-mgt/groups/update",
+        "device-mgt/groups/users/view",
+        "device-mgt/groups/view"
+    ]
+}

components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/pages/cdmf.page.groups/public/js/listing.js

@@ -154,26 +154,38 @@ function loadGroups() {
             class: 'text-right content-fill text-left-on-grid-view no-wrap',
             render: function (id, type, row, meta) {
                 var html;
-                html = '<a href="devices?groupId=' + row.groupId + '&groupName=' + row.name + '" data-click-event="remove-form" class="btn padding-reduce-on-grid-view">' +
-                    '<span class="fw-stack"><i class="fw fw-ring fw-stack-2x"></i><i class="fw fw-view fw-stack-1x"></i></span>' +
-                    '<span class="hidden-xs hidden-on-grid-view">View Devices</span></a>';
-
-                html += '<a href="group/' + row.name + '/' + row.groupId + '/analytics" data-click-event="remove-form" class="btn padding-reduce-on-grid-view">' +
-                    '<span class="fw-stack"><i class="fw fw-ring fw-stack-2x"></i><i class="fw fw-statistics fw-stack-1x"></i></span>' +
-                    '<span class="hidden-xs hidden-on-grid-view">Analytics</span></a>';
-
-                html += '<a href="#" data-click-event="remove-form" class="btn padding-reduce-on-grid-view share-group-link" data-group-id="' + row.groupId + '" ' +
-                    'data-group-owner="' + row.owner + '"><span class="fw-stack"><i class="fw fw-ring fw-stack-2x"></i><i class="fw fw-share fw-stack-1x"></i></span>' +
-                    '<span class="hidden-xs hidden-on-grid-view">Share</span></a>';
-
-                html += '<a href="#" data-click-event="remove-form" class="btn padding-reduce-on-grid-view edit-group-link" data-group-name="' + row.name + '" ' +
-                    'data-group-owner="' + row.owner + '" data-group-description="' + row.description + '" data-group-id="'+row.groupId+'"><span class="fw-stack"><i class="fw fw-ring fw-stack-2x"></i>' +
-                    '<i class="fw fw-edit fw-stack-1x"></i></span><span class="hidden-xs hidden-on-grid-view">Edit</span></a>';
-
-                html += '<a href="#" data-click-event="remove-form" class="btn padding-reduce-on-grid-view remove-group-link" data-group-id="' + row.groupId + '" ' +
-                    'data-group-owner="' + row.owner + '"><span class="fw-stack"><i class="fw fw-ring fw-stack-2x"></i><i class="fw fw-delete fw-stack-1x"></i>' +
-                    '</span><span class="hidden-xs hidden-on-grid-view">Delete</span></a>';
-
+                if ($.hasPermission("VIEW_GROUP_DEVICES")){
+                    html = '<a href="devices?groupId=' + row.groupId + '&groupName=' + row.name + '" data-click-event="remove-form" class="btn padding-reduce-on-grid-view">' +
+                        '<span class="fw-stack"><i class="fw fw-ring fw-stack-2x"></i><i class="fw fw-view fw-stack-1x"></i></span>' +
+                        '<span class="hidden-xs hidden-on-grid-view">View Devices</span></a>';
+
+                    html += '<a href="group/' + row.name + '/' + row.groupId + '/analytics" data-click-event="remove-form" class="btn padding-reduce-on-grid-view">' +
+                        '<span class="fw-stack"><i class="fw fw-ring fw-stack-2x"></i><i class="fw fw-statistics fw-stack-1x"></i></span>' +
+                        '<span class="hidden-xs hidden-on-grid-view">Analytics</span></a>';
+                } else {
+                    html = '';
+                }
+                if($.hasPermission("SHARE_GROUP")) {
+                    html += '<a href="#" data-click-event="remove-form" class="btn padding-reduce-on-grid-view share-group-link" data-group-id="' + row.groupId + '" ' +
+                        'data-group-owner="' + row.owner + '"><span class="fw-stack"><i class="fw fw-ring fw-stack-2x"></i><i class="fw fw-share fw-stack-1x"></i></span>' +
+                        '<span class="hidden-xs hidden-on-grid-view">Share</span></a>';
+                } else {
+                    html += '';
+                }
+                if($.hasPermission("UPDATE_GROUP")) {
+                    html += '<a href="#" data-click-event="remove-form" class="btn padding-reduce-on-grid-view edit-group-link" data-group-name="' + row.name + '" ' +
+                        'data-group-owner="' + row.owner + '" data-group-description="' + row.description + '" data-group-id="' + row.groupId + '"><span class="fw-stack"><i class="fw fw-ring fw-stack-2x"></i>' +
+                        '<i class="fw fw-edit fw-stack-1x"></i></span><span class="hidden-xs hidden-on-grid-view">Edit</span></a>';
+                } else {
+                    html += '';
+                }
+                if ($.hasPermission("REMOVE_GROUP")) {
+                    html += '<a href="#" data-click-event="remove-form" class="btn padding-reduce-on-grid-view remove-group-link" data-group-id="' + row.groupId + '" ' +
+                        'data-group-owner="' + row.owner + '"><span class="fw-stack"><i class="fw fw-ring fw-stack-2x"></i><i class="fw fw-delete fw-stack-1x"></i>' +
+                        '</span><span class="hidden-xs hidden-on-grid-view">Delete</span></a>';
+                } else {
+                    html += '';
+                }
                 return html;
             }
         }
@@ -237,6 +249,17 @@ function openCollapsedNav() {
  * DOM ready functions.
  */
 $(document).ready(function () {
+    var permissionSet = {};
+
+    //This method is used to setup permission for device listing
+    $.setPermission = function (permission) {
+        permissionSet[permission] = true;
+    };
+
+    $.hasPermission = function (permission) {
+        return permissionSet[permission];
+    };
+
     var permissionList = $("#permission").data("permission");
     for (var key in permissionList) {
         if (permissionList.hasOwnProperty(key)) {
@@ -321,7 +344,6 @@ function hidePopup() {
  * Following functions should be triggered after AJAX request is made.
  */
 function attachEvents() {
-
     /**
      * Following click function would execute
      * when a user clicks on "Share" link
@@ -334,12 +356,25 @@ function attachEvents() {
         $("a#share-group-next-link").show();
         showPopup();
         $("a#share-group-next-link").click(function () {
+            var successCallback = function (data) {
+                if(data === 'true') {
+                    getAllRoles(groupId, selectedUser);
+                } else {
+                    var errorMsgWrapper = "#notification-error-msg";
+                    var errorMsg = "#notification-error-msg span";
+                    $(errorMsg).text("User does not exist.");
+                    $(errorMsgWrapper).removeClass("hidden");
+                }
+            }
             var selectedUser = $('#share-user-selector').val();
             if (selectedUser == $("#group-listing").data("current-user")) {
                 $("#user-names").html("Please specify a user other than current user.");
                 $("a#share-group-next-link").hide();
             } else {
-                getAllRoles(groupId, selectedUser);
+                invokerUtil.get("/api/device-mgt/v1.0/users/checkUser?username=" + selectedUser,
+                    successCallback, function (message) {
+                        displayErrors(message);
+                    });
             }
         });
         $("a#share-group-w1-cancel-link").click(function () {
@@ -431,7 +466,6 @@ function attachEvents() {
 
 function getAllRoles(groupId, selectedUser) {
     $(modalPopupContent).html($('#share-group-w2-modal-content').html());
-    $('#user-roles').html('<div style="height:100px" data-state="loading" data-loading-text="Loading..." data-loading-style="icon-only" data-loading-inverse="true"></div>');
     $("a#share-group-yes-link").hide();
     var successCallback = function (data, textStatus, xhr) {
         data = JSON.parse(data);
@@ -464,7 +498,7 @@ function generateRoleMap(groupId, selectedUser, allRoles) {
             if(data != "EMPTY") {
                 userRoles = data.roles;
             }
-            var str = '';
+            var str = $('#user-roles').html();
 
             for (var i = 0; i < allRoles.length; i++) {
                 var isChecked = '';
@@ -474,8 +508,8 @@ function generateRoleMap(groupId, selectedUser, allRoles) {
                         break;
                     }
                 }
-                str += '<label class="checkbox-text"><input type="checkbox" id="user-role-' + allRoles[i] + '" value="' + allRoles[i]
-                       + '" ' + isChecked + '/>' + allRoles[i] + '</label>';
+                str += '<label class="wr-input-control checkbox"><input type="checkbox" class="form-control modal-input operationDataKeys" id="user-role-' + allRoles[i] + '" value="' + allRoles[i]
+                       + '" ' + isChecked + '/>' +'<span class="helper" title="Check to share this group role with user."> &nbsp;&nbsp;&nbsp;'+ allRoles[i] + '</span></label><br><br>';
             }
 
             $('#user-roles').html(str);
@@ -490,6 +524,9 @@ function generateRoleMap(groupId, selectedUser, allRoles) {
                 }
                 updateGroupShare(groupId, selectedUser, roles);
             });
+            $("a#share-group-w2-add-new-role-link").click(function () {
+                addNewRole(groupId, selectedUser, allRoles);
+            });
         } else {
             displayErrors(xhr);
         }
@@ -497,7 +534,7 @@ function generateRoleMap(groupId, selectedUser, allRoles) {
 
     invokerUtil.get("/api/device-mgt/v1.0/groups/id/" + groupId + "/roles?userName=" + selectedUser,
         successCallback, function (message) {
-                displayErrors(message);
+            displayErrors(message);
         });
 
     $("a#share-group-w2-cancel-link").click(function () {
@@ -505,6 +542,63 @@ function generateRoleMap(groupId, selectedUser, allRoles) {
     });
 }
 
+function addNewRole(groupId, selectedUser, allRoles) {
+    $(modalPopupContent).html($('#share-group-w3-modal-content').html());
+    function getPermissions() {
+        var PERMISSION_PREFIX = '/permission/admin/';
+        var permissions = [];
+        $('#permission-table-container').find('tr').each(function () {
+            var row = $(this).closest('tr');
+            var permission = $(row).find('td:nth-child(1)').text();
+            var check = $(row).find('td:nth-child(2) a').data('value');
+            if(check === 'checked') {
+                permission = PERMISSION_PREFIX + permission;
+                permissions.push(permission);
+            }
+        });
+        return permissions;
+    };
+    $("a#share-group-w3-yes-link").click(function () {
+        var successCallback = function (data, status, jqXHR) {
+            if(status == "success") {
+                getAllRoles(groupId, selectedUser);
+            }
+        }
+        var roleName = $('#group-sharing-role-name').val();
+        var users = [];
+        if(roleName) {
+            var groupRoleInfo = {"roleName": roleName, "permissions": getPermissions(), "users": users};
+            var currentUser = $("#group-listing").data("current-user");
+            invokerUtil.post("/api/device-mgt/v1.0/groups/id/" + groupId + "/roles/create?userName=" + currentUser,
+                groupRoleInfo, successCallback, function (message) {
+                    displayErrors(message);
+                });
+        } else {
+            var errorMsgWrapper = "#notification-error-msg";
+            var errorMsg = "#notification-error-msg span";
+            $(errorMsg).text("Role name cannot be empty.");
+            $(errorMsgWrapper).removeClass("hidden");
+        }
+    });
+    $("a#share-group-w3-cancel-link").click(function () {
+        hidePopup();
+    });
+}
+
+function togglePermissionAction(element) {
+    $(element).data('value', 'checked');
+    var icon = $(element).find("i")[1];
+    if($(icon).hasClass('fw-minus')) {
+        $(icon).removeClass('fw-minus');
+        $(icon).addClass('fw-add');
+        $(element).data('value', 'unchecked');
+    } else {
+        $(icon).removeClass('fw-add');
+        $(icon).addClass('fw-minus');
+        $(element).data('value', 'checked');
+    }
+}
+
 function updateGroupShare(groupId, selectedUser, roles) {
     var successCallback = function (data) {
         $(modalPopupContent).html($('#share-group-200-content').html());