feat: add memo to tx form, closes #216

leather-io · Sep 24, 2020 · 04fe13a · 04fe13a
1 parent 74ab3d3
commit 04fe13a
Show file tree

Hide file tree

Showing 5 changed files with 66 additions and 41 deletions.
diff --git a/app/modals/transaction/transaction-form.tsx b/app/modals/transaction/transaction-form.tsx
@@ -8,7 +8,7 @@ import { toHumanReadableStx } from '../../utils/unit-convert';
 
 interface TxModalFormProps {
   balance: string;
-  form: FormikProps<{ recipient: string; amount: string }>;
+  form: FormikProps<{ recipient: string; amount: string; memo: string }>;
 }
 
 export const TxModalForm: FC<TxModalFormProps> = ({ balance, form }) => {
@@ -55,6 +55,23 @@ export const TxModalForm: FC<TxModalFormProps> = ({ balance, form }) => {
             <ErrorText>{capitalize(form.errors.amount)}</ErrorText>
           </ErrorLabel>
         )}
+        <Text textStyle="body.small.medium" mt="base-loose" as="label">
+          <label htmlFor="stxAmount">Memo</label>
+        </Text>
+        <Input
+          id="memo"
+          name="memo"
+          inputMode="numeric"
+          mt="base-tight"
+          placeholder="Memo"
+          onChange={form.handleChange}
+          value={form.values.memo}
+        />
+        {form.touched.memo && form.errors.memo && (
+          <ErrorLabel>
+            <ErrorText>{capitalize(form.errors.memo)}</ErrorText>
+          </ErrorLabel>
+        )}
       </Flex>
     </Box>
   );

diff --git a/app/modals/transaction/transaction-modal.tsx b/app/modals/transaction/transaction-modal.tsx
@@ -7,8 +7,8 @@ import { BigNumber } from 'bignumber.js';
 import { Modal, Text, Button, Box } from '@blockstack/ui';
 import {
   makeSTXTokenTransfer,
-  makeUnsignedSTXTokenTransfer,
   pubKeyfromPrivKey,
+  MEMO_MAX_LENGTH_BYTES,
 } from '@blockstack/stacks-transactions';
 import { useHotkeys } from 'react-hotkeys-hook';
 
