diff --git a/tools/ui/src/candid.ts b/tools/ui/src/candid.ts
index b57b55e0..4b025cf6 100644
--- a/tools/ui/src/candid.ts
+++ b/tools/ui/src/candid.ts
@@ -5,6 +5,7 @@ import {
} from '@dfinity/candid';
import {Principal} from '@dfinity/principal'
import './candid.css';
+import { AuthClient } from "@dfinity/auth-client";
declare var flamegraph: any;
declare var d3: any;
@@ -17,6 +18,8 @@ function is_local(agent: HttpAgent) {
return hostname === '127.0.0.1' || hostname.endsWith('localhost');
}
+export let authClient: AuthClient | undefined;
+
const agent = new HttpAgent();
if (is_local(agent)) {
agent.fetchRootKey();
@@ -77,6 +80,19 @@ export async function fetchActor(canisterId: Principal): Promise
}
const dataUri = 'data:text/javascript;charset=utf-8,' + encodeURIComponent(js);
const candid: any = await eval('import("' + dataUri + '")');
+
+ authClient = authClient ?? (await AuthClient.create({
+ idleOptions: {
+ disableIdle: true,
+ disableDefaultIdleCallback: true,
+ },
+ }))
+ if (await authClient.isAuthenticated()) {
+ agent.replaceIdentity(authClient.getIdentity());
+ console.log("Authenticated with Internet Identity Principal")
+ console.log(authClient.getIdentity().getPrincipal().toString())
+ }
+
return Actor.createActor(candid.idlFactory, { agent, canisterId });
}
diff --git a/tools/ui/src/index.ts b/tools/ui/src/index.ts
index 7d9f20c5..083ee4e9 100644
--- a/tools/ui/src/index.ts
+++ b/tools/ui/src/index.ts
@@ -1,5 +1,9 @@
import { fetchActor, render, getCycles, getNames } from "./candid";
+import { renderAuth } from "./auth/auth";
import { Principal } from "@dfinity/principal";
+import { ActorSubclass } from "@dfinity/agent";
+
+let actor: ActorSubclass | undefined;
async function main() {
const params = new URLSearchParams(window.location.search);
@@ -37,7 +41,8 @@ async function main() {
document.title = `Canister ${cid}`;
const canisterId = Principal.fromText(cid);
const profiling = await getCycles(canisterId);
- const actor = await fetchActor(canisterId);
+ actor = await fetchActor(canisterId);
+ await renderAuth();
const names = await getNames(canisterId);
render(canisterId, actor, profiling);
const app = document.getElementById("app");
@@ -65,3 +70,7 @@ window.addEventListener("popstate", (event) => {
window.location.reload();
}
});
+
+export async function refresh_actor(canisterId: Principal) {
+ actor = await fetchActor(canisterId);
+};