) {
16 | const newName = e.target.value
17 | setName(newName)
18 | }
19 |
20 | return (
21 |
22 |
34 |
35 |
36 | {loading ? (
37 | Loading...
38 | ) : error ? (
39 | {error.message}
40 | ) : data ? (
41 | {data}
42 | ) : null}
43 |
44 |
45 | )
46 | }
47 |
48 | export default Greeting
49 |
--------------------------------------------------------------------------------
/src/declarations/hello/hello.did.d.ts:
--------------------------------------------------------------------------------
1 | import type { Principal } from '@dfinity/principal';
2 | import type { ActorMethod } from '@dfinity/agent';
3 | import type { IDL } from '@dfinity/candid';
4 |
5 | export interface _SERVICE { 'greet' : ActorMethod<[string], string> }
6 | export declare const idlFactory: IDL.InterfaceFactory;
7 | export declare const init: ({ IDL }: { IDL: IDL }) => IDL.Type[];
8 |
--------------------------------------------------------------------------------
/src/declarations/hello/hello.did.js:
--------------------------------------------------------------------------------
1 | export const idlFactory = ({ IDL }) => {
2 | return IDL.Service({ 'greet' : IDL.Func([IDL.Text], [IDL.Text], ['query']) });
3 | };
4 | export const init = ({ IDL }) => { return []; };
5 |
--------------------------------------------------------------------------------
/src/declarations/hello/index.d.ts:
--------------------------------------------------------------------------------
1 | import type {
2 | ActorSubclass,
3 | HttpAgentOptions,
4 | ActorConfig,
5 | Agent,
6 | } from "@dfinity/agent";
7 | import type { Principal } from "@dfinity/principal";
8 | import type { IDL } from "@dfinity/candid";
9 |
10 | import { _SERVICE } from './hello.did';
11 |
12 | export declare const idlFactory: IDL.InterfaceFactory;
13 | export declare const canisterId: string;
14 |
15 | export declare interface CreateActorOptions {
16 | /**
17 | * @see {@link Agent}
18 | */
19 | agent?: Agent;
20 | /**
21 | * @see {@link HttpAgentOptions}
22 | */
23 | agentOptions?: HttpAgentOptions;
24 | /**
25 | * @see {@link ActorConfig}
26 | */
27 | actorOptions?: ActorConfig;
28 | }
29 |
30 | /**
31 | * Intializes an {@link ActorSubclass}, configured with the provided SERVICE interface of a canister.
32 | * @constructs {@link ActorSubClass}
33 | * @param {string | Principal} canisterId - ID of the canister the {@link Actor} will talk to
34 | * @param {CreateActorOptions} options - see {@link CreateActorOptions}
35 | * @param {CreateActorOptions["agent"]} options.agent - a pre-configured agent you'd like to use. Supercedes agentOptions
36 | * @param {CreateActorOptions["agentOptions"]} options.agentOptions - options to set up a new agent
37 | * @see {@link HttpAgentOptions}
38 | * @param {CreateActorOptions["actorOptions"]} options.actorOptions - options for the Actor
39 | * @see {@link ActorConfig}
40 | */
41 | export declare const createActor: (
42 | canisterId: string | Principal,
43 | options?: CreateActorOptions
44 | ) => ActorSubclass<_SERVICE>;
45 |
46 | /**
47 | * Intialized Actor using default settings, ready to talk to a canister using its candid interface
48 | * @constructs {@link ActorSubClass}
49 | */
50 | export declare const hello: ActorSubclass<_SERVICE>;
51 |
--------------------------------------------------------------------------------
/src/declarations/hello/index.js:
--------------------------------------------------------------------------------
1 | import { Actor, HttpAgent } from "@dfinity/agent";
2 |
3 | // Imports and re-exports candid interface
4 | import { idlFactory } from "./hello.did.js";
5 | export { idlFactory } from "./hello.did.js";
6 |
7 | /* CANISTER_ID is replaced by webpack based on node environment
8 | * Note: canister environment variable will be standardized as
9 | * process.env.CANISTER_ID_
10 | * beginning in dfx 0.15.0
11 | */
12 | export const canisterId =
13 | process.env.CANISTER_ID_HELLO ||
14 | process.env.HELLO_CANISTER_ID;
15 |
16 | export const createActor = (canisterId, options = {}) => {
17 | const agent = options.agent || new HttpAgent({ ...options.agentOptions });
18 |
19 | if (options.agent && options.agentOptions) {
20 | console.warn(
21 | "Detected both agent and agentOptions passed to createActor. Ignoring agentOptions and proceeding with the provided agent."
22 | );
23 | }
24 |
25 | // Fetch root key for certificate validation during development
26 | if (process.env.DFX_NETWORK !== "ic") {
27 | agent.fetchRootKey().catch((err) => {
28 | console.warn(
29 | "Unable to fetch root key. Check to ensure that your local replica is running"
30 | );
31 | console.error(err);
32 | });
33 | }
34 |
35 | // Creates an actor with using the candid interface and the HttpAgent
36 | return Actor.createActor(idlFactory, {
37 | agent,
38 | canisterId,
39 | ...options.actorOptions,
40 | });
41 | };
42 |
--------------------------------------------------------------------------------
/src/pages/_app.tsx:
--------------------------------------------------------------------------------
1 | import { AppProps } from "next/app"
2 | import React from "react"
3 | import "styles/global.css"
4 |
5 | const App: React.FC = ({ Component, pageProps }) => {
6 | return
7 | }
8 |
9 | export default App
10 |
--------------------------------------------------------------------------------
/src/pages/index.tsx:
--------------------------------------------------------------------------------
1 | import Head from "next/head"
2 |
3 | import styles from "styles/Home.module.css"
4 |
5 | import Greeting from "components/Greeting"
6 | import Image from "next/image"
7 |
8 | function HomePage() {
9 | return (
10 |
11 |
12 |
Internet Computer
13 |
14 |
15 |
16 | Welcome to the Internet Computer starter template
17 |
18 |
19 |
20 |
35 |