Update taco-web demos to use latest released version of taco, `ta…

…co-auth` (#578)

demos/taco-demo/README.md

@@ -8,26 +8,13 @@ See this demo in action at https://taco-demo.netlify.app/
 
 ```bash
 pnpm install
-pnpm start
 ```
 
 ## Usage
 
-In order to run this demo will need a browser wallet with an account funded with
-some $MATIC.
-
-In order to connect with the network, the demo uses a public instances of
-[Porter](https://docs.threshold.network/app-development/threshold-access-control-tac/porter).
-
-### Polygon
-
-`@nucypher/taco` is in an early release. We recommend **not** using it in
-production _just yet_.
-
-### Lynx Testnet
-
-The current release of `@nucypher/taco` supports Ursulas working on Lynx
-(bleeding-edge) test network and contracts deployed on Polygon Amoy testnet.
+```bash
+pnpm start
+```
 
 ## References
 

demos/taco-demo/package.json

@@ -3,7 +3,7 @@
   "version": "0.0.0",
   "description": "A usage example for @nucypher/taco",
   "private": true,
-  "author": "Piotr Rosłaniec <p.roslaniec@gmail.com>",
+  "author": "NuCypher <dev@nucypher.com>",
   "scripts": {
     "start": "webpack serve --mode development",
     "build": "pnpm clean && webpack --mode production --progress",
@@ -12,34 +12,35 @@
     "type-check": "tsc --noEmit"
   },
   "dependencies": {
-    "@irys/sdk": "^0.1.16",
-    "@nucypher/taco": "^0.3.0",
-    "@usedapp/core": "^1.2.13",
+    "@irys/sdk": "^0.1.24",
+    "@nucypher/taco": "^0.5.0",
+    "@nucypher/taco-auth": "^0.2.0",
+    "@usedapp/core": "^1.2.16",
     "buffer": "^6.0.3",
-    "ethers": "^5.7.1",
+    "ethers": "^5.7.2",
     "file-loader": "^6.2.0",
     "react": "^18.3.1",
     "react-copy-to-clipboard": "^5.1.0",
     "react-dom": "^18.3.1",
     "react-spinners": "^0.14.1"
   },
   "devDependencies": {
-    "@pmmmwh/react-refresh-webpack-plugin": "^0.5.7",
+    "@pmmmwh/react-refresh-webpack-plugin": "^0.5.15",
     "@types/react": "^18.3.5",
     "@types/react-copy-to-clipboard": "^5.0.7",
     "@types/react-dom": "^18.3.0",
     "copy-webpack-plugin": "^12.0.2",
     "crypto-browserify": "^3.12.0",
-    "esbuild-loader": "^2.20.0",
-    "html-webpack-plugin": "^5.5.0",
+    "esbuild-loader": "^2.21.0",
+    "html-webpack-plugin": "^5.6.0",
     "process": "^0.11.10",
-    "react-refresh": "^0.14.0",
-    "rimraf": "^5.0.5",
+    "react-refresh": "^0.14.2",
+    "rimraf": "^5.0.10",
     "stream-browserify": "^3.0.0",
-    "typescript": "^4.8.3",
+    "typescript": "^4.9.5",
     "vm-browserify": "^1.1.2",
-    "webpack": "^5.93.0",
+    "webpack": "^5.94.0",
     "webpack-cli": "^5.1.4",
-    "webpack-dev-server": "^4.11.1"
+    "webpack-dev-server": "^4.15.2"
   }
 }

demos/taco-demo/src/App.tsx

@@ -7,6 +7,10 @@ import {
   ThresholdMessageKit,
   toHexString,
 } from '@nucypher/taco';
+import {
+  EIP4361AuthProvider,
+  USER_ADDRESS_PARAM_DEFAULT,
+} from '@nucypher/taco-auth';
 import { useEthers } from '@usedapp/core';
 import { ethers } from 'ethers';
 import React, { useEffect, useState } from 'react';
@@ -84,12 +88,26 @@ export default function App() {
       Buffer.from(encryptedMessageHex, 'hex'),
     );
 
+    // create condition context
+    const conditionContext = conditions.context.ConditionContext.fromMessageKit(encryptedMessage);
+
+    // illustrative optional example of checking what context parameters are required
+    if (
+      conditionContext.requestedContextParameters.has(USER_ADDRESS_PARAM_DEFAULT)
+    ) {
+      // add authentication for ":userAddress" in condition
+      const authProvider = new EIP4361AuthProvider(
+        provider,
+        provider.getSigner()
+      );
+      conditionContext.addAuthProvider(USER_ADDRESS_PARAM_DEFAULT, authProvider);
+    }
+
     const decryptedMessage = await decrypt(
       provider,
       domain,
       encryptedMessage,
-      undefined,
-      provider.getSigner(),
+      conditionContext,
     );
 
     setDecryptedMessage(new TextDecoder().decode(decryptedMessage));

demos/taco-nft-demo/README.md

@@ -4,34 +4,22 @@ See this demo in action at https://taco-nft-demo.netlify.app/
 
 [![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/nucypher/taco-web/tree/main/demos/taco-nft-demo)
 
-## Installation
+## Usage
 
 ```bash
 pnpm install
-pnpm start
 ```
 
 ## Usage
 
-In order to run this demo will need a browser wallet with an account funded with some
-$MATIC.
-
-In order to connect with the network, the demo uses a public instances of
-[Porter](https://docs.nucypher.com/en/latest/application_development/web_development.html#running-porter).
-
-### Polygon
-
-`@nucypher/taco` is in an early release. We recommend **not** using it in
-production _just yet_.
-
-### Lynx Testnet
-
-The current release of `@nucypher/taco` supports Ursulas working on Lynx (bleeding-edge) test
-network and contracts deployed on Polygon Amoy testnet.
+```bash
+pnpm start
+```
 
 ## References
 
-Please find developer documentation [here](https://docs.threshold.network/app-development/threshold-access-control-tac).
+Please find developer documentation
+[here](https://docs.threshold.network/app-development/threshold-access-control-tac).
 
 This dApp is based on
 [`useDapp` example](https://github.com/EthWorks/useDapp/tree/master/packages/example).

demos/taco-nft-demo/package.json

@@ -3,7 +3,7 @@
   "version": "0.0.0",
   "description": "A usage example for @nucypher/taco",
   "private": true,
-  "author": "Piotr Rosłaniec <p.roslaniec@gmail.com>",
+  "author": "NuCypher <dev@nucypher.com>",
   "scripts": {
     "start": "webpack serve --mode development",
     "build": "pnpm clean && webpack --mode production --progress",
@@ -12,30 +12,31 @@
     "type-check": "tsc --noEmit"
   },
   "dependencies": {
-    "@nucypher/taco": "^0.3.0",
-    "@usedapp/core": "^1.2.13",
+    "@nucypher/taco": "^0.5.0",
+    "@nucypher/taco-auth": "^0.2.0",
+    "@usedapp/core": "^1.2.16",
     "buffer": "^6.0.3",
-    "ethers": "^5.7.1",
+    "ethers": "^5.7.2",
     "file-loader": "^6.2.0",
     "react": "^18.3.1",
     "react-copy-to-clipboard": "^5.1.0",
     "react-dom": "^18.3.1",
     "react-spinners": "^0.14.1"
   },
   "devDependencies": {
-    "@pmmmwh/react-refresh-webpack-plugin": "^0.5.7",
+    "@pmmmwh/react-refresh-webpack-plugin": "^0.5.15",
     "@types/react": "^18.3.5",
     "@types/react-copy-to-clipboard": "^5.0.7",
     "@types/react-dom": "^18.3.0",
     "copy-webpack-plugin": "^12.0.2",
-    "esbuild-loader": "^2.20.0",
-    "html-webpack-plugin": "^5.5.0",
-    "react-refresh": "^0.14.0",
-    "rimraf": "^5.0.5",
+    "esbuild-loader": "^2.21.0",
+    "html-webpack-plugin": "^5.6.0",
+    "react-refresh": "^0.14.2",
+    "rimraf": "^5.0.10",
     "stream-browserify": "^3.0.0",
-    "typescript": "^4.8.3",
-    "webpack": "^5.93.0",
+    "typescript": "^4.9.5",
+    "webpack": "^5.94.0",
     "webpack-cli": "^5.1.4",
-    "webpack-dev-server": "^4.11.1"
+    "webpack-dev-server": "^4.15.2"
   }
 }

demos/taco-nft-demo/src/App.tsx

@@ -6,6 +6,10 @@ import {
   initialize,
   ThresholdMessageKit,
 } from '@nucypher/taco';
+import {
+  EIP4361AuthProvider,
+  USER_ADDRESS_PARAM_DEFAULT,
+} from '@nucypher/taco-auth';
 import { useEthers } from '@usedapp/core';
 import { ethers } from 'ethers';
 import React, { useEffect, useState } from 'react';
@@ -73,12 +77,27 @@ export default function App() {
     setDecryptionErrors([]);
 
     const provider = new ethers.providers.Web3Provider(window.ethereum);
+
+    // create condition context
+    const conditionContext = conditions.context.ConditionContext.fromMessageKit(encryptedMessage);
+
+    // illustrative optional example of checking what context parameters are required
+    if (
+      conditionContext.requestedContextParameters.has(USER_ADDRESS_PARAM_DEFAULT)
+    ) {
+      // add authentication for ":userAddress" in condition
+      const authProvider = new EIP4361AuthProvider(
+        provider,
+        provider.getSigner()
+      );
+      conditionContext.addAuthProvider(USER_ADDRESS_PARAM_DEFAULT, authProvider);
+    }
+
     const decryptedMessage = await decrypt(
       provider,
       domain,
       encryptedMessage,
-      undefined,
-      provider.getSigner()
+      conditionContext,
     );
 
     setDecryptedMessage(new TextDecoder().decode(decryptedMessage));
@@ -109,7 +128,7 @@ export default function App() {
       <h2>Notice</h2>
       <p>
         In production (mainnet domain), your wallet address (encryptor) will also have
-        to be allow-listed for this specific ritual. However, we have 
+        to be allow-listed for this specific ritual. However, we have
         <a href={'https://docs.threshold.network/app-development/threshold-access-control-tac/integration-guide/get-started-with-tac#testnet-configuration'}>publicly available testnet rituals</a>
         for use when developing your apps.
       </p>