Skip to content

Instantly share code, notes, and snippets.

@confraria
Created October 10, 2017 16:41
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save confraria/3bf347750003310b72820321b6986172 to your computer and use it in GitHub Desktop.
Save confraria/3bf347750003310b72820321b6986172 to your computer and use it in GitHub Desktop.
Question

How can I hide and block access to menu items and plugins based on user role?

When calling addNavigation you can defined two properties showIf and showIfPermissions

c8yNavigatorProvider.addNavigation({
  name: gettext('Example Navigation'),
  icon: 'pencil',
  priority: 1000,
  path: 'example',
  showIf: ShowMenuItemIf, // This is an angular injectable function that should return a promise that resolves in a boolean
  showIfPermissions: { // This object is later on passed to c8yPermission.isAllowed you can check the docs here: http://resources.cumulocity.com/documentation/jssdk/latest/#/api/c8y.core.service:c8yPermissions#methods_isallowed
    anyRole: ['ROLE_INVENTORY_ADMIN'],
    allRoles: ['ROLE_INVENTORY_READ', 'ROLE_USER_READ'],
    readMOs: [':deviceId', 123],
    adminMOs: [':deviceId', 321]
  }
});

// In this function the navigation item will only be visible for the user name 'john'
/* @ngInject */
function ShowMenuItemIf(
  c8yUser
) {
  return c8yUser.current()
    .then(function (u) {
      return u.userName === 'john';
    });
}

How can I create dashboards from my own plugin?

As dashboards as just managed objects you can use the c8yInventory.create to create a managed object at any point of your execution. Here is an example of a managed object for a dashboard. My suggestion is that you construct the dahsboard by hand, and inspect the json for the managed object created. The dashboard id is the last part of this url /group/11100/dashboard/11200. To make sure you only create each dashboard once I suggest you attach a specific key that you can query using a fragmentType filter http://resources.cumulocity.com/documentation/jssdk/latest/#/api/c8y.core.service:c8yInventory#methods_list.

"uniqueKeyCreatedToMakeSureTheDashboardIsOnlyCreatedOnce": {}
"c8y_Dashboard!group!11100": {},
"c8y_Dashboard": {
  "icon": "th",
  "priority": 10000,
  "name": "Dashboard",
  "global": true,
  "isFrozen": true,
  "children": {
    "4960927686925154": {
      "position": 0,
      "id": "4960927686925154",
      "templateUrl": "core_htmlWidget/views/htmlWidget.html",
      "col": 6,
      "title": "HTML",
      "configTemplateUrl": "core_htmlWidget/views/config.html",
      "name": "Html widget",
      "config": {
        "device": {
          "id": "11100",
          "name": "my group"
        },
        "html": "<h1>Example html widget</h1>\n{{device.name}}"
      }
    }
  }
},
"c8y_Global": {}

In alternative you can also use the directive to create a dashboard in any context. We use for example as the home of cockpit.

  <c8y-dashboard-gridstack name="named_dashboard" default-children="DASHBOARD_CHILDREN" set-global="anyUserCanSeeOrOnePerUser" is-frozen="userCanChangeOrNot"></c8y-dashboard-gridstack>
var DASHBOARD_CHILDREN = [
    {
      name: 'Cockpit Welcome',
      title: gettext('Welcome to Cockpit application'),
      _x: 0, _y: 0, _height: 2, _width: 12
    },
    {
      name: 'Asset Alarms',
      title: gettext('Active, critical alarms'),
      _x: 0, _y: 2, _height: 4, _width: 6
    },
    {
      name: 'Recent Alarms',
      title: gettext('Recent alarms'),
      _x: 0, _y: 7, _height: 4, _width: 6
    },
    {
      name: 'Map',
      title: gettext('Map'),
      _x: 6, _y: 2, _height: 8, _width: 6
    }
  ];

How can I change the side bar priority or name?

The c8yNavigator service can give you access to any node. This For example to find the alarms link in devicemanagement we would do:

// This method takes a funcion as an argument. Each navigation item will be passed to that function as single argument and will return the first item for which that function returns true.
var alarmLink = c8yNavigator.findNode(node => node.path === 'alarms');

Then to do changes we change the properties

alarmLink.name = 'New alarms name'
alarmLink.priority = Infinity;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment