CtrlK
BlogDocsLog inGet started
Tessl Logo

tessl/npm-arduino--arduino-iot-client

JavaScript client library for the Arduino IoT Cloud REST API enabling programmatic management of devices, things, properties, and time-series data

Overview
Eval results
Files

dashboard-management.mddocs/

Dashboard Management

Visual dashboard creation, widget management, and sharing capabilities. Dashboards provide web-based visualization and control interfaces for IoT things and their properties.

Capabilities

Core Dashboard Operations

Primary dashboard management functionality for creating and managing visual interfaces.

class DashboardsV2Api {
  /**
   * Create a new dashboard
   * @param dashboardv2 - Dashboard configuration including widgets and layout
   * @param opts - Optional parameters including organization ID
   * @returns Promise<ArduinoDashboardv2> - Created dashboard object
   */
  dashboardsV2Create(dashboardv2: Dashboardv2, opts?: any): Promise<ArduinoDashboardv2>;

  /**
   * List all dashboards accessible to the authenticated user
   * @param opts - Optional parameters including organization ID and pagination
   * @returns Promise<ArduinoDashboardv2[]> - Array of dashboard objects
   */
  dashboardsV2List(opts?: any): Promise<ArduinoDashboardv2[]>;

  /**
   * Get detailed information about a specific dashboard
   * @param id - Dashboard ID
   * @param opts - Optional parameters including organization ID
   * @returns Promise<ArduinoDashboardv2> - Dashboard object with full details
   */
  dashboardsV2Show(id: string, opts?: any): Promise<ArduinoDashboardv2>;

  /**
   * Update dashboard configuration and layout
   * @param id - Dashboard ID
   * @param dashboardv2 - Updated dashboard configuration
   * @param opts - Optional parameters including organization ID
   * @returns Promise<ArduinoDashboardv2> - Updated dashboard object
   */
  dashboardsV2Update(id: string, dashboardv2: Dashboardv2, opts?: any): Promise<ArduinoDashboardv2>;

  /**
   * Partial update of dashboard properties
   * @param id - Dashboard ID
   * @param dashboardv2 - Partial dashboard configuration updates
   * @param opts - Optional parameters including organization ID
   * @returns Promise<ArduinoDashboardv2> - Updated dashboard object
   */
  dashboardsV2Patch(id: string, dashboardv2: Dashboardv2, opts?: any): Promise<ArduinoDashboardv2>;

  /**
   * Delete a dashboard permanently
   * @param id - Dashboard ID
   * @param opts - Optional parameters including organization ID
   * @returns Promise<void>
   */
  dashboardsV2Delete(id: string, opts?: any): Promise<void>;

  /**
   * Clone an existing dashboard
   * @param id - Dashboard ID to clone
   * @param clone - Clone configuration including new name and options
   * @param opts - Optional parameters including organization ID
   * @returns Promise<ArduinoDashboardv2> - Cloned dashboard object
   */
  dashboardsV2Clone(id: string, clone: Clone, opts?: any): Promise<ArduinoDashboardv2>;

  /**
   * Get dashboard as a template for replication
   * @param id - Dashboard ID
   * @param opts - Optional parameters including organization ID
   * @returns Promise<ArduinoDashboardv2template> - Dashboard template
   */
  dashboardsV2Template(id: string, opts?: any): Promise<ArduinoDashboardv2template>;
}

Widget Management

Link widgets to thing properties and variables for real-time data display and control.

class DashboardsV2Api {
  /**
   * Link a widget to thing properties or variables
   * @param id - Dashboard ID
   * @param widgetId - Widget ID within the dashboard
   * @param widgetlink - Widget link configuration specifying data sources
   * @param opts - Optional parameters including organization ID
   * @returns Promise<ArduinoWidgetv2> - Updated widget configuration
   */
  dashboardsV2Link(id: string, widgetId: string, widgetlink: Widgetlink, opts?: any): Promise<ArduinoWidgetv2>;
}

Dashboard Sharing

