diff --git a/app/components/Contacts/ContactModal.js b/app/components/Contacts/ContactModal.js
index 6245fa10..91222850 100644
--- a/app/components/Contacts/ContactModal.js
+++ b/app/components/Contacts/ContactModal.js
@@ -1,6 +1,6 @@
import React from 'react'
import PropTypes from 'prop-types'
-
+import find from 'lodash/find'
import ReactModal from 'react-modal'
import { FaClose, FaCircle } from 'react-icons/lib/fa'
@@ -8,8 +8,9 @@ import { btc } from 'utils'
import styles from './ContactModal.scss'
-const ContactModal = ({ isOpen, channel, closeContactModal }) => {
- console.log('channel: ', channel)
+const ContactModal = ({ isOpen, channel, closeContactModal, channelNodes }) => {
+ if (!channel) { return }
+
const customStyles = {
overlay: {
cursor: 'pointer',
@@ -27,6 +28,9 @@ const ContactModal = ({ isOpen, channel, closeContactModal }) => {
}
}
+ // the remote node for the channel
+ const node = find(channelNodes, { pub_key: channel.remote_pubkey })
+
return (
{
+ {
+ node &&
+ {node.alias}
+ }
{channel.remote_pubkey}
diff --git a/app/components/Contacts/ContactModal.scss b/app/components/Contacts/ContactModal.scss
index a9ca45bc..5a818fbd 100644
--- a/app/components/Contacts/ContactModal.scss
+++ b/app/components/Contacts/ContactModal.scss
@@ -43,11 +43,18 @@
}
.title {
-
- h2 {
+ h1 {
color: $secondary;
font-weight: bold;
+ font-size: 16px;
+ letter-spacing: 1.1px;
+ margin-bottom: 10px;
+ }
+
+ h2 {
font-size: 12px;
+ color: $darkestgrey;
+ font-weight: 100;
}
}
diff --git a/app/reducers/channels.js b/app/reducers/channels.js
index 85db6f01..cd085365 100644
--- a/app/reducers/channels.js
+++ b/app/reducers/channels.js
@@ -1,5 +1,6 @@
import { createSelector } from 'reselect'
import { ipcRenderer } from 'electron'
+import filter from 'lodash/filter'
import { btc } from 'utils'
import { showNotification } from 'notifications'
import { closeChannelForm, resetChannelForm } from './channelform'
@@ -328,6 +329,7 @@ const pendingForceClosedChannelsSelector = state => state.channels.pendingChanne
const channelSearchQuerySelector = state => state.channels.searchQuery
const filtersSelector = state => state.channels.filters
const filterSelector = state => state.channels.filter
+const nodesSelector = state => state.network.nodes
channelsSelectors.channelModalOpen = createSelector(
channelSelector,
@@ -381,6 +383,16 @@ channelsSelectors.nonActiveFilters = createSelector(
(filters, filter) => filters.filter(f => f.key !== filter.key)
)
+channelsSelectors.channelNodes = createSelector(
+ channelsSelector,
+ nodesSelector,
+ (channels, nodes) => {
+ const chanPubkeys = channels.map(channel => channel.remote_pubkey)
+
+ return filter(nodes, node => chanPubkeys.includes(node.pub_key))
+ }
+)
+
const allChannels = createSelector(
channelsSelectors.activeChannels,
channelsSelectors.nonActiveChannels,
diff --git a/app/routes/contacts/containers/ContactsContainer.js b/app/routes/contacts/containers/ContactsContainer.js
index 6e61770e..e2d2b4df 100644
--- a/app/routes/contacts/containers/ContactsContainer.js
+++ b/app/routes/contacts/containers/ContactsContainer.js
@@ -61,6 +61,7 @@ const mapStateToProps = state => ({
pendingOpenChannelPubkeys: channelsSelectors.pendingOpenChannelPubkeys(state),
closingPendingChannels: channelsSelectors.closingPendingChannels(state),
nonActiveFilters: channelsSelectors.nonActiveFilters(state),
+ channelNodes: channelsSelectors.channelNodes(state),
filteredNetworkNodes: contactFormSelectors.filteredNetworkNodes(state),
showManualForm: contactFormSelectors.showManualForm(state)
@@ -71,7 +72,8 @@ const mergeProps = (stateProps, dispatchProps, ownProps) => {
closeContactModal: dispatchProps.closeContactModal,
isOpen: stateProps.channels.contactModal.isOpen,
- channel: stateProps.channels.contactModal.channel
+ channel: stateProps.channels.contactModal.channel,
+ channelNodes: stateProps.channelNodes
}
const contactsFormProps = {