Update examples to use latest linera-web APIs.

examples/hosted-counter/index.html

@@ -36,6 +36,7 @@ <h1>Counter</h1>
       </div>
 
       <div class="logs">
+        <h2>Connected as <code id="owner" class="hex">requesting owner…</code> </h2>
         <h2>Chain history for <code id="chain-id" class="hex">requesting chain…</code></h2>
         <ul id="logs">
           <template>
@@ -50,22 +51,30 @@ <h2>Chain history for <code id="chain-id" class="hex">requesting chain…</code>
     <script type="importmap">
       {
           "imports": {
-              "@linera/client": "./js/@linera/client/linera_web.js"
+              "@linera/client": "./js/@linera/client/linera_web.js",
+              "@linera/signer": "./js/@linera/signer/index.js"
           }
       }
     </script>
 
     <script type="module">
+      import { Buffer } from 'buffer';
+      window.Buffer = Buffer;
+
       import * as linera from '@linera/client';
+      import * as signer from '@linera/signer';
 
-      const COUNTER_APP_ID = '2b1a0df8868206a4b7d6c2fdda911e4355d6c0115b896d4947ef8e535ee3c6b8';
+      const COUNTER_APP_ID = '87bdd2357acfe1a8c598ec04740755c46d7644f21d7aa287c96186329ddfe9fc';
 
       async function run() {
           await linera.default();
-          const faucet = await new linera.Faucet('https://faucet.testnet-babbage.linera.net');
+          const faucet = await new linera.Faucet('http://127.0.0.1:8080');
+          const signer = await new signer.MetaMaskEIP191Signer();
           const wallet = await faucet.createWallet();
-          const client = await new linera.Client(wallet);
-          document.getElementById('chain-id').innerText = await faucet.claimChain(client);
+          const owner = await signer.address();
+          document.getElementById('owner').innerText = owner;
+          document.getElementById('chain-id').innerText = await faucet.claimChain(wallet, owner);
+          const client = await new linera.Client(wallet, signer);
           const counter = await client.frontend().application(COUNTER_APP_ID);
           const logs = document.getElementById('logs');
           const incrementButton = document.getElementById('increment-btn');
@@ -78,7 +87,6 @@ <h2>Chain history for <code id="chain-id" class="hex">requesting chain…</code>
               logs.insertBefore(entry, logs.firstChild);
           }
 
-
           async function updateCount() {
               const response = await counter.query('{ "query": "query { value }" }');
               document.getElementById('count').innerText

examples/hosted-counter/package.json

@@ -12,9 +12,11 @@
     "ci": "pnpm install --frozen-lockfile && pnpm build"
   },
   "dependencies": {
-    "@linera/client": "file:../../linera-protocol/linera-web"
+    "@linera/client": "workspace:*",
+    "@linera/signer": "workspace:*",
+    "buffer": "^6.0.3"
   },
   "devDependencies": {
-    "vite": "^5.4.10"
+    "vite": "^5.4.11"
   }
 }

examples/hosted-fungible/index.html

@@ -127,6 +127,7 @@ <h4>Transfer</h4>
       </div>
 
       <div class="logs">
+        <h2>Connected as <code id="owner" class="hex">requesting owner…</code> </h2>
         <h2>Chain history for <code id="chain-id" class="hex">requesting a new microchain…</code></h2>
         <ul id="logs">
           <template>
@@ -140,8 +141,10 @@ <h2>Chain history for <code id="chain-id" class="hex">requesting a new microchai
 
     <script type="module">
       import * as linera from '@linera/client';
+      import * as signer from '@linera/signer';
 
-      const FUNGIBLE_APP_ID = '465e465b050db5034fd8a51df46b9a7cf02a8a6414cc2b94b102e912208d4a4b';
+      // This needs to point at actual deployed fungible application ID.
+      const FUNGIBLE_APP_ID = 'ae2e8739878ed86fe67eb3a3f473437e122233ab46fc00f1d115462dcf9a597b8588f06d13062198951b0a37c0552db564c5d6903f1e00e8f0e2df6b87891bd700';
 
       const gql = (query, variables = {}) => JSON.stringify({ query, variables });
 
@@ -216,11 +219,15 @@ <h2>Chain history for <code id="chain-id" class="hex">requesting a new microchai
           });
 
           await linera.default();
-          const faucet = await new linera.Faucet('https://faucet.testnet-babbage.linera.net');
+          const faucet = await new linera.Faucet('http://127.0.0.1:8080');
+          throw new Error('INSERT PRIVKEY HERE'); // Replace with your private key
+          const signer = await new signer.PrivateKey("f77a21701522a03b01c111ad2d2cdaf2b8403b47507ee0aec3c2e52b765d7a66");
           const wallet = await faucet.createWallet();
-          const client = await new linera.Client(wallet);
-          const chainId = await faucet.claimChain(client);
+          const owner = signer.address();
+          const chainId = await faucet.claimChain(wallet, owner);
+          const client = await new linera.Client(wallet, signer);
           document.querySelector('#chain-id').innerText = chainId;
+          document.querySelector('#owner').innerText = owner;
 
           const application = await client.frontend().application(FUNGIBLE_APP_ID);
 

examples/hosted-fungible/package.json

@@ -12,7 +12,8 @@
     "ci": "pnpm install --frozen-lockfile && pnpm build"
   },
   "dependencies": {
-    "@linera/client": "file:../../linera-protocol/linera-web"
+    "@linera/client": "workspace:*",
+    "@linera/signer": "workspace:*"
   },
   "devDependencies": {
     "vite": "^5.4.11"

extension/package.json

@@ -18,14 +18,6 @@
         "@shoelace-style/shoelace": "^2.16.0",
         "lit": "^3.2.0",
         "randomstring": "^1.3.0",
-        "webext-bridge": "^6.0.1",
-        "@linera/client": "file:../linera-protocol/linera-web"
-    },
-    "devDependencies": {
-        "@types/chrome": "^0.0.267",
-        "@types/randomstring": "^1.3.0",
-        "ts-auto-guard": "^5.0.1",
-        "typescript": "^5.6.2",
-        "vite": "^5.4.5"
+        "webext-bridge": "^6.0.1"
     }
 }

extension/src/wallet/index.ts

@@ -11,7 +11,7 @@ export class Server {
   async setWallet(wallet: string) {
     this.wallet = wallet;
     await linera;
-    this.client = await new linera.Client({} as linera.Wallet); // Replace with actual wallet initialization
+    this.client = await new linera.Client({} as linera.Wallet, {} as linera.Signer); // Replace with actual wallet initialization
     this.client.onNotification((notification: any) => {
       console.debug('got notification for', this.subscribers.size, 'subscribers:', notification);
       for (const subscriber of this.subscribers.values()) {

package.json

@@ -9,5 +9,17 @@
     "keywords": [],
     "author": "Linera <[email protected]>",
     "license": "Apache-2.0",
-    "devDependencies": {}
+    "dependencies": {
+        "@linera/client": "file:./linera-protocol/linera-web",
+        "@linera/signer": "file:./linera-protocol/linera-web/signer"
+    },
+    "devDependencies": {
+        "@types/chrome": "^0.0.267",
+        "@types/jest": "^29.5.14",
+        "@types/node": "^24.0.0",
+        "@types/randomstring": "^1.3.0",
+        "ts-auto-guard": "^5.0.1",
+        "typescript": "^5.8.3",
+        "vite": "^5.4.5"
+    }
 }