Share dashboards with other users and manage access permissions.

class DashboardsV2Api {
  /**
   * Share a dashboard with another user
   * @param id - Dashboard ID
   * @param dashboardshare - Sharing configuration including user ID and permissions
   * @param opts - Optional parameters including organization ID
   * @returns Promise<void>
   */
  dashboardsV2Share(id: string, dashboardshare: Dashboardshare, opts?: any): Promise<void>;

  /**
   * List all shares for a dashboard
   * @param id - Dashboard ID
   * @param opts - Optional parameters including organization ID
   * @returns Promise<ArduinoDashboardshare[]> - Array of share configurations
   */
  dashboardsV2ListShares(id: string, opts?: any): Promise<ArduinoDashboardshare[]>;

  /**
   * Remove dashboard sharing for a specific user
   * @param id - Dashboard ID
   * @param userId - User ID to remove sharing for
   * @param opts - Optional parameters including organization ID
   * @returns Promise<void>
   */
  dashboardsV2DeleteShare(id: string, userId: string, opts?: any): Promise<void>;

  /**
   * Request access to a shared dashboard
   * @param id - Dashboard ID
   * @param sharerequest - Access request with message and permissions requested
   * @param opts - Optional parameters including organization ID
   * @returns Promise<void>
   */
  dashboardsV2RequestAccess(id: string, sharerequest: Sharerequest, opts?: any): Promise<void>;
}

Data Models

interface ArduinoDashboardv2 {
  createdAt?: Date;
  href?: string;
  id?: string;
  name?: string;
  organizationId?: string;
  owner?: ArduinoDashboardowner;
  sharedWith?: ArduinoDashboardshare[];
  updatedAt?: Date;
  userId?: string;
  widgets?: ArduinoWidgetv2[];
}

interface Dashboardv2 {
  name: string;
  widgets?: ArduinoWidgetv2[];
}

interface ArduinoWidgetv2 {
  height?: number;
  id?: string;
  name?: string;
  options?: any;
  type?: string;
  variables?: ArduinoLinkedvariable[];
  width?: number;
  x?: number;
  xMobile?: number;
  y?: number;
  yMobile?: number;
}

interface Widgetlink {
  variables?: ArduinoLinkedvariable[];
}

interface ArduinoLinkedvariable {
  id?: string;
  lastValue?: any;
  lastValueUpdatedAt?: Date;
  name?: string;
  permission?: string;
  thingId?: string;
  type?: string;
  variableName?: string;
}

interface Dashboardshare {
  message?: string;
  userId: string;
}

interface ArduinoDashboardshare {
  createdAt?: Date;
  id?: string;
  message?: string;
  sharedBy?: string;
  userId?: string;
}

interface Sharerequest {
  message?: string;
}

interface Clone {
  includeWidgets?: boolean;
  name: string;
}

interface ArduinoDashboardowner {
  email?: string;
  id?: string;
  username?: string;
}

interface ArduinoDashboardv2template {
  name?: string;
  organizationId?: string;
  widgets?: ArduinoWidgetv2template[];
}

interface ArduinoWidgetv2template {
  height?: number;
  name?: string;
  options?: any;
  type?: string;
  variables?: ArduinoLinkedvariableTemplate[];
  width?: number;
  x?: number;
  y?: number;
}

interface ArduinoLinkedvariableTemplate {
  name?: string;
  permission?: string;
  type?: string;
  variableName?: string;
}

Comprehensive Dashboard Management Example:

import ArduinoIotClient from '@arduino/arduino-iot-client';

const dashboardsApi = new ArduinoIotClient.DashboardsV2Api();

