Microsoft Graph

Overview

You can integrate data from Microsoft Graph to LiveTiles Intranet Hub by using the Graph Data Provider configuration. The Microsoft Graph API will be used to retrieve the data.

Data Provider

The Graph Data Provider configuration requires the following parameters that you need to specify:

• configTypeKey: The unique key of the data provider.
• propertyMappings: The unique key of the property mapper.
• resource: The path to the Microsoft Graph API for the desired data.
• version: the version of the Microsoft Graph API that will be used. At the time of writing the following versions were avialable: 1.0. It is recommended to use the latest stable version that is available for the type of data you wish to retreive.
• filter: Filters that will be applied to the query.
• additionalQueryParams: Any additional parameters for the query.
• orderBy: An array of field names to order the data by.
• rowLimit: The limit for the retrieved number of items.
• connectableKey: A key for the Intranet Hub connectable API.
• viewAllUrlExpression: [Optional] An expression to return the view all url of the retrieved data.

Have a look at the reference for more information about the GraphDataProviderConfig.

Data Source

Besides the data provider, there is also an Graph Data Source with four configurable properties:

• configTypeKey: The unique key of the data source
• propertyMappingsKey: The unique key of the property mapper
• orderByProperties: [Optional] An array of field names to order the data by.
• filter: [Optional] Filters that will be applied to the query.
• queryType: [Optional] The type of query you want to perform: RecentlyUsed or Trending. You can find more details about the GraphDataSourceUserConfig in the reference.

Planner Tasks

You can retrieve Planner tasks via a Data Provider or a Data Source.
For this, the following permissions are required, which have to be approved in SharePoint Online Administration Center of your Microsoft 365 Tenant:

App: Microsoft Graph
Permission: Group.Read.All

Examples

Data Provider

Below you can see a sample configuration where the Graph Data Provider is used within a Content Items Web Part:

"MyWidget": {
  "configTypeKey": "widget_contentItems",
  "title": {
    "de": "Aufgaben",
    "en": "Tasks"
  },
  "tabs": [
    {
      "title": {
        "de": "Aufgaben",
        "en": "Tasks"
      },
      "data": {
        "configTypeKey": "dataProvider_graph",
        "version": "v1.0",
        "rowLimit": 30,
        "propertyMappings": "propertyMapper_graph_task_simple",
        "resource": "/me/planner/tasks"
      },
      "layoutTemplate": {
        "configTypeKey": "layoutTemplate_list",
        "columns": 1
      },
      "itemTemplate": {
        "configTypeKey": "itemTemplate_simple",
        "imageWidth": "2.5rem",
        "imageDisplayMode": "Round"
      }
    }
  ]
}

Data Source

Sample configuration of a Content Items Web Part with the Graph Data Source:

"MyWidget": {
  "configTypeKey": "widget_contentItems",
  "title": {
    "de": "Aufgaben",
    "en": "Tasks"
  },
  "tabs": [
    {
      "title": {
        "de": "Aufgaben",
        "en": "Tasks"
      },
      "data": {
        "contentType": "Task",
        "dataSource": {
          "configTypeKey": "userDataSource_graph",
          "propertyMappingsKey": "propertyMapper_graph_task_simple"
        }
      },
      "layoutTemplate": {
        "configTypeKey": "layoutTemplate_list",
        "columns": 1
      },
      "itemTemplate": {
        "configTypeKey": "itemTemplate_simple",
        "imageWidth": "2.5rem",
        "imageDisplayMode": "Round"
      }
    }
  ]
}