diff --git a/app/components/Form/Form.js b/app/components/Form/Form.js index a722ef97..e1f383d9 100644 --- a/app/components/Form/Form.js +++ b/app/components/Form/Form.js @@ -33,7 +33,6 @@ const Form = ({ formType, closeForm }) => { Form.propTypes = { formType: PropTypes.string, - formProps: PropTypes.object.isRequired, closeForm: PropTypes.func.isRequired } diff --git a/app/components/Form/Request/Request.js b/app/components/Form/Request/Request.js deleted file mode 100644 index 9e1c612d..00000000 --- a/app/components/Form/Request/Request.js +++ /dev/null @@ -1,113 +0,0 @@ -import React from 'react' -import PropTypes from 'prop-types' -import { btc } from 'lib/utils' -import Hand from 'components/Icon/Hand' -import AmountInput from 'components/AmountInput' -import { Button, Dropdown } from 'components/UI' -import { FormattedNumber, FormattedMessage, injectIntl } from 'react-intl' -import messages from './messages' -import styles from './Request.scss' - -const Request = ({ - requestform: { amount, memo }, - ticker, - setRequestAmount, - setRequestMemo, - setCurrency, - requestFiatAmount, - currencyFilters, - onRequestSubmit, - intl -}) => { - const onCurrencyFilterClick = currency => { - // change the input amount - setRequestAmount(btc.convert(ticker.currency, currency, amount)) - setCurrency(currency) - } - - return ( -
-
- -

- -

-
- -
-
-
- - -
-
- - -
- -
- {'≈ '} - -
-
- -
-
- -
-
- setRequestMemo(event.target.value)} - id="memo" - /> -
-
- -
- -
-
-
- ) -} - -Request.propTypes = { - requestform: PropTypes.shape({ - amount: PropTypes.oneOfType([PropTypes.string, PropTypes.number]), - memo: PropTypes.string - }).isRequired, - requestFiatAmount: PropTypes.oneOfType([PropTypes.string, PropTypes.number]), - currencyName: PropTypes.string.isRequired, - currencyFilters: PropTypes.array.isRequired, - setRequestAmount: PropTypes.func.isRequired, - setRequestMemo: PropTypes.func.isRequired, - onRequestSubmit: PropTypes.func.isRequired, - setCurrency: PropTypes.func.isRequired, - - ticker: PropTypes.object.isRequired -} - -export default injectIntl(Request) diff --git a/app/components/Form/Request/Request.scss b/app/components/Form/Request/Request.scss deleted file mode 100644 index f579b3f8..00000000 --- a/app/components/Form/Request/Request.scss +++ /dev/null @@ -1,88 +0,0 @@ -@import 'styles/variables.scss'; - -.container { - margin: 0 auto; - width: 500px; -} - -.header { - text-align: center; - padding-bottom: 20px; - color: var(--primaryText); - border-bottom: 1px solid $spaceborder; - - h1 { - font-size: 22px; - font-weight: 300; - margin-top: 10px; - letter-spacing: 1.5px; - } -} - -.content { - margin-top: 50px; - color: var(--primaryText); - - .memo { - margin-top: 35px; - } - - .amount .bottom { - display: flex; - flex-direction: row; - align-items: center; - - input { - font-size: 20px; - max-width: 150px; - border: 1px solid #404040; - border-radius: 4px; - padding: 15px; - } - } - - .top { - margin-bottom: 10px; - display: flex; - flex-direction: row; - justify-content: space-between; - align-items: center; - - label { - font-size: 14px; - } - } - - .bottom { - display: flex; - align-items: center; - - input { - background: transparent; - outline: none; - border: 1px solid #404040; - border-radius: 4px; - color: var(--lightningOrange); - -webkit-text-fill-color: var(--primaryText); - font-size: 20px; - width: 100%; - padding: 15px; - } - - input::-webkit-input-placeholder { - text-shadow: none; - -webkit-text-fill-color: initial; - } - } - - .fiatAmount { - margin-top: 10px; - opacity: 0.5; - font-size: 14px; - } - - .submit { - margin-top: 50px; - text-align: center; - } -} diff --git a/app/components/Form/Request/index.js b/app/components/Form/Request/index.js deleted file mode 100644 index 29b01605..00000000 --- a/app/components/Form/Request/index.js +++ /dev/null @@ -1,3 +0,0 @@ -import Request from './Request' - -export default Request diff --git a/app/components/Form/Request/messages.js b/app/components/Form/Request/messages.js deleted file mode 100644 index 99e5eac3..00000000 --- a/app/components/Form/Request/messages.js +++ /dev/null @@ -1,9 +0,0 @@ -import { defineMessages } from 'react-intl' - -export default defineMessages({ - title: 'Request Payment', - amount: 'Amount', - memo: 'Memo', - details: 'Details about the request', - request: 'Request' -}) diff --git a/app/containers/App.js b/app/containers/App.js index fd97f9d2..3bf5be5b 100644 --- a/app/containers/App.js +++ b/app/containers/App.js @@ -9,7 +9,6 @@ import { setCurrency, tickerSelectors } from 'reducers/ticker' import { closeWalletModal } from 'reducers/address' import { fetchInfo, infoSelectors } from 'reducers/info' import { setFormType } from 'reducers/form' -import { setRequestAmount, setRequestMemo, requestFormSelectors } from 'reducers/requestform' import { createInvoice, fetchInvoice } from 'reducers/invoice' import { lndSelectors } from 'reducers/lnd' import { @@ -52,8 +51,6 @@ const mapDispatchToProps = { closeWalletModal, fetchInfo, setFormType, - setRequestAmount, - setRequestMemo, createInvoice, fetchInvoice, clearError, @@ -114,7 +111,6 @@ const mapStateToProps = state => ({ currentTicker: tickerSelectors.currentTicker(state), currencyFilters: tickerSelectors.currencyFilters(state), currencyName: tickerSelectors.currencyName(state), - requestFiatAmount: requestFormSelectors.fiatAmount(state), syncPercentage: lndSelectors.syncPercentage(state), filteredNetworkNodes: contactFormSelectors.filteredNetworkNodes(state), @@ -132,35 +128,10 @@ const mapStateToProps = state => ({ }) const mergeProps = (stateProps, dispatchProps, ownProps) => { - const requestFormProps = { - requestform: stateProps.requestform, - ticker: stateProps.ticker, - - currencyFilters: stateProps.currencyFilters, - currencyName: stateProps.currencyName, - requestFiatAmount: stateProps.requestFiatAmount, - - setRequestAmount: dispatchProps.setRequestAmount, - setRequestMemo: dispatchProps.setRequestMemo, - setCurrency: dispatchProps.setCurrency, - - onRequestSubmit: () => - dispatchProps.createInvoice( - stateProps.requestform.amount, - stateProps.ticker.currency, - stateProps.requestform.memo - ) - } - const formProps = formType => { if (!formType) { return {} } - - if (formType === 'REQUEST_FORM') { - return requestFormProps - } - return {} } diff --git a/app/reducers/index.js b/app/reducers/index.js index 35b38af7..a079f95c 100644 --- a/app/reducers/index.js +++ b/app/reducers/index.js @@ -14,7 +14,6 @@ import channels from './channels' import contactsform from './contactsform' import form from './form' import pay from './pay' -import requestform from './requestform' import invoice from './invoice' import address from './address' import transaction from './transaction' @@ -43,7 +42,6 @@ const rootReducer = combineReducers({ contactsform, form, pay, - requestform, invoice, address, transaction, diff --git a/app/reducers/requestform.js b/app/reducers/requestform.js deleted file mode 100644 index 8ee892e6..00000000 --- a/app/reducers/requestform.js +++ /dev/null @@ -1,78 +0,0 @@ -import { createSelector } from 'reselect' -import { btc } from 'lib/utils' -import { tickerSelectors } from './ticker' - -// Initial State -const initialState = { - amount: '', - memo: '' -} - -// Constants -// ------------------------------------ -export const SET_REQUEST_AMOUNT = 'SET_REQUEST_AMOUNT' -export const SET_REQUEST_MEMO = 'SET_REQUEST_MEMO' -export const SET_PAY_INVOICE = 'SET_PAY_INVOICE' -export const RESET_FORM = 'RESET_FORM' - -// ------------------------------------ -// Actions -// ------------------------------------ -export function setRequestAmount(amount) { - return { - type: SET_REQUEST_AMOUNT, - amount - } -} - -export function setRequestMemo(memo) { - return { - type: SET_REQUEST_MEMO, - memo - } -} - -export function resetRequestForm() { - return { - type: RESET_FORM - } -} - -// ------------------------------------ -// Action Handlers -// ------------------------------------ -const ACTION_HANDLERS = { - [SET_REQUEST_AMOUNT]: (state, { amount }) => ({ ...state, amount }), - [SET_REQUEST_MEMO]: (state, { memo }) => ({ ...state, memo }), - [RESET_FORM]: () => initialState -} - -const requestFormSelectors = {} -const requestAmountSelector = state => state.requestform.amount -const currencySelector = state => state.ticker.currency -const fiatTickerSelector = state => state.ticker.fiatTicker - -requestFormSelectors.fiatAmount = createSelector( - requestAmountSelector, - currencySelector, - tickerSelectors.currentTicker, - fiatTickerSelector, - (amount, currency, currentTicker, fiatTicker) => { - if (!currentTicker || !currentTicker[fiatTicker].last) { - return false - } - - return btc.convert(currency, 'fiat', amount, currentTicker[fiatTicker].last) - } -) - -export { requestFormSelectors } - -// ------------------------------------ -// Reducer -// ------------------------------------ -export default function requestFormReducer(state = initialState, action) { - const handler = ACTION_HANDLERS[action.type] - - return handler ? handler(state, action) : state -} diff --git a/test/unit/components/Form.spec.js b/test/unit/components/Form.spec.js index 0d8fb5cc..7726b06e 100644 --- a/test/unit/components/Form.spec.js +++ b/test/unit/components/Form.spec.js @@ -8,41 +8,14 @@ import Request from 'containers/Request' configure({ adapter: new Adapter() }) -const requestFormProps = { - cryptoCurrency: 'btc', - cryptoCurrencyTicker: 'BTC', - cryptoCurrencies: [], - currentTicker: [], - cryptoName: 'Bitcoin', - fiatCurrency: 'USD', - fiatCurrencies: [], - createInvoice: jest.fn(), - setCryptoCurrency: jest.fn(), - setFiatCurrency: jest.fn() -} - -const payFormProps = { - cryptoCurrency: 'btc', - cryptoCurrencyTicker: 'BTC', - cryptoCurrencies: [], - currentTicker: [], - cryptoName: 'Bitcoin', - fiatCurrency: 'USD', - fiatCurrencies: [], - createInvoice: jest.fn(), - setCryptoCurrency: jest.fn(), - setFiatCurrency: jest.fn() -} - const defaultProps = { formType: '', - formProps: {}, closeForm: () => {} } describe('Form', () => { describe('should show pay form when formType is PAY_FORM', () => { - const props = { ...defaultProps, formType: 'PAY_FORM', formProps: payFormProps } + const props = { ...defaultProps, formType: 'PAY_FORM' } const el = shallow(
) it('should contain Pay', () => { expect(el.find(Pay)).toHaveLength(1) @@ -50,7 +23,7 @@ describe('Form', () => { }) describe('should show request form when formType is REQUEST_FORM', () => { - const props = { ...defaultProps, formType: 'REQUEST_FORM', formProps: requestFormProps } + const props = { ...defaultProps, formType: 'REQUEST_FORM' } const el = shallow() it('should contain Request', () => { expect(el.find(Request)).toHaveLength(1) diff --git a/test/unit/components/Form/Request.spec.js b/test/unit/components/Form/Request.spec.js deleted file mode 100644 index 4c5479ac..00000000 --- a/test/unit/components/Form/Request.spec.js +++ /dev/null @@ -1,41 +0,0 @@ -import React from 'react' -import { configure } from 'enzyme' -import Adapter from 'enzyme-adapter-react-16' -import { ThemeProvider } from 'styled-components' -import Request from 'components/Form/Request' -import { dark } from 'themes' -import { mountWithIntl } from '../../__helpers__/intl-enzyme-test-helper' - -configure({ adapter: new Adapter() }) - -const defaultProps = { - requestform: {}, - ticker: { - currency: 'btc', - fiatTicker: 'USD' - }, - - currencyFilters: [], - currencyName: '', - requestFiatAmount: '', - - setRequestAmount: () => {}, - setRequestMemo: () => {}, - setCurrency: () => {}, - - onRequestSubmit: () => {} -} - -describe('Form', () => { - describe('should show request form when formType is REQUEST_FORM', () => { - const props = { ...defaultProps } - const el = mountWithIntl( - - - - ) - it('should contain Request', () => { - expect(el.contains('Request Payment')).toBe(true) - }) - }) -})