GlcoinCore/squeaknode
1
0
Fork 0
mirror of https://github.com/yzernik/squeaknode.git synced 2026-08-15 12:50:47 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

Add channels grid item (#127)

Browse source 
* Add channels grid item

* Add wallet balance grid item
This commit is contained in:
Jonathan Zernik 2020-07-23 04:03:44 -07:00 • committed by GitHub
parent 16d497fac8
commit dbeeb1218b
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 122 additions and 23 deletions
Download patch file Download diff file Expand all files Collapse all files

145
frontend/react-material-admin/src/pages/lightning/Lightning.js vendored
View file

@ -25,7 +25,7 @@ import PageTitle from "../../components/PageTitle";
import Widget from "../../components/Widget";
import { Typography } from "../../components/Wrappers";
import { GetInfoRequest } from "../../proto/lnd_pb"
import { GetInfoRequest, WalletBalanceRequest } from "../../proto/lnd_pb"
import { SqueakAdminClient } from "../../proto/squeak_admin_grpc_web_pb"
var client = new SqueakAdminClient('http://' + window.location.hostname + ':8080')
@ -35,6 +35,7 @@ export default function LightningPage() {
var theme = useTheme();
const [lndInfo, setLndInfo] = useState(null);
const [walletBalance, setWalletBalance] = useState(null);
const getLndInfo = () => {
console.log("called getLndInfo");
@ -48,10 +49,24 @@ export default function LightningPage() {
setLndInfo(response);
});
};
const getWalletBalance = () => {
console.log("called getWalletBalance");
var walletBalanceRequest = new WalletBalanceRequest()
console.log(walletBalanceRequest);
client.lndWalletBalance(walletBalanceRequest, {}, (err, response) => {
console.log(response);
setWalletBalance(response);
});
};
useEffect(()=>{
getLndInfo()
},[]);
useEffect(()=>{
getWalletBalance()
},[]);
function NoInfoContent() {
return (
@ -81,38 +96,43 @@ export default function LightningPage() {
function InfoContent() {
return (
<>
{PubkeyGridItem()}
{StatusGridItem()}
<Grid container spacing={4}>
{PubkeyGridItem()}
</Grid>
<Grid container spacing={4}>
{StatusGridItem()}
{ChannelsGridItem()}
{BalanceGridItem()}
</Grid>
</>
)
}
function PubkeyGridItem() {
return (
<Grid container spacing={4}>
<Grid item xs={12}>
<Widget
title="Node pubkey"
disableWidgetMenu
upperTitle
bodyClass={classes.fullHeightBody}
className={classes.card}
>
<div className={classes.visitsNumberContainer}>
<Typography size="xl" weight="medium">
{lndInfo.getIdentityPubkey()}
</Typography>
</div>
</Widget>
</Grid>
<Grid item xs={12}>
<Widget
title="Node info"
disableWidgetMenu
upperTitle
bodyClass={classes.fullHeightBody}
className={classes.card}
>
<div className={classes.visitsNumberContainer}>
<Typography color="text" colorBrightness="secondary">
pubkey
</Typography>
<Typography size="md" weight="medium">
{lndInfo.getIdentityPubkey()}
</Typography>
</div>
</Widget>
</Grid>
)
}
function StatusGridItem() {
return (
<Grid container spacing={4}>
<Grid item lg={3} md={4} sm={6} xs={12}>
<Widget
title="Node status"
@ -148,14 +168,93 @@ export default function LightningPage() {
</Grid>
</Widget>
</Grid>
</Grid>
)
}
function ChannelsGridItem() {
return (
<Grid item lg={3} md={4} sm={6} xs={12}>
<Widget
title="Channels"
disableWidgetMenu
upperTitle
bodyClass={classes.fullHeightBody}
className={classes.card}
>
<Grid
container
direction="row"
justify="space-between"
alignItems="center"
>
<Grid item>
<Typography color="text" colorBrightness="secondary">
num_pending_channels
</Typography>
<Typography size="md">{lndInfo.getNumPendingChannels()}</Typography>
</Grid>
<Grid item>
<Typography color="text" colorBrightness="secondary">
num_active_channels
</Typography>
<Typography size="md">{lndInfo.getNumActiveChannels()}</Typography>
</Grid>
<Grid item>
<Typography color="text" colorBrightness="secondary">
num_inactive_channels
</Typography>
<Typography size="md">{lndInfo.getNumInactiveChannels()}</Typography>
</Grid>
</Grid>
</Widget>
</Grid>
)
}
function BalanceGridItem() {
return (
<Grid item lg={3} md={4} sm={6} xs={12}>
<Widget
title="Balance"
disableWidgetMenu
upperTitle
bodyClass={classes.fullHeightBody}
className={classes.card}
>
<Grid
container
direction="row"
justify="space-between"
alignItems="center"
>
<Grid item>
<Typography color="text" colorBrightness="secondary">
total balance
</Typography>
<Typography size="md">{walletBalance.getTotalBalance()}</Typography>
</Grid>
<Grid item>
<Typography color="text" colorBrightness="secondary">
confirmed balance
</Typography>
<Typography size="md">{walletBalance.getConfirmedBalance()}</Typography>
</Grid>
<Grid item>
<Typography color="text" colorBrightness="secondary">
unconfirmed balance
</Typography>
<Typography size="md">{walletBalance.getUnconfirmedBalance()}</Typography>
</Grid>
</Grid>
</Widget>
</Grid>
)
}
return (
<>
<PageTitle title="Lightning" />
{lndInfo
{(lndInfo && walletBalance)
? InfoContent()
: NoInfoContent()
}