async function createCompleteDashboard(thingId, properties) {
  try {
    // Create a dashboard with multiple widget types
    const dashboard = await dashboardsApi.dashboardsV2Create({
      name: "Environmental Monitoring Dashboard",
      widgets: [
        // Temperature gauge widget
        {
          id: "temp-gauge",
          name: "Temperature",
          type: "gauge",
          x: 0,
          y: 0,
          width: 4,
          height: 4,
          xMobile: 0,
          yMobile: 0,
          options: {
            minValue: -10,
            maxValue: 40,
            unit: "°C",
            showValue: true
          }
        },
        // Humidity percentage widget
        {
          id: "humidity-percent",
          name: "Humidity Level",
          type: "percentage",
          x: 4,
          y: 0,
          width: 4,
          height: 4,
          xMobile: 0,
          yMobile: 4,
          options: {
            unit: "%",
            showValue: true
          }
        },
        // LED control switch
        {
          id: "led-switch",
          name: "Status LED",
          type: "switch",
          x: 8,
          y: 0,
          width: 4,
          height: 2,
          xMobile: 0,
          yMobile: 8,
          options: {
            onLabel: "ON",
            offLabel: "OFF"
          }
        },
        // Fan speed slider
        {
          id: "fan-slider",
          name: "Fan Speed",
          type: "slider",
          x: 8,
          y: 2,
          width: 4,
          height: 2,
          xMobile: 0,
          yMobile: 10,
          options: {
            minValue: 0,
            maxValue: 100,
            unit: "%",
            step: 5
          }
        },
        // Time series chart
        {
          id: "temp-chart",
          name: "Temperature History",
          type: "chart",
          x: 0,
          y: 4,
          width: 12,
          height: 4,
          xMobile: 0,
          yMobile: 12,
          options: {
            chartType: "line",
            timeWindow: "24h",
            yAxisLabel: "Temperature (°C)",
            showLegend: true
          }
        }
      ]
    });

    console.log('Created dashboard:', dashboard.id);

    // Link widgets to thing properties
    const [tempProp, humidityProp, , ledProp, fanProp] = properties;

    // Link temperature gauge
    await dashboardsApi.dashboardsV2Link(dashboard.id, "temp-gauge", {
      variables: [{
        id: tempProp.id,
        thingId: thingId,
        name: tempProp.name,
        type: tempProp.type,
        variableName: tempProp.variableName,
        permission: tempProp.permission
      }]
    });

    // Link humidity widget
    await dashboardsApi.dashboardsV2Link(dashboard.id, "humidity-percent", {
      variables: [{
        id: humidityProp.id,
        thingId: thingId,
        name: humidityProp.name,
        type: humidityProp.type,
        variableName: humidityProp.variableName,
        permission: humidityProp.permission
      }]
    });

    // Link LED control
    await dashboardsApi.dashboardsV2Link(dashboard.id, "led-switch", {
      variables: [{
        id: ledProp.id,
        thingId: thingId,
        name: ledProp.name,
        type: ledProp.type,
        variableName: ledProp.variableName,
        permission: ledProp.permission
      }]
    });

    // Link fan speed control
    await dashboardsApi.dashboardsV2Link(dashboard.id, "fan-slider", {
      variables: [{
        id: fanProp.id,
        thingId: thingId,
        name: fanProp.name,
        type: fanProp.type,
        variableName: fanProp.variableName,
        permission: fanProp.permission
      }]
    });

    // Link temperature chart (same as gauge but different visualization)
    await dashboardsApi.dashboardsV2Link(dashboard.id, "temp-chart", {
      variables: [{
        id: tempProp.id,
        thingId: thingId,
        name: tempProp.name,
        type: tempProp.type,
        variableName: tempProp.variableName,
        permission: tempProp.permission
      }]
    });

    console.log('All widgets linked to properties');
    return dashboard;

  } catch (error) {
    console.error('Failed to create dashboard:', error);
    throw error;
  }
}

// Dashboard sharing and collaboration
async function shareDashboard(dashboardId, collaborators) {
  try {
    // Share with multiple users
    for (const collaborator of collaborators) {
      await dashboardsApi.dashboardsV2Share(dashboardId, {
        userId: collaborator.userId,
        message: `Sharing environmental dashboard with ${collaborator.name}`
      });

      console.log(`Shared dashboard with ${collaborator.name}`);
    }

    // List all shares to verify
    const shares = await dashboardsApi.dashboardsV2ListShares(dashboardId);
    console.log(`Dashboard is shared with ${shares.length} users`);

    return shares;

  } catch (error) {
    console.error('Failed to share dashboard:', error);
    throw error;
  }
}

