My Canister Dashboard

Dashboard assets and management utilities for Internet Computer Canister Dapps.

Integrates with AssetRouter for asset certification.

Features

• Embedded Dashboard UI - Pre-built HTML/CSS/JS dashboard served at /canister-dashboard
• Internet Identity Integration - Manage II principal for authentication
• Alternative Origins - Configure /.well-known/ii-alternative-origins for II domain delegation
• Automatic Top-up - Schedule periodic cycles top-ups when balance falls below threshold
• Guard Functions - Restrict endpoints to controllers or II principal
• Light/Dark Theme - Automatic theme detection with manual toggle
• Copy Buttons - One-click copy for principals, accounts, and hashes

Setup

use ic_asset_certification::AssetRouter;
use my_canister_dashboard::setup;
use std::cell::RefCell;
use ic_cdk::{api::certified_data_set, init};

thread_local! {
    static ASSET_ROUTER: RefCell<AssetRouter<'static>> = RefCell::new(
        AssetRouter::new()
    );
}

#[init]
fn init() {
    ASSET_ROUTER.with(|router| {
        let mut router = router.borrow_mut();
        setup::setup_dashboard_assets(
            &mut router,
            Some(vec!["https://mycanister.app".to_string()]),
        ).expect("Failed to setup dashboard");
        certified_data_set(router.root_hash());
    });
}

Management Functions

Expose these in your canister to enable dashboard functionality:

II Principal Management

use my_canister_dashboard::{
    ManageIIPrincipalArg, ManageIIPrincipalResult,
    guards::only_canister_controllers_guard,
};
use ic_cdk::update;

#[update(guard = "only_canister_controllers_guard")]
fn manage_ii_principal(arg: ManageIIPrincipalArg) -> ManageIIPrincipalResult {
    my_canister_dashboard::manage_ii_principal(arg)
}

Alternative Origins Management

use my_canister_dashboard::{
    ManageAlternativeOriginsArg, ManageAlternativeOriginsResult,
    guards::only_canister_controllers_guard,
};
use ic_cdk::update;

#[update(guard = "only_canister_controllers_guard")]
fn manage_alternative_origins(arg: ManageAlternativeOriginsArg) -> ManageAlternativeOriginsResult {
    ASSET_ROUTER.with(|router| {
        my_canister_dashboard::manage_alternative_origins(&mut router.borrow_mut(), arg)
    })
}

Automatic Top-up Rules

use my_canister_dashboard::{
    ManageTopUpRuleArg, ManageTopUpRuleResult,
    guards::only_ii_principal_guard,
};
use ic_cdk::update;

#[update(guard = "only_ii_principal_guard")]
fn manage_top_up_rule(arg: ManageTopUpRuleArg) -> ManageTopUpRuleResult {
    my_canister_dashboard::manage_top_up_rule(arg)
}

Guards

Two guard functions for protecting endpoints:

• only_canister_controllers_guard() - Allows only canister controllers
• only_ii_principal_guard() - Allows only the configured II principal

use my_canister_dashboard::guards::{only_canister_controllers_guard, only_ii_principal_guard};
use ic_cdk::update;

#[update(guard = "only_canister_controllers_guard")]
fn admin_only_function() { /* ... */ }

#[update(guard = "only_ii_principal_guard")]
fn user_only_function() { /* ... */ }

Asset Paths

The dashboard assets are served at these paths:

Vite Plugin

For local development, use @web3nl/vite-plugin-canister-dapp to configure the development environment.

License

MIT