From 2d1030a1f77e9fca55c46333a2d32eeef2c20376 Mon Sep 17 00:00:00 2001 From: Jack Mallers Date: Mon, 19 Feb 2018 19:52:21 -0600 Subject: [PATCH] feature(autopilot-onboarding): allow user to turn autopilot on/off before starting their node --- app/components/Onboarding/Autopilot.js | 42 ++++++++++++++++ app/components/Onboarding/Autopilot.scss | 53 ++++++++++++++++++++ app/components/Onboarding/FormContainer.js | 7 ++- app/components/Onboarding/FormContainer.scss | 2 + app/components/Onboarding/Onboarding.js | 21 ++++++-- app/containers/Root.js | 12 ++++- app/main.dev.js | 36 ++++++------- app/reducers/onboarding.js | 20 ++++++-- 8 files changed, 164 insertions(+), 29 deletions(-) create mode 100644 app/components/Onboarding/Autopilot.js create mode 100644 app/components/Onboarding/Autopilot.scss diff --git a/app/components/Onboarding/Autopilot.js b/app/components/Onboarding/Autopilot.js new file mode 100644 index 00000000..225fb0cb --- /dev/null +++ b/app/components/Onboarding/Autopilot.js @@ -0,0 +1,42 @@ +import React from 'react' +import PropTypes from 'prop-types' +import { FaCircle, FaCircleThin } from 'react-icons/lib/fa' +import styles from './Autopilot.scss' + +const Autopilot = ({ autopilot, setAutopilot }) => ( +
+
+
setAutopilot(true)}> + { + autopilot ? + + : + + } + + Enable Autopilot + +
+
+
+
setAutopilot(false)}> + { + !autopilot && autopilot !== null ? + + : + + } + + Disable Autopilot + +
+
+
+) + +Autopilot.propTypes = { + autopilot: PropTypes.bool, + setAutopilot: PropTypes.func.isRequired +} + +export default Autopilot diff --git a/app/components/Onboarding/Autopilot.scss b/app/components/Onboarding/Autopilot.scss new file mode 100644 index 00000000..b9ff9ac2 --- /dev/null +++ b/app/components/Onboarding/Autopilot.scss @@ -0,0 +1,53 @@ +@import '../../variables.scss'; + +.container { + color: $white; + + section { + margin: 20px 0; + + &.enable { + &.active { + div { + color: $green; + border-color: $green; + } + } + + div:hover { + color: $green; + border-color: $green; + } + } + + &.disable { + &.active { + div { + color: $red; + border-color: $red; + } + } + + div:hover { + color: $red; + border-color: $red; + } + } + + div { + width: 150px; + text-align: center; + display: inline-block; + padding: 20px; + border: 1px solid $white; + border-radius: 5px; + font-weight: 200; + cursor: pointer; + transition: all 0.25s; + } + + .label { + margin-left: 15px; + } + } +} \ No newline at end of file diff --git a/app/components/Onboarding/FormContainer.js b/app/components/Onboarding/FormContainer.js index 8d01c285..c026d21d 100644 --- a/app/components/Onboarding/FormContainer.js +++ b/app/components/Onboarding/FormContainer.js @@ -1,6 +1,9 @@ import React from 'react' import PropTypes from 'prop-types' import Isvg from 'react-inlinesvg' + +import { FaAngleLeft, FaAngleRight } from 'react-icons/lib/fa' + import zapLogo from 'icons/zap_logo.svg' import styles from './FormContainer.scss' @@ -28,12 +31,12 @@ const FormContainer = ({ title, description, back, next, children }) => (
{ - back &&
Back
+ back &&
Back
}
{ - next &&
Next
+ next &&
Next
}
diff --git a/app/components/Onboarding/FormContainer.scss b/app/components/Onboarding/FormContainer.scss index cdbbb737..e5f960db 100644 --- a/app/components/Onboarding/FormContainer.scss +++ b/app/components/Onboarding/FormContainer.scss @@ -32,6 +32,8 @@ p { font-size: 12px; + line-height: 1.5; + width: 70%; } } diff --git a/app/components/Onboarding/Onboarding.js b/app/components/Onboarding/Onboarding.js index 34ae5d46..bf0d2e41 100644 --- a/app/components/Onboarding/Onboarding.js +++ b/app/components/Onboarding/Onboarding.js @@ -5,15 +5,19 @@ import LoadingBolt from 'components/LoadingBolt' import FormContainer from './FormContainer' import Alias from './Alias' +import Autopilot from './Autopilot' import styles from './Onboarding.scss' const Onboarding = ({ onboarding: { step, - alias + alias, + autopilot }, + changeStep, submit, - aliasProps + aliasProps, + autopilotProps }) => { const renderStep = () => { switch (step) { @@ -23,11 +27,22 @@ const Onboarding = ({ title={'1. What should we call you?'} description={'Set your nickname to help others connect with you on the Lightning Network'} back={null} - next={() => submit(alias)} + next={() => changeStep(2)} > ) + case 2: + return ( + changeStep(1)} + next={() => submit(alias, autopilot)} + > + + + ) default: return } diff --git a/app/containers/Root.js b/app/containers/Root.js index f2a922ec..b517a3da 100644 --- a/app/containers/Root.js +++ b/app/containers/Root.js @@ -7,12 +7,13 @@ import PropTypes from 'prop-types' import LoadingBolt from '../components/LoadingBolt' import Onboarding from '../components/Onboarding' import Syncing from '../components/Onboarding/Syncing' -import { updateAlias, changeStep, submit } from '../reducers/onboarding' +import { updateAlias, setAutopilot, changeStep, submit } from '../reducers/onboarding' import { fetchBlockHeight, lndSelectors } from '../reducers/lnd' import Routes from '../routes' const mapDispatchToProps = { updateAlias, + setAutopilot, changeStep, submit, @@ -37,10 +38,17 @@ const mergeProps = (stateProps, dispatchProps, ownProps) => { alias: stateProps.onboarding.alias } + const autopilotProps = { + autopilot: stateProps.onboarding.autopilot, + setAutopilot: dispatchProps.setAutopilot + } + const onboardingProps = { onboarding: stateProps.onboarding, + changeStep: dispatchProps.changeStep, submit: dispatchProps.submit, - aliasProps + aliasProps, + autopilotProps } return { diff --git a/app/main.dev.js b/app/main.dev.js index bc84b8d2..eb52df43 100644 --- a/app/main.dev.js +++ b/app/main.dev.js @@ -139,7 +139,7 @@ const sendLndSynced = () => { } // Starts the LND node -const startLnd = (alias) => { +const startLnd = (alias, autopilot) => { let lndPath if (process.env.NODE_ENV === 'development') { @@ -148,21 +148,21 @@ const startLnd = (alias) => { lndPath = path.join(__dirname, '..', 'bin', plat === 'win32' ? 'lnd.exe' : 'lnd') } - const neutrino = spawn(lndPath, - [ - '--bitcoin.active', - '--bitcoin.testnet', - '--bitcoin.node=neutrino', - '--neutrino.connect=btcd.jackmallers.com:18333', - '--neutrino.addpeer=188.166.148.62:18333', - '--neutrino.addpeer=159.65.48.139:18333', - '--neutrino.connect=127.0.0.1:18333', - '--autopilot.active', - '--debuglevel=debug', - '--noencryptwallet', - `--alias=${alias}` - ] - ) + const neutrinoArgs = [ + '--bitcoin.active', + '--bitcoin.testnet', + '--bitcoin.node=neutrino', + '--neutrino.connect=btcd.jackmallers.com:18333', + '--neutrino.addpeer=188.166.148.62:18333', + '--neutrino.addpeer=159.65.48.139:18333', + '--neutrino.connect=127.0.0.1:18333', + '--debuglevel=debug', + '--noencryptwallet', + `${ autopilot ? '--autopilot.active' : ''}`, + `${alias ? `--alias=${alias}` : ''}` + ] + + const neutrino = spawn(lndPath, neutrinoArgs) .on('error', error => console.log(`lnd error: ${error}`)) .on('close', code => console.log(`lnd shutting down ${code}`)) @@ -284,9 +284,9 @@ app.on('ready', async () => { // Start LND // startLnd() // once the onboarding has finished we wanna let the application we have started syncing and start LND - ipcMain.on('onboardingFinished', (event, { alias }) => { + ipcMain.on('onboardingFinished', (event, { alias, autopilot }) => { sendLndSyncing() - startLnd(alias) + startLnd(alias, autopilot) }) } else { // An LND process was found, no need to start our own diff --git a/app/reducers/onboarding.js b/app/reducers/onboarding.js index 4fb5665f..905f7b93 100644 --- a/app/reducers/onboarding.js +++ b/app/reducers/onboarding.js @@ -7,6 +7,8 @@ export const UPDATE_ALIAS = 'UPDATE_ALIAS' export const CHANGE_STEP = 'CHANGE_STEP' +export const SET_AUTOPILOT = 'SET_AUTOPILOT' + export const ONBOARDING_STARTED = 'ONBOARDING_STARTED' export const ONBOARDING_FINISHED = 'ONBOARDING_FINISHED' @@ -20,6 +22,13 @@ export function updateAlias(alias) { } } +export function setAutopilot(autopilot) { + return { + type: SET_AUTOPILOT, + autopilot + } +} + export function changeStep(step) { return { type: CHANGE_STEP, @@ -27,9 +36,10 @@ export function changeStep(step) { } } -export function submit(alias) { +export function submit(alias, autopilot) { // alert the app we're done onboarding and it's cool to start LND - ipcRenderer.send('onboardingFinished', { alias }) + // send the alias they set along with whether they want autopilot on or not + ipcRenderer.send('onboardingFinished', { alias, autopilot }) return { type: ONBOARDING_FINISHED @@ -45,6 +55,7 @@ export const startOnboarding = () => (dispatch) => { // ------------------------------------ const ACTION_HANDLERS = { [UPDATE_ALIAS]: (state, { alias }) => ({ ...state, alias }), + [SET_AUTOPILOT]: (state, { autopilot }) => ({ ...state, autopilot }), [CHANGE_STEP]: (state, { step }) => ({ ...state, step }), [ONBOARDING_STARTED]: state => ({ ...state, onboarded: false }), [ONBOARDING_FINISHED]: state => ({ ...state, onboarded: true }) @@ -56,13 +67,14 @@ const ACTION_HANDLERS = { const initialState = { onboarded: true, step: 1, - alias: '' + alias: '', + autopilot: null } // ------------------------------------ // Reducer // ------------------------------------ -export default function lndReducer(state = initialState, action) { +export default function onboardingReducer(state = initialState, action) { const handler = ACTION_HANDLERS[action.type] return handler ? handler(state, action) : state