// Dashboard management and maintenance
async function manageDashboards() {
  try {
    // List all dashboards
    const allDashboards = await dashboardsApi.dashboardsV2List();
    console.log(`Total dashboards: ${allDashboards.length}`);

    for (const dashboard of allDashboards) {
      console.log(`Dashboard: ${dashboard.name} (${dashboard.widgets?.length || 0} widgets)`);

      // Get detailed dashboard info
      const details = await dashboardsApi.dashboardsV2Show(dashboard.id);

      // Check if dashboard has shares
      const shares = await dashboardsApi.dashboardsV2ListShares(dashboard.id);
      if (shares.length > 0) {
        console.log(`  - Shared with ${shares.length} users`);
      }

      // Example: Clone important dashboards for backup
      if (dashboard.name.includes('Production')) {
        const backup = await dashboardsApi.dashboardsV2Clone(dashboard.id, {
          name: `${dashboard.name} - Backup`,
          includeWidgets: true
        });
        console.log(`  - Created backup: ${backup.id}`);
      }
    }

  } catch (error) {
    console.error('Dashboard management error:', error);
  }
}

// Advanced dashboard patterns
async function createDashboardTemplate(templateName, widgetConfigs) {
  try {
    // Create a template dashboard without data links
    const template = await dashboardsApi.dashboardsV2Create({
      name: templateName,
      widgets: widgetConfigs.map((config, index) => ({
        id: `widget-${index}`,
        name: config.name,
        type: config.type,
        x: config.x || 0,
        y: config.y || 0,
        width: config.width || 4,
        height: config.height || 4,
        options: config.options || {}
      }))
    });

    // Get template for future replication
    const templateObj = await dashboardsApi.dashboardsV2Template(template.id);

    console.log(`Created dashboard template: ${templateName}`);
    return { dashboard: template, template: templateObj };

  } catch (error) {
    console.error('Failed to create dashboard template:', error);
    throw error;
  }
}

// Usage example with error handling
async function dashboardManagementDemo(thingId, properties) {
  try {
    // Create complete dashboard
    const dashboard = await createCompleteDashboard(thingId, properties);

    // Share with collaborators
    await shareDashboard(dashboard.id, [
      { userId: 'user-1', name: 'John Doe' },
      { userId: 'user-2', name: 'Jane Smith' }
    ]);

    // Update dashboard layout
    await dashboardsApi.dashboardsV2Patch(dashboard.id, {
      name: "Environmental Monitoring Dashboard - Updated"
    });

    // Create template for future use
    await createDashboardTemplate('Environmental Template', [
      {
        name: 'Temperature',
        type: 'gauge',
        x: 0, y: 0, width: 4, height: 4,
        options: { minValue: -10, maxValue: 40, unit: '°C' }
      },
      {
        name: 'Humidity',
        type: 'percentage',
        x: 4, y: 0, width: 4, height: 4,
        options: { unit: '%' }
      }
    ]);

    // Perform dashboard maintenance
    await manageDashboards();

    console.log('Dashboard management demo completed successfully');

  } catch (error) {
    if (error.status === 400) {
      console.error('Bad request - check dashboard configuration');
    } else if (error.status === 403) {
      console.error('Forbidden - check dashboard permissions');
    } else if (error.status === 404) {
      console.error('Dashboard not found');
    } else {
      console.error('Dashboard management error:', error.detail || error.message);
    }
  }
}

Install with Tessl CLI

npx tessl i tessl/npm-arduino--arduino-iot-client

docs

automation-triggers.md

dashboard-management.md

device-management.md

index.md

lora-device-management.md

network-credentials.md

property-management.md

thing-management.md

timeseries-analytics.md

tile.json