@@ -38,7 +38,6 @@ import {
 import { TxModalForm } from './transaction-form';
 import { DecryptWalletForm } from './decrypt-wallet-form';
 import { SignTxWithLedger } from './sign-tx-with-ledger';
-import { StacksTransaction } from '@blockstack/stacks-transactions';
 import BlockstackApp from '../../../../ledger-blockstack/js/src/index';
 import { MessageSignature } from '@blockstack/stacks-transactions/lib/authorization';
 import { selectPublicKey } from '../../store/keys/keys.reducer';
@@ -200,11 +199,13 @@ export const TransactionModal: FC<TxModalProps> = ({ balance, address }) => {
   };
 
   const totalIsMoreThanBalance = total.isGreaterThan(balance);
-
+  const exceedsMaxLengthBytes = (string: string, maxLengthBytes: number): boolean =>
+    string ? Buffer.from(string).length > maxLengthBytes : false;
   const form = useFormik({
     initialValues: {
       recipient: '',
       amount: '',
+      memo: '',
     },
     validationSchema: yup.object().shape({
       recipient: yup
@@ -245,6 +246,13 @@ export const TransactionModal: FC<TxModalProps> = ({ balance, address }) => {
           }
         )
         .required(),
+      memo: yup
+        .string()
+        .test(
+          'test-max-memo-length',
+          'Transaction memo cannot exceed 34 bytes',
+          (value = '') => !exceedsMaxLengthBytes(value, MEMO_MAX_LENGTH_BYTES)
+        ),
     }),
     onSubmit: async () => {
       setLoading(true);

diff --git a/app/pages/onboarding/04-connect-ledger/connect-ledger.tsx b/app/pages/onboarding/04-connect-ledger/connect-ledger.tsx
@@ -14,7 +14,6 @@ import {
 } from '../../../components/onboarding';
 import { setLedgerWallet } from '../../../store/keys';
 
-import { ERROR_CODE } from '../../../../../ledger-blockstack/js/src/common';
 import { delay } from '../../../utils/delay';
 import { LedgerConnectInstructions } from '../../../components/ledger/ledger-connect-instructions';
 import { useLedger } from '../../../hooks/use-ledger';
@@ -53,7 +52,8 @@ export const ConnectLedger: React.FC = () => {
       console.log(version);
 
       const confirmedResponse = await app.showAddressAndPubKey(STX_DERIVATION_PATH);
-      if (confirmedResponse.returnCode !== ERROR_CODE.NoError) {
+      // TODO: Replace with ref to LedgerError
+      if (confirmedResponse.returnCode !== 0x90000) {
         console.log('resp', confirmedResponse);
         setDeviceError('Has your Ledger device locked itself?');
         return;

diff --git a/package.json b/package.json
@@ -16,7 +16,7 @@
     "build-renderer": "cross-env NODE_ENV=production webpack --config ./configs/webpack.config.renderer.prod.babel.js --colors",
     "dev": "cross-env START_HOT=1 node -r @babel/register ./internals/scripts/CheckPortInUse.js && cross-env START_HOT=1 yarn start-renderer-dev",
     "electron-rebuild": "electron-rebuild --parallel --force --types prod,dev,optional --module-dir app",
-    "lint:eslint": "eslint app/**/*.{ts,tsx}",
+    "lint:eslint": "eslint \"app/**/*.{ts,tsx}\"",
     "package": "yarn build && electron-builder build --publish never",
     "package-all": "yarn build && electron-builder build -mwl",
     "package-ci": "yarn postinstall && yarn build && electron-builder --publish always",
@@ -147,8 +147,8 @@
     "@types/webpack-merge": "4.1.5",
     "@types/yup": "0.29.3",
     "@types/zxcvbn": "4.4.0",
-    "@typescript-eslint/eslint-plugin": "3.7.0",
-    "@typescript-eslint/parser": "3.7.0",
+    "@typescript-eslint/eslint-plugin": "3.9.0",
+    "@typescript-eslint/parser": "3.9.0",
     "babel-core": "7.0.0-bridge.0",
     "babel-eslint": "10.1.0",
     "babel-jest": "26.1.0",

diff --git a/yarn.lock b/yarn.lock
@@ -2351,12 +2351,12 @@
     semver "^7.3.2"
     tsutils "^3.17.1"
 
-"@typescript-eslint/eslint-plugin@3.7.0":
-  version "3.7.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/eslint-plugin/-/eslint-plugin-3.7.0.tgz#0f91aa3c83d019591719e597fbdb73a59595a263"
-  integrity sha512-4OEcPON3QIx0ntsuiuFP/TkldmBGXf0uKxPQlGtS/W2F3ndYm8Vgdpj/woPJkzUc65gd3iR+qi3K8SDQP/obFg==
+"@typescript-eslint/eslint-plugin@3.9.0":
+  version "3.9.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/eslint-plugin/-/eslint-plugin-3.9.0.tgz#0fe529b33d63c9a94f7503ca2bb12c84b9477ff3"
+  integrity sha512-UD6b4p0/hSe1xdTvRCENSx7iQ+KR6ourlZFfYuPC7FlXEzdHuLPrEmuxZ23b2zW96KJX9Z3w05GE/wNOiEzrVg==
   dependencies:
-    "@typescript-eslint/experimental-utils" "3.7.0"
+    "@typescript-eslint/experimental-utils" "3.9.0"
     debug "^4.1.1"
     functional-red-black-tree "^1.0.1"
     regexpp "^3.0.0"
@@ -2373,14 +2373,14 @@
     eslint-scope "^5.0.0"
     eslint-utils "^2.0.0"
 
-"@typescript-eslint/experimental-utils@3.7.0":
-  version "3.7.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/experimental-utils/-/experimental-utils-3.7.0.tgz#0ee21f6c48b2b30c63211da23827725078d5169a"
-  integrity sha512-xpfXXAfZqhhqs5RPQBfAFrWDHoNxD5+sVB5A46TF58Bq1hRfVROrWHcQHHUM9aCBdy9+cwATcvCbRg8aIRbaHQ==
+"@typescript-eslint/experimental-utils@3.9.0":
+  version "3.9.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/experimental-utils/-/experimental-utils-3.9.0.tgz#3171d8ddba0bf02a8c2034188593630914fcf5ee"
+  integrity sha512-/vSHUDYizSOhrOJdjYxPNGfb4a3ibO8zd4nUKo/QBFOmxosT3cVUV7KIg8Dwi6TXlr667G7YPqFK9+VSZOorNA==
   dependencies:
     "@types/json-schema" "^7.0.3"
-    "@typescript-eslint/types" "3.7.0"
-    "@typescript-eslint/typescript-estree" "3.7.0"
+    "@typescript-eslint/types" "3.9.0"
+    "@typescript-eslint/typescript-estree" "3.9.0"
     eslint-scope "^5.0.0"
     eslint-utils "^2.0.0"
 
@@ -2394,21 +2394,21 @@
     "@typescript-eslint/typescript-estree" "3.0.2"
     eslint-visitor-keys "^1.1.0"
 
-"@typescript-eslint/parser@3.7.0":
-  version "3.7.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/parser/-/parser-3.7.0.tgz#3e9cd9df9ea644536feb6e5acdb8279ecff96ce9"
-  integrity sha512-2LZauVUt7jAWkcIW7djUc3kyW+fSarNEuM3RF2JdLHR9BfX/nDEnyA4/uWz0wseoWVZbDXDF7iF9Jc342flNqQ==
+"@typescript-eslint/parser@3.9.0":
+  version "3.9.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/parser/-/parser-3.9.0.tgz#344978a265d9a5c7c8f13e62c78172a4374dabea"
+  integrity sha512-rDHOKb6uW2jZkHQniUQVZkixQrfsZGUCNWWbKWep4A5hGhN5dLHMUCNAWnC4tXRlHedXkTDptIpxs6e4Pz8UfA==
   dependencies:
     "@types/eslint-visitor-keys" "^1.0.0"
-    "@typescript-eslint/experimental-utils" "3.7.0"
-    "@typescript-eslint/types" "3.7.0"
-    "@typescript-eslint/typescript-estree" "3.7.0"
+    "@typescript-eslint/experimental-utils" "3.9.0"
+    "@typescript-eslint/types" "3.9.0"
+    "@typescript-eslint/typescript-estree" "3.9.0"
     eslint-visitor-keys "^1.1.0"
 
-"@typescript-eslint/types@3.7.0":
-  version "3.7.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/types/-/types-3.7.0.tgz#09897fab0cb95479c01166b10b2c03c224821077"
-  integrity sha512-reCaK+hyKkKF+itoylAnLzFeNYAEktB0XVfSQvf0gcVgpz1l49Lt6Vo9x4MVCCxiDydA0iLAjTF/ODH0pbfnpg==
+"@typescript-eslint/types@3.9.0":
+  version "3.9.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/types/-/types-3.9.0.tgz#be9d0aa451e1bf3ce99f2e6920659e5b2e6bfe18"
+  integrity sha512-rb6LDr+dk9RVVXO/NJE8dT1pGlso3voNdEIN8ugm4CWM5w5GimbThCMiMl4da1t5u3YwPWEwOnKAULCZgBtBHg==
 
 "@typescript-eslint/typescript-estree@3.0.2":
   version "3.0.2"
@@ -2423,24 +2423,24 @@
     semver "^7.3.2"
     tsutils "^3.17.1"
 
-"@typescript-eslint/typescript-estree@3.7.0":
-  version "3.7.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/typescript-estree/-/typescript-estree-3.7.0.tgz#66872e6da120caa4b64e6b4ca5c8702afc74738d"
-  integrity sha512-xr5oobkYRebejlACGr1TJ0Z/r0a2/HUf0SXqPvlgUMwiMqOCu/J+/Dr9U3T0IxpE5oLFSkqMx1FE/dKaZ8KsOQ==
+"@typescript-eslint/typescript-estree@3.9.0":
+  version "3.9.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/typescript-estree/-/typescript-estree-3.9.0.tgz#c6abbb50fa0d715cab46fef67ca6378bf2eaca13"
+  integrity sha512-N+158NKgN4rOmWVfvKOMoMFV5n8XxAliaKkArm/sOypzQ0bUL8MSnOEBW3VFIeffb/K5ce/cAV0yYhR7U4ALAA==
   dependencies:
-    "@typescript-eslint/types" "3.7.0"
-    "@typescript-eslint/visitor-keys" "3.7.0"
+    "@typescript-eslint/types" "3.9.0"
+    "@typescript-eslint/visitor-keys" "3.9.0"
     debug "^4.1.1"
     glob "^7.1.6"
     is-glob "^4.0.1"
     lodash "^4.17.15"
     semver "^7.3.2"
     tsutils "^3.17.1"
 
-"@typescript-eslint/visitor-keys@3.7.0":
-  version "3.7.0"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/visitor-keys/-/visitor-keys-3.7.0.tgz#ac0417d382a136e4571a0b0dcfe52088cb628177"
-  integrity sha512-k5PiZdB4vklUpUX4NBncn5RBKty8G3ihTY+hqJsCdMuD0v4jofI5xuqwnVcWxfv6iTm2P/dfEa2wMUnsUY8ODw==
+"@typescript-eslint/visitor-keys@3.9.0":
+  version "3.9.0"
+  resolved "https://registry.yarnpkg.com/@typescript-eslint/visitor-keys/-/visitor-keys-3.9.0.tgz#44de8e1b1df67adaf3b94d6b60b80f8faebc8dd3"
+  integrity sha512-O1qeoGqDbu0EZUC/MZ6F1WHTIzcBVhGqDj3LhTnj65WUA548RXVxUHbYhAW9bZWfb2rnX9QsbbP5nmeJ5Z4+ng==
   dependencies:
     eslint-visitor-keys "^1.1.0"