diff --git a/app/api/index.js b/app/api/index.js
index e71c69df..7ea44624 100644
--- a/app/api/index.js
+++ b/app/api/index.js
@@ -15,13 +15,12 @@ export function requestTickers(ids) {
.then(axios.spread((btcTicker, ltcTicker) => ({ btcTicker: btcTicker[0], ltcTicker: ltcTicker[0] })))
}
-
-export function requestBlockHeight(id) {
- const BASE_URL = `https://testnet-api.smartbit.com.au/v1/blockchain/blocks?limit=1`
+export function requestBlockHeight() {
+ const BASE_URL = 'https://testnet-api.smartbit.com.au/v1/blockchain/blocks?limit=1'
return axios({
method: 'get',
url: BASE_URL
})
.then(response => response.data)
.catch(error => error)
-}
\ No newline at end of file
+}
diff --git a/app/app.global.scss b/app/app.global.scss
index d55b7f23..0a946033 100644
--- a/app/app.global.scss
+++ b/app/app.global.scss
@@ -66,4 +66,10 @@ body {
opacity: 1;
stroke: darken($main, 10%);
}
+}
+
+@keyframes spin {
+ 100% {
+ transform: rotate(360deg);
+ }
}
\ No newline at end of file
diff --git a/app/components/Channels/Channels.js b/app/components/Channels/Channels.js
index 18c73cee..ab2d29f2 100644
--- a/app/components/Channels/Channels.js
+++ b/app/components/Channels/Channels.js
@@ -1,6 +1,7 @@
import React from 'react'
import PropTypes from 'prop-types'
import { TiPlus } from 'react-icons/lib/ti'
+import { FaRepeat } from 'react-icons/lib/fa'
import ChannelModal from './ChannelModal'
import ChannelForm from './ChannelForm'
import Channel from './Channel'
@@ -9,6 +10,7 @@ import ClosedPendingChannel from './ClosedPendingChannel'
import styles from './Channels.scss'
const Channels = ({
+ fetchChannels,
ticker,
peers,
channelsLoading,
@@ -22,69 +24,103 @@ const Channels = ({
closeChannel,
currentTicker,
explorerLinkBase
-}) => (
-
-
-
-
-
Channels
-
setChannelForm({ isOpen: true })}
- >
-
+}) => {
+ const refreshClicked = (event) => {
+ // store event in icon so we dont get an error when react clears it
+ const icon = event.currentTarget
+
+ // fetch channels
+ fetchChannels()
+
+ // clear animation after the second so we can reuse it
+ setTimeout(() => { icon.style.animation = '' }, 1000)
+
+ // spin icon for 1 sec
+ icon.style.animation = 'spin 1000ms linear 1'
+ }
+
+ return (
+
+ )
+}
Channels.propTypes = {
+ fetchChannels: PropTypes.func.isRequired,
ticker: PropTypes.object.isRequired,
peers: PropTypes.array.isRequired,
channelsLoading: PropTypes.bool.isRequired,
diff --git a/app/components/Channels/Channels.scss b/app/components/Channels/Channels.scss
index 8d73c905..df5f7b38 100644
--- a/app/components/Channels/Channels.scss
+++ b/app/components/Channels/Channels.scss
@@ -1,5 +1,15 @@
@import '../../variables.scss';
+@keyframes spin {
+ from {
+ transform: rotate(0deg)
+ }
+
+ to {
+ transform: rotate(360deg);
+ }
+}
+
.channels {
width: 75%;
margin: 50px auto;
@@ -15,6 +25,20 @@
text-align: left;
}
+ .refresh {
+ cursor: pointer;
+ margin-left: 5px;
+ font-size: 12px;
+ vertical-align: top;
+ color: $darkestgrey;
+ line-height: 14px;
+ transition: color 0.25s;
+
+ &:hover {
+ color: $main;
+ }
+ }
+
.openChannel {
float: right;
cursor: pointer;
diff --git a/app/components/LndSyncing/LndSyncing.js b/app/components/LndSyncing/LndSyncing.js
index 43acbde1..eff73e6a 100644
--- a/app/components/LndSyncing/LndSyncing.js
+++ b/app/components/LndSyncing/LndSyncing.js
@@ -1,14 +1,15 @@
import React, { Component } from 'react'
+import PropTypes from 'prop-types'
import styles from './LndSyncing.scss'
class LndSyncing extends Component {
constructor(props) {
- super(props);
+ super(props);
this.state = {
facts: [
{
title: 'No2x',
- description: 'Segwit2x is a hard fork proposal led by Barry Silbert and the NYA signers. The idea was drawn up and signed in a locked hotel room with select individuals and goes against everything that Bitcoin stands for. There is no favoritism in Bitcoin. There are no politicians. Hash power and business don\'t speak for us. Don\'t trust, verify.'
+ description: 'Segwit2x is a hard fork proposal led by Barry Silbert and the NYA signers. The idea was drawn up and signed in a locked hotel room with select individuals and goes against everything that Bitcoin stands for. There is no favoritism in Bitcoin. There are no politicians. Hash power and business don\'t speak for us. Don\'t trust, verify.' // eslint-disable-line
},
{
title: 'Gang',
@@ -41,8 +42,7 @@ class LndSyncing extends Component {
zap
{!fetchingBlockHeight &&
{syncPercentage}%
}
-
-
+
syncing your lightning node to the blockchain
@@ -52,15 +52,13 @@ class LndSyncing extends Component {