mirror of
https://github.com/joinmarket-webui/jam.git
synced 2026-08-20 13:28:21 +02:00
cleaned code
This commit is contained in:
shobhitaa
parent
35c137802b
commit
c3c2e546ea
13 changed files with 57 additions and 197 deletions
|
|
@ -1,7 +1,4 @@
|
|||
import './App.css';
|
||||
import { Button } from './components/Button';
|
||||
import Wallet from './components/Wallet';
|
||||
import { BitcoinQR } from '@ibunker/bitcoin-react';
|
||||
import '@ibunker/bitcoin-react/dist/index.css';
|
||||
import {useState,useEffect} from 'react'
|
||||
import Wallets from './components/Wallets';
|
||||
|
|
@ -14,13 +11,12 @@ import DisplayWallet from './components/DisplayWallet'
|
|||
import * as rb from 'react-bootstrap';
|
||||
import github_logo from './github.svg'
|
||||
import twitter_logo from './twitter.svg'
|
||||
import { BrowserRouter as Router, Link, Route ,Switch,Redirect} from 'react-router-dom';
|
||||
import useInterval from './components/utils'
|
||||
import { BrowserRouter as Router, Route ,Switch} from 'react-router-dom';
|
||||
|
||||
function App() {
|
||||
|
||||
// const [currWallet,setCurrWallet] = useState({})
|
||||
const [walletList,setWalletList] = useState([])
|
||||
|
||||
|
||||
const listWallets = async()=>{
|
||||
const res = await fetch('/wallet/all');
|
||||
|
|
@ -30,15 +26,13 @@ function App() {
|
|||
}
|
||||
|
||||
useInterval(() => {
|
||||
// put your interval code here.
|
||||
const sessionClear = async()=>{
|
||||
|
||||
try{
|
||||
|
||||
const res = await fetch('/session',{
|
||||
method:"GET",
|
||||
|
||||
method:"GET",
|
||||
});
|
||||
|
||||
const data = await res.json();
|
||||
if(data[0].session===false){
|
||||
console.log("no wallet in backend")
|
||||
|
|
@ -46,7 +40,6 @@ function App() {
|
|||
return;
|
||||
}
|
||||
console.log("backend alive and wallet loaded")
|
||||
|
||||
}
|
||||
|
||||
catch(e){
|
||||
|
|
@ -54,11 +47,9 @@ function App() {
|
|||
alert("Lost connection to backend! Please restart the backend server.");
|
||||
sessionStorage.clear();
|
||||
}
|
||||
|
||||
}
|
||||
sessionClear();
|
||||
|
||||
|
||||
}, 1000 * 5);
|
||||
|
||||
useEffect(()=>{
|
||||
|
|
@ -78,12 +69,12 @@ function App() {
|
|||
|
||||
let authData =JSON.parse(sessionStorage.getItem('auth'));
|
||||
console.log(authData)
|
||||
//if unlcoking same wallet
|
||||
//if unlocking same wallet
|
||||
if(authData && authData.login===true && authData.name===name){
|
||||
alert(name+" is aldready unlocked")
|
||||
return;
|
||||
}
|
||||
//if unlocking other wallet while one unlocked
|
||||
//if unlocking another wallet while one is already unlocked
|
||||
else if(authData && authData.login===true && authData.name!==name){
|
||||
alert(authData.name+" is currently in use,please lock it first");
|
||||
return;
|
||||
|
|
@ -117,12 +108,7 @@ function App() {
|
|||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
const lockWallet = async(name)=>{
|
||||
let authData =JSON.parse(sessionStorage.getItem('auth'));
|
||||
|
|
@ -206,10 +192,6 @@ function App() {
|
|||
wallet_info[mix_depths[4].account] = mix_depths[4].account_balance
|
||||
console.log(wallet_info)
|
||||
return wallet_info;
|
||||
|
||||
window.alert("Wallet Name: " + wallet_name + "\n" + "Total balance: " + balance);
|
||||
window.alert(mix_depths[0].account + " " + mix_depths[0].account_balance + "\n" + mix_depths[1].account + " " + mix_depths[1].account_balance + "\n" + mix_depths[2].account + " " + mix_depths[2].account_balance + "\n" + mix_depths[3].account + " " + mix_depths[3].account_balance + "\n" + mix_depths[4].account + " " + mix_depths[4].account_balance);
|
||||
|
||||
}
|
||||
|
||||
const createWallet = async(name,password)=>{
|
||||
|
|
@ -237,8 +219,8 @@ function App() {
|
|||
}))
|
||||
}
|
||||
catch(e){
|
||||
//but what if some other error where wallet not created
|
||||
alert("UNexpected error!PLease try again")
|
||||
//some other error occurs where wallet is not created
|
||||
alert("Unexpected error! PLease try again")
|
||||
}
|
||||
}
|
||||
else{
|
||||
|
|
@ -379,16 +361,9 @@ function App() {
|
|||
|
||||
catch(e){
|
||||
alert("Error while stopping service!")
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
const getUTXOs = async()=>{
|
||||
try{
|
||||
let authData =JSON.parse(sessionStorage.getItem('auth'));
|
||||
|
|
@ -405,8 +380,6 @@ function App() {
|
|||
});
|
||||
const data = await res.json();
|
||||
return JSON.parse(data[0].transactions);
|
||||
|
||||
|
||||
}
|
||||
catch(e){
|
||||
|
||||
|
|
@ -422,38 +395,38 @@ function App() {
|
|||
|
||||
<rb.Navbar sticky="top" collapseOnSelect expand="lg" bg="dark" variant="dark">
|
||||
|
||||
<rb.Container>
|
||||
<rb.Navbar.Brand href='/'>Joinmarket</rb.Navbar.Brand>
|
||||
<rb.Navbar.Toggle aria-controls="responsive-rb.Navbar-rb.Nav" />
|
||||
<rb.Navbar.Collapse id="responsive-rb.Navbar-rb.Nav">
|
||||
<rb.Nav className="me-auto">
|
||||
<rb.Nav.Link href="https://github.com/JoinMarket-Org/joinmarket-clientserver/tree/master/docs">Docs</rb.Nav.Link>
|
||||
<rb.Nav.Link href="https://github.com/JoinMarket-Org/joinmarket-clientserver#wallet-features">Features</rb.Nav.Link>
|
||||
<rb.Nav.Link href="https://github.com/JoinMarket-Org/joinmarket-clientserver#joinmarket-clientserver">About</rb.Nav.Link>
|
||||
</rb.Nav>
|
||||
<rb.Nav>
|
||||
<rb.Navbar.Brand href="https://github.com/JoinMarket-Org/joinmarket-clientserver">
|
||||
<img
|
||||
src={github_logo}
|
||||
width="50"
|
||||
height="50"
|
||||
className="github"
|
||||
alt="github logo"
|
||||
/>
|
||||
</rb.Navbar.Brand>
|
||||
<rb.Navbar.Brand href="https://twitter.com/joinmarket">
|
||||
<img
|
||||
src={twitter_logo}
|
||||
width="50"
|
||||
height="50"
|
||||
className="twitter"
|
||||
alt="twitter logo"
|
||||
/>
|
||||
</rb.Navbar.Brand>
|
||||
</rb.Nav>
|
||||
</rb.Navbar.Collapse>
|
||||
</rb.Container>
|
||||
</rb.Navbar>
|
||||
<rb.Container>
|
||||
<rb.Navbar.Brand href='/'>Joinmarket</rb.Navbar.Brand>
|
||||
<rb.Navbar.Toggle aria-controls="responsive-rb.Navbar-rb.Nav" />
|
||||
<rb.Navbar.Collapse id="responsive-rb.Navbar-rb.Nav">
|
||||
<rb.Nav className="me-auto">
|
||||
<rb.Nav.Link href="https://github.com/JoinMarket-Org/joinmarket-clientserver/tree/master/docs">Docs</rb.Nav.Link>
|
||||
<rb.Nav.Link href="https://github.com/JoinMarket-Org/joinmarket-clientserver#wallet-features">Features</rb.Nav.Link>
|
||||
<rb.Nav.Link href="https://github.com/JoinMarket-Org/joinmarket-clientserver#joinmarket-clientserver">About</rb.Nav.Link>
|
||||
</rb.Nav>
|
||||
<rb.Nav>
|
||||
<rb.Navbar.Brand href="https://github.com/JoinMarket-Org/joinmarket-clientserver">
|
||||
<img
|
||||
src={github_logo}
|
||||
width="50"
|
||||
height="50"
|
||||
className="github"
|
||||
alt="github logo"
|
||||
/>
|
||||
</rb.Navbar.Brand>
|
||||
<rb.Navbar.Brand href="https://twitter.com/joinmarket">
|
||||
<img
|
||||
src={twitter_logo}
|
||||
width="50"
|
||||
height="50"
|
||||
className="twitter"
|
||||
alt="twitter logo"
|
||||
/>
|
||||
</rb.Navbar.Brand>
|
||||
</rb.Nav>
|
||||
</rb.Navbar.Collapse>
|
||||
</rb.Container>
|
||||
</rb.Navbar>
|
||||
|
||||
<p></p>
|
||||
<Switch>
|
||||
|
|
|
|||
|
|
@ -15,15 +15,10 @@ const CreateWallet = ({onCreate}) => {
|
|||
alert('Please add details')
|
||||
return;
|
||||
}
|
||||
console.log("okay")
|
||||
//maybe add await here
|
||||
// let wallet =JSON.parse(sessionStorage.getItem('auth')).name;
|
||||
// onPayment(wallet,mixdepth,amount,destination)
|
||||
|
||||
onCreate(wallet,password)
|
||||
setWallet('')
|
||||
setPassword('')
|
||||
|
||||
|
||||
}
|
||||
return (
|
||||
|
||||
|
|
|
|||
|
|
@ -6,19 +6,13 @@ import * as rb from 'react-bootstrap'
|
|||
|
||||
const DisplayMixdepth = ({walletInfo}) => {
|
||||
|
||||
console.log(walletInfo)
|
||||
|
||||
const accounts = []
|
||||
|
||||
for (const account_info of walletInfo.accounts){
|
||||
accounts.push(account_info)
|
||||
}
|
||||
|
||||
console.log(accounts)
|
||||
|
||||
return (
|
||||
|
||||
|
||||
<div>
|
||||
Total Balance: {walletInfo.total_balance} BTC
|
||||
<p></p>
|
||||
|
|
|
|||
|
|
@ -4,9 +4,7 @@ const DisplayUTXOs = ({utxoID,utxo}) => {
|
|||
return (
|
||||
<div>
|
||||
<p></p>
|
||||
|
||||
<p></p>
|
||||
{/* <span>Transaction ID: {transactionID}</span> */}
|
||||
<br></br>
|
||||
<span>Address: {utxo.address}</span>
|
||||
<br></br>
|
||||
|
|
|
|||
|
|
@ -3,6 +3,7 @@ import {useState,useEffect} from 'react'
|
|||
import { Button } from './Button'
|
||||
import DisplayMixdepth from './DisplayMixdepth'
|
||||
import DisplayUTXOs from './DisplayUTXOs'
|
||||
|
||||
const DisplayWallet = ({listWalletInfo,onSend,listUTXOs}) => {
|
||||
const [wallet_info,setWalletInfo] = useState([])
|
||||
const [UTXOHistory,setUTXOHistory] = useState({})
|
||||
|
|
@ -39,18 +40,12 @@ const DisplayWallet = ({listWalletInfo,onSend,listUTXOs}) => {
|
|||
|
||||
{
|
||||
showUTXO?
|
||||
|
||||
|
||||
Object.entries(UTXOHistory).map(([key, val])=>
|
||||
<DisplayUTXOs key={key} utxoID={key} utxo={val}> </DisplayUTXOs>
|
||||
// <h5 key={key}> {key}:{val.address}</h5>
|
||||
)
|
||||
)
|
||||
|
||||
: ""
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,4 @@
|
|||
|
||||
.container1{
|
||||
/* background-color: rgb(223, 29, 29); */
|
||||
height: 100vh;
|
||||
padding-top: 100px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2,8 +2,6 @@ import React from 'react'
|
|||
import { useState } from 'react'
|
||||
const Maker = ({onStart,onStop}) => {
|
||||
|
||||
|
||||
|
||||
const [txFee,setTxFee] = useState('')
|
||||
const [cjfeeAbs,setCjfeeabs] = useState('')
|
||||
const [cjfeeRel,setCjfeerel] = useState('')
|
||||
|
|
|
|||
|
|
@ -3,6 +3,7 @@ import { useState } from 'react'
|
|||
import { useLocation } from "react-router-dom"
|
||||
import './payment.css'
|
||||
import * as rb from 'react-bootstrap'
|
||||
|
||||
const Payment = ({onPayment,onCoinjoin}) => {
|
||||
const location = useLocation()
|
||||
const [destination, setDestination] = useState('')
|
||||
|
|
@ -52,7 +53,7 @@ const Payment = ({onPayment,onCoinjoin}) => {
|
|||
return (
|
||||
<div>
|
||||
|
||||
<br></br>
|
||||
<br></br>
|
||||
<div className = "heading">
|
||||
Send Payment
|
||||
</div>
|
||||
|
|
@ -127,48 +128,6 @@ const Payment = ({onPayment,onCoinjoin}) => {
|
|||
</rb.Container>
|
||||
</rb.Container>
|
||||
</form>
|
||||
|
||||
|
||||
{/* <h3>Make Payment</h3>
|
||||
<form method="POST" onSubmit={onSubmit}>
|
||||
<label>
|
||||
Receiver address:
|
||||
<input type="text" name="destination" value = {destination }onChange={(e) => setDestination(e.target.value)}/>
|
||||
</label>
|
||||
<p></p>
|
||||
<label>
|
||||
Account
|
||||
<input type="text" name="mixdepth" value = {mixdepth} onChange={(e) => setMixdepth(e.target.value)} readOnly={true}/>
|
||||
</label>
|
||||
<p></p>
|
||||
<label>
|
||||
Amount
|
||||
<input type="text" name="amount_sats" value = {amount} onChange={(e) => setAmount(e.target.value)}/>
|
||||
</label>
|
||||
<p></p>
|
||||
Do you want to do a coinjoin?
|
||||
<p></p>
|
||||
Yes<input type="radio" name="coinjoin" onChange={(e) => setisCoinjoin(true)} />
|
||||
<p></p>
|
||||
No<input type="radio" name="coinjoin" onChange={(e) => setisCoinjoin(false)}/>
|
||||
<p></p>
|
||||
|
||||
|
||||
{
|
||||
isCoinjoin?
|
||||
<div>
|
||||
Counterparties
|
||||
<input type="text" name="counterparties" value = {counterparties} onChange={(e)=>setcounterparties(e.target.value)}/>
|
||||
</div>
|
||||
:
|
||||
|
||||
""
|
||||
}
|
||||
<p></p>
|
||||
|
||||
<input type="submit" value="Submit" />
|
||||
|
||||
</form> */}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -40,8 +40,6 @@ const Receive = ({onReceive}) => {
|
|||
getNewAddress(location.state.account_no);
|
||||
},[])
|
||||
|
||||
//getNewAddress('0')
|
||||
//const [address, setAddress] = useState('')
|
||||
const [temp_address, setTempAddress] = useState('')
|
||||
const [amount, setAmount] = useState('')
|
||||
|
||||
|
|
@ -53,19 +51,14 @@ const Receive = ({onReceive}) => {
|
|||
return
|
||||
}
|
||||
|
||||
setTempAddress(new_address)
|
||||
//maybe add await here
|
||||
// let wallet =JSON.parse(sessionStorage.getItem('auth')).name;
|
||||
// onRecieve(wallet,mixdepth,amount,message)
|
||||
|
||||
|
||||
setTempAddress(new_address)
|
||||
|
||||
}
|
||||
|
||||
return (
|
||||
<div>
|
||||
|
||||
<br></br>
|
||||
<br></br>
|
||||
<div className = "heading">
|
||||
Recieve Funds
|
||||
</div>
|
||||
|
|
@ -98,48 +91,19 @@ const Receive = ({onReceive}) => {
|
|||
</rb.Row>
|
||||
|
||||
{temp_address.length > 0? (
|
||||
<BitcoinQR
|
||||
bitcoinAddress={temp_address}
|
||||
message = ""
|
||||
amount ={amount}
|
||||
time = ""
|
||||
exp = ""
|
||||
/>):("")}
|
||||
<BitcoinQR
|
||||
bitcoinAddress={temp_address}
|
||||
message = ""
|
||||
amount ={amount}
|
||||
time = ""
|
||||
exp = ""
|
||||
/>):("")}
|
||||
|
||||
</rb.Container>
|
||||
</rb.Container>
|
||||
|
||||
|
||||
</form>
|
||||
|
||||
|
||||
|
||||
{/* <h3>Receive funds</h3>
|
||||
<form method="POST" onSubmit={onSubmit}>
|
||||
<label>
|
||||
Address
|
||||
<input type="text" name="address" value = {new_address } style = {{width: "415px"}} readOnly = {true} onChange={(e) => setNewAddress(e.target.value)}/>
|
||||
</label>
|
||||
<p></p> */}
|
||||
{/* <label>
|
||||
Mixdepth
|
||||
<input type="text" name="mixdepth" value = {address }onChange={(e) => setAddress(e.target.value)} />
|
||||
</label>
|
||||
<p></p>
|
||||
{/* <label>
|
||||
Amount
|
||||
<input type="text" name="amount_sats" value = {amount} onChange={(e) => setAmount(e.target.value)}/>
|
||||
</label>
|
||||
<p></p>
|
||||
<input type="submit" value="Submit" />
|
||||
|
||||
|
||||
</form> */}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -15,11 +15,6 @@ const Wallet = ({name,onUnlock,onLock,onDisplay}) => {
|
|||
<rb.Button onClick = {()=>onLock(name)}>Lock</rb.Button>
|
||||
</rb.Card.Body>
|
||||
</rb.Card>
|
||||
{/* <h3>{name}</h3>
|
||||
<Button onClick={()=>onUnlock(name)}>Unlock</Button>
|
||||
<Button onClick = {()=>onDisplay(name)}>Display</Button>
|
||||
<Link to="/display" className="btn btn-primary">Open</Link>
|
||||
<Button onClick = {()=>onLock(name)}>Lock</Button> */}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,15 +1,10 @@
|
|||
import React from 'react'
|
||||
import Wallet from './Wallet'
|
||||
import { BrowserRouter as Router, Link, Route ,Switch} from 'react-router-dom';
|
||||
const Wallets = ({walletList,onUnlock,onLock,onDisplay}) => {
|
||||
|
||||
return (
|
||||
<>
|
||||
<p></p>
|
||||
{/* <Link to="/maker">Maker Service</Link>
|
||||
<p></p>
|
||||
<Link to="/receive">Receive </Link>
|
||||
<p></p> */}
|
||||
{walletList.map((wallet,index)=>{
|
||||
return <Wallet key = {index} name={wallet} onUnlock = {onUnlock} onLock = {onLock} onDisplay = {onDisplay}></Wallet>
|
||||
})}
|
||||
|
|
|
|||
|
|
@ -2,8 +2,6 @@ import React from 'react'
|
|||
import * as rb from 'react-bootstrap'
|
||||
import './Homepage.css'
|
||||
import { BrowserRouter as Router, Link, Route ,Switch} from 'react-router-dom';
|
||||
import {BeautifulQuestions,SunnyMorning,SignalNoise,Thursday} from 'moving-letters'
|
||||
|
||||
|
||||
const Homepage = () => {
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,3 @@
|
|||
// utils.js
|
||||
|
||||
import React, { useState, useEffect, useRef } from 'react';
|
||||
|
||||
const useInterval = (callback, delay) => {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue