diff --git a/app/components/PayForm/PayForm.js b/app/components/PayForm/PayForm.js new file mode 100644 index 00000000..e18787f8 --- /dev/null +++ b/app/components/PayForm/PayForm.js @@ -0,0 +1,20 @@ +import React, { Component } from 'react' +import PropTypes from 'prop-types' +import styles from './PayForm.scss' + +class PayForm extends Component { + render() { + console.log('props: ', this.props) + return ( +
+ payform +
+ ) + } +} + +PayForm.propTypes = { + +} + +export default PayForm diff --git a/app/components/PayForm/PayForm.scss b/app/components/PayForm/PayForm.scss new file mode 100644 index 00000000..e69de29b diff --git a/app/components/PayForm/index.js b/app/components/PayForm/index.js new file mode 100644 index 00000000..6e43e934 --- /dev/null +++ b/app/components/PayForm/index.js @@ -0,0 +1,3 @@ +import PayForm from './PayForm' + +export default PayForm \ No newline at end of file diff --git a/app/reducers/index.js b/app/reducers/index.js index 4c906733..be2248f0 100644 --- a/app/reducers/index.js +++ b/app/reducers/index.js @@ -7,7 +7,10 @@ import balance from './balance' import payment from './payment' import peers from './peers' import channels from './channels' + import form from './form' +import payform from './payform' + import invoice from './invoice' import modal from './modal' import address from './address' @@ -22,7 +25,10 @@ const rootReducer = combineReducers({ payment, peers, channels, + form, + payform, + invoice, modal, address, diff --git a/app/reducers/payform.js b/app/reducers/payform.js new file mode 100644 index 00000000..00e0ca9e --- /dev/null +++ b/app/reducers/payform.js @@ -0,0 +1,83 @@ +import { createSelector } from 'reselect' +import bitcoin from 'bitcoinjs-lib' + +// Initial State +const initialState = { + amount: '0', + payInput: '' +} + +// Constants +// ------------------------------------ +export const SET_PAY_AMOUNT = 'SET_PAY_AMOUNT' +export const SET_PAY_INPUT = 'SET_PAY_INPUT' + +export const RESET_FORM = 'RESET_FORM' + +// ------------------------------------ +// Actions +// ------------------------------------ +export function setPayAmount(amount) { + return { + type: SET_PAY_AMOUNT, + amount + } +} + +export function setPayInput(payInput) { + return { + type: SET_PAY_INPUT, + payInput + } +} + +export function resetForm() { + return { + type: RESET_FORM + } +} + +// ------------------------------------ +// Action Handlers +// ------------------------------------ +const ACTION_HANDLERS = { + [SET_PAY_AMOUNT]: (state, { amount }) => ({ ...state, amount }), + [SET_PAY_INPUT]: (state, { payInput }) => ({ ...state, payInput }), + [RESET_FORM]: () => (initialState) +} + +// ------------------------------------ +// Selector +// ------------------------------------ +const payFormSelectors = {} +const payInputSelector = state => state.payform.payInput + +payFormSelectors.isOnchain = createSelector( + payInputSelector, + (input) => { + // TODO: work with bitcoin-js to fix p2wkh error and make testnet/mainnet dynamic + try { + bitcoin.address.toOutputScript(input, bitcoin.networks.testnet) + return true + } catch (e) { + return false + } + } +) + +// TODO: Add more robust logic to detect a LN payment request +payFormSelectors.isLn = createSelector( + payInputSelector, + input => input.length === 124 +) + +export { payFormSelectors } + +// ------------------------------------ +// Reducer +// ------------------------------------ +export default function payFormReducer(state = initialState, action) { + const handler = ACTION_HANDLERS[action.type] + + return handler ? handler(state, action) : state +} diff --git a/app/reducers/requestform.js b/app/reducers/requestform.js new file mode 100644 index 00000000..e69de29b diff --git a/app/routes/app/components/App.js b/app/routes/app/components/App.js index a46f155a..9a838cef 100644 --- a/app/routes/app/components/App.js +++ b/app/routes/app/components/App.js @@ -38,6 +38,11 @@ class App extends Component { currentTicker, isOnchain, isLn, + + showModal, + + payFormProps, + children } = this.props @@ -79,6 +84,9 @@ class App extends Component { setCurrency={setCurrency} formClicked={formType => setForm({ modalOpen: true, formType })} currentTicker={currentTicker} + + showModal={showModal} + payFormProps={payFormProps} />
{children} diff --git a/app/routes/app/components/components/ModalRoot/ModalRoot.js b/app/routes/app/components/components/ModalRoot/ModalRoot.js index 1146c57e..7f4a1287 100644 --- a/app/routes/app/components/components/ModalRoot/ModalRoot.js +++ b/app/routes/app/components/components/ModalRoot/ModalRoot.js @@ -1,11 +1,13 @@ import React from 'react' import PropTypes from 'prop-types' import { MdClose } from 'react-icons/lib/md' +import PayForm from 'components/PayForm' import SuccessfulSendCoins from './SuccessfulSendCoins' import styles from './ModalRoot.scss' const MODAL_COMPONENTS = { - SUCCESSFUL_SEND_COINS: SuccessfulSendCoins + SUCCESSFUL_SEND_COINS: SuccessfulSendCoins, + PAY_FORM: PayForm /* other modals */ } diff --git a/app/routes/app/components/components/Nav.js b/app/routes/app/components/components/Nav.js index c55148ca..a824f29f 100644 --- a/app/routes/app/components/components/Nav.js +++ b/app/routes/app/components/components/Nav.js @@ -9,7 +9,7 @@ import CurrencyIcon from 'components/CurrencyIcon' import { btc, usd } from 'utils' import styles from './Nav.scss' -const Nav = ({ ticker, balance, setCurrency, formClicked, currentTicker }) => ( +const Nav = ({ ticker, balance, setCurrency, formClicked, currentTicker, showModal, payFormProps }) => (