How to hide "Settings" gear icon for non-admin users?

Org Chart Microsoft 365 version
1

I like what I saw so far and thinking to propose my company to purchase this Org Chart for Office 365.
We want to put this app on Home page and want to make sure that everyone can use the features e.g. filter by name, expand/collapse levels.

However, we don’t want non-admin users to modify its settings like color/theme, number of levels to display etc…

Is there a way to achieve this requirement ?

2

Hi,

Thank you for your question.

It is hidden from non-admin users by default. It is only visible to users with Full Control (Manage web) permissions.

3

Hi,

Is there a way to hide it for “Manage Web” permissions holders and only enable or make it visible for Site Collection Admins ?

Thank you,
Sraddhan

4

You can do it using JavaScript. Below is the code that you will need to paste into the Custom JavaScript editor in the configuration wizard.

Org Chart v3:

function checkManageWebPermissions(completed){

    var clientContext = new SP.ClientContext(window.location.pathname);

    var web = clientContext.get_web();
    var perms = new SP.BasePermissions();
    perms.set(SP.PermissionKind.manageWeb);
    var checkResult = web.doesUserHavePermissions(perms);

    clientContext.executeQueryAsync(() => {
        var result = checkResult.get_value();
        completed(result)
    }, () => {
        console.log('Unable to detect permissions for current user.');
    });

}

renderer.onLoadingFinished(function(){
    
    //Hide menu item by default
    var $settingsMenuItem = renderer.querySelector(".poch-expanding-menu-item");
    $settingsMenuItem.hide();

    checkManageWebPermissions((hasAccess) => {

        //Show menu item if the user has manage site permissions
        if(false){
            $settingsMenuItem.show();

            console.log("User has access");
        } else {
            console.log("User doesn't have access");
        }

    });
    
});

Org Chart v4:

function checkManageWebPermissions(completed){

    var clientContext = new SP.ClientContext(window.location.pathname);

    var web = clientContext.get_web();
    var perms = new SP.BasePermissions();
    perms.set(SP.PermissionKind.manageWeb);
    var checkResult = web.doesUserHavePermissions(perms);

    clientContext.executeQueryAsync(() => {
        var result = checkResult.get_value();
        completed(result)
    }, () => {
        console.log('Unable to detect permissions for current user.');
    });

}

api.onLoadingFinished(() => {
    
    //Hide menu item by default
    var $settingsMenuItem = $(".poch-expanding-menu-item");
    $settingsMenuItem.hide();

    checkManageWebPermissions((hasAccess) => {

        //Show menu item if the user has manage site permissions
        if(false){
            $settingsMenuItem.show();

            console.log("User has access");
        } else {
            console.log("User doesn't have access");
        }

    });
    
});