From 162ebb7754f13bdcadfc08a0163281d6f63ff1b1 Mon Sep 17 00:00:00 2001 From: M-Picco Date: Wed, 25 May 2022 12:40:46 -0300 Subject: [PATCH 1/3] Docs for tealSign method --- docs/getting-started/myalgo-connect-api.md | 48 ++++++-- docs/interactive-examples/TealSign.mdx | 16 +++ package-lock.json | 5 +- package.json | 2 +- sidebars.js | 3 +- src/components/TealSignExample.tsx | 122 +++++++++++++++++++++ src/components/commons/Note.tsx | 5 +- 7 files changed, 183 insertions(+), 18 deletions(-) create mode 100644 docs/interactive-examples/TealSign.mdx create mode 100644 src/components/TealSignExample.tsx diff --git a/docs/getting-started/myalgo-connect-api.md b/docs/getting-started/myalgo-connect-api.md index 2d6b83e..5b5cf2d 100644 --- a/docs/getting-started/myalgo-connect-api.md +++ b/docs/getting-started/myalgo-connect-api.md @@ -174,21 +174,47 @@ signLogicSig(logic: Uint8Array | Base64, address: Address): Promise; #### Params -`Logic`: TEAL program to be signed by the user. + - `Logic`: TEAL program to be signed by the user. -`Address`: Signer’s Address. + - `Address`: Signer’s Address. #### Response ```json // Uint8Array -{ - "0": 248, - "1": 77, - "2": 132, - ... - "61": 28, - "62": 131, - "63": 14 -} +[ 248, 77, 132, ..., 28, 131, 14] +``` + +## tealSign() + +Sign an arbitrary piece of data which can be verified by a smart contract through the [ed25519verify](https://developer.algorand.org/docs/get-details/dapps/avm/teal/opcodes/#ed25519verify) opcode. + +#### Signature and types + +```jsx +export type Address = string; +export type Base64 = string; + +tealSign(data: Uint8Array | Base64, contractAddress: Address, address: Address): Promise; ``` + +#### Params + + - `data`: The arbitrary piece of data to be signed + + - `contractAddress`: Contract address/TEAL program hash, which can verify the signature. + + - `address`: Signer address + +#### Response + +Returns the signature of the data + +```js +// Uint8Array +[ 248, 77, 132, ..., 28, 131, 14 ] +``` + +#### Considerations + +- This operation is supported only by mnemonic accounts. Ledger accounts are not supported. diff --git a/docs/interactive-examples/TealSign.mdx b/docs/interactive-examples/TealSign.mdx new file mode 100644 index 0000000..5eab64e --- /dev/null +++ b/docs/interactive-examples/TealSign.mdx @@ -0,0 +1,16 @@ +--- +sidebar_position: 12 +--- + +import TealSignExample from "../../src/components/TealSignExample" + +# Sign arbitrary data for teal program + +Sign an arbitrary piece of data which can be verified by a smart contract through the [ed25519verify](https://developer.algorand.org/docs/get-details/dapps/avm/teal/opcodes/#ed25519verify) opcode. + +### Preconditions + +* The user has already shared the account to sign the data with. + +### Interactive Example + diff --git a/package-lock.json b/package-lock.json index 8547336..7eff565 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1899,9 +1899,8 @@ "integrity": "sha512-CuJNwtMTG1LHR1LQNWUPv+8xPUdkRY9p61wGJEp8J/N3q8djmnMySvSQlyVqLBvXsTPKmYc0ZmfXEXCpb5P5Cw==" }, "@randlabs/myalgo-connect": { - "version": "1.1.3", - "resolved": "https://registry.npmjs.org/@randlabs/myalgo-connect/-/myalgo-connect-1.1.3.tgz", - "integrity": "sha512-iGme4YvAVCtZ6hjaEmltvd/z+Y2aIZ9s0Tw/t2WZRMD8CoWqYiDaj2vjrbtDyOarENQVNlAiY4IMpm0uI9gcUg==", + "version": "git+https://github.com/randlabs/myalgo-connect.git#8e06e535867df149d1bc722abdeaeae3dfc3a3af", + "from": "git+https://github.com/randlabs/myalgo-connect.git#tealSign", "requires": { "@randlabs/communication-bridge": "^1.0.0" } diff --git a/package.json b/package.json index fb2dd42..8e6c0cd 100644 --- a/package.json +++ b/package.json @@ -17,7 +17,7 @@ "@docusaurus/core": "^2.0.0-beta.3", "@docusaurus/preset-classic": "^2.0.0-beta.3", "@mdx-js/react": "^1.6.21", - "@randlabs/myalgo-connect": "^1.1.3", + "@randlabs/myalgo-connect": "git+https://github.com/randlabs/myalgo-connect.git#tealSign", "@svgr/webpack": "^5.5.0", "algosdk": "^1.10.1", "bootstrap": "^5.0.2", diff --git a/sidebars.js b/sidebars.js index d52747b..90c3ead 100644 --- a/sidebars.js +++ b/sidebars.js @@ -36,7 +36,8 @@ module.exports = { 'interactive-examples/connect','interactive-examples/PaymentTransaction', 'interactive-examples/GroupedTransaction', 'interactive-examples/ASATransacation', 'interactive-examples/ApplOptIn', 'interactive-examples/ApplCloseOut', 'interactive-examples/PaymentWithTeal', 'interactive-examples/ApplCreateTransaction', 'interactive-examples/ApplDeleteTransaction', - 'interactive-examples/ApplUpdateTransaction', 'interactive-examples/PaymentTransactionOverrideSigner' + 'interactive-examples/ApplUpdateTransaction', 'interactive-examples/PaymentTransactionOverrideSigner', + 'interactive-examples/TealSign' ], }, ], diff --git a/src/components/TealSignExample.tsx b/src/components/TealSignExample.tsx new file mode 100644 index 0000000..27399b4 --- /dev/null +++ b/src/components/TealSignExample.tsx @@ -0,0 +1,122 @@ +import ExecutionEnvironment from '@docusaurus/ExecutionEnvironment'; +import React, { useContext, useState } from "react"; +import { Button, Col, Label, Nav, NavItem, NavLink, Row, TabContent, TabPane } from "reactstrap"; +import PreLoadDataContextComponent, { PreLoadDataContext } from '../context/preLoadedData'; +import Address from "./commons/Address"; +import PrismCode from './commons/Code'; +import AccountDropdown from "./commons/FromDropdown"; +import Note from "./commons/Note"; +import "./interactive-examples.scss"; + +const tealSignCode = + ` +import MyAlgoConnect from '@randlabs/myalgo-connect'; + +const myAlgoConnect = new MyAlgoConnect(); + +const data = new Uint8Array([...]); +const contractAddress = '46Q...'; +const signer = 'MKJ...'; + +const signature = await myAlgoConnect.tealSign(data, contractAddress, signer); +` + +function TealSignExample(): JSX.Element { + const preLoadedData = useContext(PreLoadDataContext); + const accountslist = ExecutionEnvironment.canUseDOM && window.sharedAccounts && Array.isArray(window.sharedAccounts) ? window.sharedAccounts : []; + const [accounts, setAccount] = useState(accountslist); + const [accountSelected, selectAccount] = useState(""); + const [data, setData] = useState(); + const [contractAddress, setContractAddress] = useState(""); + const [response, setResponse] = useState(""); + const [activeTab, setActiveTab] = useState('1'); + + const toggle = (tab: React.SetStateAction) => { + if (activeTab !== tab) setActiveTab(tab); + } + + const onSignData = async () => { + try { + const signature = await preLoadedData.myAlgoWallet.tealSign(data || [], contractAddress, accountSelected); + + setResponse(Buffer.from(signature).toString('base64')); + } + catch (err) { + console.error(err) + setResponse(JSON.stringify(err, null, 4)); + } + } + + return ( +
+ + + + + + +
+ + + + + +
+ +
+ + + + {accounts.length === 0 && +
In order to run this example, you need to execute connect() method.
+ } + + + + + + + + + + +
+ ) +} + +export default () => ; \ No newline at end of file diff --git a/src/components/commons/Note.tsx b/src/components/commons/Note.tsx index 31f0426..9baefa0 100644 --- a/src/components/commons/Note.tsx +++ b/src/components/commons/Note.tsx @@ -4,6 +4,7 @@ import { FormGroup, Input, Label } from "reactstrap"; interface NoteProps { disabled?: boolean; onChangeNote(note: Uint8Array): void; + label?: string } export default function Note(props: NoteProps): JSX.Element { @@ -17,12 +18,12 @@ export default function Note(props: NoteProps): JSX.Element { return Date: Tue, 31 May 2022 18:58:00 -0300 Subject: [PATCH 2/3] Add link to algosdk tealSign docs. Disable button in tealSign example if the user has not connected their wallet --- docs/getting-started/myalgo-connect-api.md | 2 ++ docs/interactive-examples/TealSign.mdx | 2 ++ src/components/TealSignExample.tsx | 2 +- 3 files changed, 5 insertions(+), 1 deletion(-) diff --git a/docs/getting-started/myalgo-connect-api.md b/docs/getting-started/myalgo-connect-api.md index 5b5cf2d..2368793 100644 --- a/docs/getting-started/myalgo-connect-api.md +++ b/docs/getting-started/myalgo-connect-api.md @@ -189,6 +189,8 @@ signLogicSig(logic: Uint8Array | Base64, address: Address): Promise; Sign an arbitrary piece of data which can be verified by a smart contract through the [ed25519verify](https://developer.algorand.org/docs/get-details/dapps/avm/teal/opcodes/#ed25519verify) opcode. +See also: [algosdk tealSign](https://algorand.github.io/js-algorand-sdk/modules.html#tealSign) + #### Signature and types ```jsx diff --git a/docs/interactive-examples/TealSign.mdx b/docs/interactive-examples/TealSign.mdx index 5eab64e..bc7dd8e 100644 --- a/docs/interactive-examples/TealSign.mdx +++ b/docs/interactive-examples/TealSign.mdx @@ -8,6 +8,8 @@ import TealSignExample from "../../src/components/TealSignExample" Sign an arbitrary piece of data which can be verified by a smart contract through the [ed25519verify](https://developer.algorand.org/docs/get-details/dapps/avm/teal/opcodes/#ed25519verify) opcode. +See also: [algosdk tealSign](https://algorand.github.io/js-algorand-sdk/modules.html#tealSign) + ### Preconditions * The user has already shared the account to sign the data with. diff --git a/src/components/TealSignExample.tsx b/src/components/TealSignExample.tsx index 27399b4..a66de72 100644 --- a/src/components/TealSignExample.tsx +++ b/src/components/TealSignExample.tsx @@ -72,7 +72,7 @@ function TealSignExample(): JSX.Element {
- From bf90b69d3b3c04172f5a4732e3c9d2aa26087c96 Mon Sep 17 00:00:00 2001 From: M-Picco Date: Thu, 2 Jun 2022 12:17:56 -0300 Subject: [PATCH 3/3] Bumb version. Set myalgo-connect version to v1.2.0 --- package-lock.json | 23 ++++++++++++++++++++--- package.json | 4 ++-- 2 files changed, 22 insertions(+), 5 deletions(-) diff --git a/package-lock.json b/package-lock.json index 7eff565..a94c630 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "homepage", - "version": "1.1.4", + "version": "1.2.0", "lockfileVersion": 1, "requires": true, "dependencies": { @@ -1899,8 +1899,9 @@ "integrity": "sha512-CuJNwtMTG1LHR1LQNWUPv+8xPUdkRY9p61wGJEp8J/N3q8djmnMySvSQlyVqLBvXsTPKmYc0ZmfXEXCpb5P5Cw==" }, "@randlabs/myalgo-connect": { - "version": "git+https://github.com/randlabs/myalgo-connect.git#8e06e535867df149d1bc722abdeaeae3dfc3a3af", - "from": "git+https://github.com/randlabs/myalgo-connect.git#tealSign", + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/@randlabs/myalgo-connect/-/myalgo-connect-1.2.0.tgz", + "integrity": "sha512-eUuv90M4LBrdL+A6qTrOqaICeRqmwZKW7JIfgaM6GgmfDopf8ugdK0gA2TuaCvCytA/NahEnsM5+Eup/ngUsLA==", "requires": { "@randlabs/communication-bridge": "^1.0.0" } @@ -3122,6 +3123,15 @@ "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz", "integrity": "sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==" }, + "bindings": { + "version": "1.5.0", + "resolved": "https://registry.npmjs.org/bindings/-/bindings-1.5.0.tgz", + "integrity": "sha512-p2q/t/mhvuOj/UeLlV6566GD/guowlr0hHxClI0W9m7MWYkL1F0hLo+0Aexs9HSPCtR1SXQ0TD3MMKrXZajbiQ==", + "optional": true, + "requires": { + "file-uri-to-path": "1.0.0" + } + }, "bluebird": { "version": "3.7.2", "resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.7.2.tgz", @@ -5220,6 +5230,12 @@ "schema-utils": "^3.0.0" } }, + "file-uri-to-path": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz", + "integrity": "sha512-0Zt+s3L7Vf1biwWZ29aARiVYLx7iMGnEUl9x33fbB/j3jR81u/O2LbqK+Bm1CDSNDKVtJ/YjwY7TUd5SkeLQLw==", + "optional": true + }, "filesize": { "version": "6.1.0", "resolved": "https://registry.npmjs.org/filesize/-/filesize-6.1.0.tgz", @@ -12113,6 +12129,7 @@ "integrity": "sha512-oWb1Z6mkHIskLzEJ/XWX0srkpkTQ7vaopMQkyaEIoq0fmtFVxOthb8cCxeT+p3ynTdkk/RZwbgG4brR5BeWECw==", "optional": true, "requires": { + "bindings": "^1.5.0", "nan": "^2.12.1" } }, diff --git a/package.json b/package.json index 8e6c0cd..2a015bf 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "homepage", - "version": "1.1.4", + "version": "1.2.0", "private": true, "scripts": { "docusaurus": "docusaurus", @@ -17,7 +17,7 @@ "@docusaurus/core": "^2.0.0-beta.3", "@docusaurus/preset-classic": "^2.0.0-beta.3", "@mdx-js/react": "^1.6.21", - "@randlabs/myalgo-connect": "git+https://github.com/randlabs/myalgo-connect.git#tealSign", + "@randlabs/myalgo-connect": "^1.2.0", "@svgr/webpack": "^5.5.0", "algosdk": "^1.10.1", "bootstrap": "^5.0.2",