StakingTransfer getValues

packages/app-testing/src/Account/index.js

@@ -20,7 +20,13 @@ type Props = BaseProps & {
 };
 
 export default function Account ({ className, label, subject, style }: Props) {
-  const AccountBalance = withObservableParams(Balance, subject);
+  const AccountBalance = withObservableParams(Balance, subject, (pair: KeyringPair) => {
+    if (!pair) {
+      return new Uint8Array([]);
+    }
+
+    return pair.publicKey();
+  });
 
   return (
     <div

packages/app-testing/src/App/index.js

@@ -11,6 +11,7 @@ import React from 'react';
 
 import CallDisplay from '../CallDisplay';
 import CallSelect from '../CallSelect';
+import Nonce from '../Nonce';
 import Sender from '../Sender';
 
 type Props = BaseProps & {};
@@ -23,6 +24,7 @@ export default function App ({ className, style }: Props) {
     >
       <Sender />
       <CallSelect />
+      <Nonce />
       <CallDisplay />
     </div>
   );

packages/app-testing/src/CallDisplay/index.js

@@ -29,6 +29,9 @@ function CallDisplay ({ className, style, value }: Props) {
   }
 
   const Component = COMPONENTS[value] || ErrorComponent;
+  const onSubmit = () => {
+    console.log('getValues', Component.getValues());
+  };
 
   return (
     <div
@@ -38,6 +41,7 @@ function CallDisplay ({ className, style, value }: Props) {
       <Component className='testing--CallDisplay-Component' />
       <Button
         className='testing--CallDisplay-Execute'
+        onClick={onSubmit}
         primary
       >
         Submit Extrinsic

packages/app-testing/src/Nonce/Nonce.css

@@ -0,0 +1,6 @@
+/* Copyright 2017-2018 Jaco Greeff
+/* This software may be modified and distributed under the terms
+/* of the ISC license. See the LICENSE file for details. */
+
+.testing--Sender {
+}

packages/app-testing/src/Nonce/index.js

@@ -0,0 +1,51 @@
+// Copyright 2017-2018 Jaco Greeff
+// This software may be modified and distributed under the terms
+// of the ISC license. See the LICENSE file for details.
+// @flow
+
+import type { BaseProps } from '@polkadot/portal/types';
+
+import './Nonce.css';
+
+import React from 'react';
+import Label from 'semantic-ui-react/dist/es/elements/Label';
+import RxNonce from '@polkadot/rx-react/Nonce';
+import withObservableParams from '@polkadot/rx-react/with/observableParams';
+import u8aToBn from '@polkadot/util/u8a/toBn';
+
+import addrSender from '../subject/addrSender';
+import nonceSender from '../subject/nonceSender';
+
+type Props = BaseProps & {};
+
+const SenderNonce = withObservableParams(RxNonce, addrSender, (pair: KeyringPair) => {
+  if (!pair) {
+    return new Uint8Array([]);
+  }
+
+  return pair.publicKey();
+});
+const onNonceChange = (value: Uint8Array) => {
+  if (!value || value.length !== 8) {
+    return;
+  }
+
+  nonceSender.next(u8aToBn(value, 64, true));
+};
+
+export default function Nonce ({ className, style }: Props) {
+  return (
+    <div
+      className={['testing--split', className].join(' ')}
+      style={style}
+    >
+      <div className='small'>
+        <Label>with an index</Label>
+        <SenderNonce
+          className='ui disabled dropdown selection'
+          onChange={onNonceChange}
+        />
+      </div>
+    </div>
+  );
+}

packages/app-testing/src/Sender/index.js

@@ -8,47 +8,19 @@ import type { BaseProps } from '@polkadot/portal/types';
 import './Sender.css';
 
 import React from 'react';
-import Label from 'semantic-ui-react/dist/es/elements/Label';
-import Nonce from '@polkadot/rx-react/Nonce';
-import withObservableParams from '@polkadot/rx-react/with/observableParams';
-import u8aToBn from '@polkadot/util/u8a/toBn';
 
 import Account from '../Account';
 import addrSender from '../subject/addrSender';
-import nonceSender from '../subject/nonceSender';
 
 type Props = BaseProps & {};
 
-const onNonceChange = (value: Uint8Array) => {
-  if (!value || value.length !== 8) {
-    return;
-  }
-
-  const bn = u8aToBn(value, 64, true);
-
-  console.log('next nonce', bn.toString());
-
-  nonceSender.next(bn);
-};
-
 export default function Sender (props: Props) {
-  const SenderNonce = withObservableParams(Nonce, addrSender);
-
-  return [
+  return (
     <Account
       {...props}
       className={['testing--Sender', props.className].join(' ')}
       label='using the selected account'
       subject={addrSender}
-    />,
-    <div className='testing--split'>
-      <div className='small'>
-        <Label>with an future index</Label>
-        <SenderNonce
-          className='ui disabled dropdown selection'
-          onChange={onNonceChange}
-        />
-      </div>
-    </div>
-  ];
+    />
+  );
 }

packages/app-testing/src/StakingTransfer/getValues.js

@@ -0,0 +1,14 @@
+// Copyright 2017-2018 Jaco Greeff
+// This software may be modified and distributed under the terms
+// of the ISC license. See the LICENSE file for details.
+// @flow
+
+import amount from './subject/amount';
+import addrRecipient from '../subject/addrRecipient';
+
+export default function getValues (): Array<mixed> {
+  return [
+    addrRecipient.getValue(),
+    amount.getValue()
+  ];
+}

packages/app-testing/src/StakingTransfer/index.js

@@ -7,15 +7,22 @@ import type { BaseProps } from '@polkadot/portal/types';
 
 import './StakingTransfer.css';
 
+import BN from 'bn.js';
 import React from 'react';
 import Input from 'semantic-ui-react/dist/es/elements/Input';
 import Label from 'semantic-ui-react/dist/es/elements/Label';
 
 import Recipient from '../Recipient';
+import getValues from './getValues';
+import amount from './subject/amount';
 
 type Props = BaseProps & {};
 
-export default function StakingTransfer ({ className, style }: Props) {
+const onChangeAmount = (event, { value }) => {
+  amount.next(new BN(value));
+};
+
+function StakingTransfer ({ className, style }: Props) {
   return (
     <div
       className={['testing--StakingTransfer', className].join(' ')}
@@ -27,6 +34,7 @@ export default function StakingTransfer ({ className, style }: Props) {
           <Input
             defaultValue={0}
             min={0}
+            onChange={onChangeAmount}
             type='number'
           />
         </div>
@@ -36,3 +44,7 @@ export default function StakingTransfer ({ className, style }: Props) {
     </div>
   );
 }
+
+StakingTransfer.getValues = getValues;
+
+export default StakingTransfer;

packages/app-testing/src/StakingTransfer/subject/amount.js

@@ -0,0 +1,10 @@
+// Copyright 2017-2018 Jaco Greeff
+// This software may be modified and distributed under the terms
+// of the ISC license. See the LICENSE file for details.
+// @flow
+
+import { BehaviorSubject } from 'rxjs/BehaviorSubject';
+
+const subject = new BehaviorSubject();
+
+export default subject;

packages/app-testing/src/subject/addr.js

@@ -1,21 +0,0 @@
-// Copyright 2017-2018 Jaco Greeff
-// This software may be modified and distributed under the terms
-// of the ISC license. See the LICENSE file for details.
-// @flow
-
-import type { KeyringPair } from '@polkadot/uti-keyring/types';
-
-import { map } from 'rxjs/operators/map';
-import { ReplaySubject } from 'rxjs/ReplaySubject';
-
-export default function addr (): $rxjs$ReplaySubject {
-  return new ReplaySubject(1).pipe(
-    map((pair: KeyringPair) => {
-      if (!pair) {
-        return new Uint8Array([]);
-      }
-
-      return pair.publicKey();
-    })
-  );
-}

packages/app-testing/src/subject/addrRecipient.js

@@ -3,8 +3,8 @@
 // of the ISC license. See the LICENSE file for details.
 // @flow
 
-import addr from './addr';
+import { BehaviorSubject } from 'rxjs/BehaviorSubject';
 
-const subject = addr();
+const subject = new BehaviorSubject();
 
 export default subject;

packages/app-testing/src/subject/addrSender.js

@@ -3,8 +3,8 @@
 // of the ISC license. See the LICENSE file for details.
 // @flow
 
-import addr from './addr';
+import { BehaviorSubject } from 'rxjs/BehaviorSubject';
 
-const subject = addr();
+const subject = new BehaviorSubject();
 
 export default subject;