ilyakooo0/urbit
1
0
Fork 0
mirror of https://github.com/ilyakooo0/urbit.git synced 2025-01-02 03:52:13 +03:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #5343 from finned-palmer/release/bitcoin-wallet

Browse Source 
Release/bitcoin wallet
This commit is contained in:
~timluc-miptev 2021-10-22 10:15:51 +03:00 committed by GitHub
commit 77fab2082f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 102 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
pkg/btc-wallet/src/App.tsx
View File

@ -6,6 +6,7 @@ import { Box, Reset } from '@tlon/indigo-react';
import StartupModal from './components/StartupModal';
import { useSettings } from './hooks/useSettings';
import Body from './components/Body';
import Header from './components/Header';
const App: React.FC = () => {
const { loaded, wallet, provider, scanProgress } = useSettings();
@ -27,9 +28,8 @@ const App: React.FC = () => {
minHeight={loaded && !scanning ? '100%' : 'none'}
height={loaded && !scanning ? 'none' : '100%'}
style={{ filter: blur ? 'blur(8px)' : 'none' }}
px={[0, 4]}
pb={[0, 4]}
>
<Header />
<Body />
</Box>
</ThemeProvider>

3
pkg/btc-wallet/src/components/Body.tsx
View File

@ -4,7 +4,6 @@ import { Switch, Route } from 'react-router-dom';
import Balance from './Balance';
import Transactions from './Transactions/Transactions';
import Warning from './Warning';
import Header from './Header';
import Settings from './Settings';
import { useSettings } from '../hooks/useSettings';
@ -25,13 +24,11 @@ const Body: React.FC = () => {
<Switch>
<Route path="/settings">
<Col display="flex" flexDirection="column" width={cardWidth}>
<Header settings={true} />
<Settings />
</Col>
</Route>
<Route path="/">
<Col display="flex" flexDirection="column" width={cardWidth}>
<Header settings={false} />
{!warning ? null : <Warning />}
<Balance />
<Transactions />

48
pkg/btc-wallet/src/components/Header.tsx
View File

@ -3,44 +3,29 @@ import { Box, Icon, Row, Text } from '@tlon/indigo-react';
import { Link } from 'react-router-dom';
import { useSettings } from '../hooks/useSettings';
const Header = ({ settings }: { settings: boolean }) => {
const Header = () => {
const { provider } = useSettings();
let icon = settings ? 'X' : 'Adjust';
let iconColor = settings ? 'black' : 'orange';
let iconLink = settings ? '/' : '/settings';
let connection = null;
let badge = null;
if (!(provider && provider.connected)) {
connection = (
<Text fontSize={1} color="red" fontWeight="bold" mr={3}>
Provider Offline
</Text>
);
if (!settings) {
badge = (
<Box
borderRadius="50%"
width="8px"
height="8px"
backgroundColor="red"
position="absolute"
top="0px"
right="0px"
></Box>
);
}
}
return (
<Row
height={8}
height={7}
width="100%"
justifyContent="space-between"
alignItems="center"
pt={5}
pb={5}
mb={5}
px={[2, 4]}
style={{
boxShadow: '0px 1px 0px rgba(0, 0, 0, 0.1)',
}}
>
<Row alignItems="center" justifyContent="center">
<Box
@ -60,19 +45,32 @@ const Header = ({ settings }: { settings: boolean }) => {
</Row>
<Row alignItems="center">
{connection}
<Link to={iconLink}>
<Link to="/~btc/settings">
<Box
backgroundColor="white"
borderRadius={4}
width={5}
height={5}
p={2}
m={2}
position="relative"
>
{badge}
<Icon icon={icon} color={iconColor} />
<Icon icon="Adjust" color="orange" />
</Box>
</Link>
<a href="/">
<Box
backgroundColor="white"
borderRadius={4}
width={5}
height={5}
p={2}
m={2}
position="relative"
>
<Icon icon="Home" color="orange" />
</Box>
</a>
</Row>
</Row>
);

35
pkg/btc-wallet/src/components/Send/BridgeInvoice.tsx
View File

@ -25,10 +25,18 @@ type Props = {
};
const BridgeInvoice: React.FC<Props> = ({ payee, stopSending, satsAmount }) => {
const { error, currencyRates, fee, broadcastSuccess, denomination, psbt } =
useSettings();
const {
error,
currencyRates,
fee,
broadcastSuccess,
denomination,
psbt,
history,
} = useSettings();
const [txHex, setTxHex] = useState('');
const [ready, setReady] = useState(false);
const [historyLength, setHistoryLength] = useState(0);
const [localError, setLocalError] = useState('');
const [broadcasting, setBroadcasting] = useState(false);
const invoiceRef = useRef();
@ -44,7 +52,17 @@ const BridgeInvoice: React.FC<Props> = ({ payee, stopSending, satsAmount }) => {
useEffect(() => {
window.open('https://bridge.urbit.org/?kind=btc&utx=' + psbt);
});
}, []);
useEffect(() => {
if (historyLength === 0) {
setHistoryLength(history.length);
}
if (broadcasting && history.length > historyLength) {
setBroadcasting(false);
stopSending();
}
}, [history]);
const broadCastTx = (hex: string) => {
let command = {
@ -65,9 +83,14 @@ const BridgeInvoice: React.FC<Props> = ({ payee, stopSending, satsAmount }) => {
};
const checkTxHex = (e: React.ChangeEvent<HTMLInputElement>) => {
setTxHex(e.target.value);
setReady(txHex.length > 0);
setLocalError('');
// TODO: validate this hex with something other than length check.
if (e.target.value.length > 0) {
setTxHex(e.target.value);
setReady(true);
setLocalError('');
} else {
setLocalError('Invalid transaction hex');
}
};
let inputColor = 'black';

33
pkg/btc-wallet/src/components/Send/ExternalInvoice.tsx
View File

@ -29,10 +29,18 @@ const ExternalInvoice: React.FC<Props> = ({
stopSending,
satsAmount,
}) => {
const { error, currencyRates, fee, broadcastSuccess, denomination, psbt } =
useSettings();
const {
error,
currencyRates,
fee,
broadcastSuccess,
denomination,
psbt,
history,
} = useSettings();
const [txHex, setTxHex] = useState('');
const [ready, setReady] = useState(false);
const [historyLength, setHistoryLength] = useState(0);
const [localError, setLocalError] = useState('');
const [broadcasting, setBroadcasting] = useState(false);
const invoiceRef = useRef();
@ -46,6 +54,16 @@ const ExternalInvoice: React.FC<Props> = ({
}
}, [error, broadcasting, setBroadcasting]);
useEffect(() => {
if (historyLength === 0) {
setHistoryLength(history.length);
}
if (broadcasting && history.length > historyLength) {
setBroadcasting(false);
stopSending();
}
}, [history]);
const broadCastTx = (hex: string) => {
let command = {
'broadcast-tx': hex,
@ -65,9 +83,14 @@ const ExternalInvoice: React.FC<Props> = ({
};
const checkTxHex = (e: React.ChangeEvent<HTMLInputElement>) => {
setTxHex(e.target.value);
setReady(txHex.length > 0);
setLocalError('');
// TODO: validate this hex with something other than length check.
if (e.target.value.length > 0) {
setTxHex(e.target.value);
setReady(true);
setLocalError('');
} else {
setLocalError('Invalid transaction hex');
}
};
const copyPsbt = () => {

12
pkg/btc-wallet/src/components/Send/Invoice.tsx
View File

@ -59,9 +59,11 @@ const Invoice: React.FC<Props> = ({ stopSending, payee, satsAmount }) => {
broadcastSuccess,
network,
denomination,
history,
} = useSettings();
const [masterTicket, setMasterTicket] = useState('');
const [ready, setReady] = useState(false);
const [historyLength, setHistoryLength] = useState(0);
const [localError, setLocalError] = useState(error);
const [broadcasting, setBroadcasting] = useState(false);
@ -78,6 +80,16 @@ const Invoice: React.FC<Props> = ({ stopSending, payee, satsAmount }) => {
return api.btcWalletCommand(command);
};
useEffect(() => {
if (historyLength === 0) {
setHistoryLength(history.length);
}
if (broadcasting && history.length > historyLength) {
setBroadcasting(false);
stopSending();
}
}, [history]);
const sendBitcoin = (ticket: string, psbt: string) => {
const newPsbt = bitcoin.Psbt.fromBase64(psbt);
setBroadcasting(true);

10
pkg/btc-wallet/src/components/Settings.tsx
View File

@ -1,7 +1,8 @@
import React from 'react';
import { Row, Text, Button, Col } from '@tlon/indigo-react';
import { Box, Icon, Row, Text, Button, Col } from '@tlon/indigo-react';
import { useSettings } from '../hooks/useSettings';
import { api } from '../lib/api';
import { Link } from 'react-router-dom';
const Settings = () => {
const { wallet, provider } = useSettings();
@ -39,10 +40,15 @@ const Settings = () => {
borderRadius="48px"
backgroundColor="white"
>
<Row mb="12px">
<Row mb="12px" alignItems="center" justifyContent="space-between">
<Text fontSize={1} fontWeight="bold" color="black">
XPub Derivation
</Text>
<Link to="/~btc">
<Box backgroundColor="white" width={5} height={5} p={2} m={2}>
<Icon icon="X" />
</Box>
</Link>
</Row>
<Row
borderRadius="12px"