Mirror/robosats
1
0
Fork 0
mirror of https://github.com/RoboSats/robosats.git synced 2024-12-13 19:06:26 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Add circular loading on Orders and book

Browse Source
This commit is contained in:
Reckless_Satoshi 2022-01-10 02:13:54 -08:00
parent 9bc6757ba3
commit 33df480301
No known key found for this signature in database
GPG Key ID: 9C4585B561315571
3 changed files with 22 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
frontend/src/components/BookPage.js
View File

@ -1,5 +1,5 @@
import React, { Component } from "react";
import { Box, Button , Divider, ListItemButton, Typography, Grid, Select, MenuItem, FormControl, FormHelperText, List, ListItem, ListItemText, Avatar, RouterLink, ListItemAvatar} from "@mui/material";
import { Box, Button , Divider, CircularProgress, ListItemButton, Typography, Grid, Select, MenuItem, FormControl, FormHelperText, List, ListItem, ListItemText, Avatar, RouterLink, ListItemAvatar} from "@mui/material";
import { Link } from 'react-router-dom'
export default class BookPage extends Component {
@ -9,7 +9,8 @@ export default class BookPage extends Component {
orders: new Array(),
currency: 0,
type: 1,
currencies_dict: {"0":"ANY"}
currencies_dict: {"0":"ANY"},
loading: true,
};
this.getCurrencyDict()
this.getOrderDetails(this.state.type,this.state.currency)
@ -23,6 +24,7 @@ export default class BookPage extends Component {
this.setState({
orders: data,
not_found: data.not_found,
loading: false,
}));
}
@ -33,7 +35,8 @@ export default class BookPage extends Component {
handleTypeChange=(e)=>{
this.setState({
type: e.target.value,
type: e.target.value,
loading: true,
});
this.getOrderDetails(e.target.value,this.state.currency);
}
@ -41,6 +44,7 @@ export default class BookPage extends Component {
this.setState({
currency: e.target.value,
currencyCode: this.getCurrencyCode(e.target.value),
loading: true,
})
this.getOrderDetails(this.state.type, e.target.value);
}
@ -223,6 +227,11 @@ export default class BookPage extends Component {
</Typography>
</Grid>
}
{/* If loading, show circular progressbar */}
{this.state.loading ?
<Grid item xs={12} align="center">
<CircularProgress />
</Grid> : ""}
{ this.state.not_found ?
(<Grid item xs={12} align="center">

11
frontend/src/components/MakerPage.js
View File

@ -19,6 +19,11 @@ function getCookie(name) {
}
const csrftoken = getCookie('csrftoken');
// pretty numbers
function pn(x) {
return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
}
export default class MakerPage extends Component {
defaultCurrency = 1;
defaultCurrencyCode = 'USD';
@ -72,9 +77,9 @@ export default class MakerPage extends Component {
}
handleSatoshisChange=(e)=>{
var bad_sats = e.target.value > this.maxTradeSats ?
("Must be less than "+this.maxTradeSats):
("Must be less than "+pn(this.maxTradeSats)):
(e.target.value < this.minTradeSats ?
("Must be more than "+this.minTradeSats): null)
("Must be more than "+pn(this.minTradeSats)): null)
this.setState({
satoshis: e.target.value,
@ -92,7 +97,6 @@ export default class MakerPage extends Component {
handleClickExplicit=(e)=>{
this.setState({
isExplicit: true,
satoshis: 10000,
premium: null,
});
}
@ -238,6 +242,7 @@ export default class MakerPage extends Component {
<TextField
label="Satoshis"
error={this.state.badSatoshis}
helperText={this.state.badSatoshis}
type="number"
required="true"
inputProps={{

4
frontend/src/components/OrderPage.js
View File

@ -1,5 +1,5 @@
import React, { Component } from "react";
import { Paper, Button , Grid, Typography, List, ListItem, ListItemText, ListItemAvatar, Avatar, Divider, Box, LinearProgress} from "@mui/material"
import { Paper, CircularProgress, Button , Grid, Typography, List, ListItem, ListItemText, ListItemAvatar, Avatar, Divider, Box, LinearProgress} from "@mui/material"
import TradeBox from "./TradeBox";
function msToTime(duration) {
@ -312,7 +312,7 @@ export default class OrderPage extends Component {
render (){
return (
// Only so nothing shows while requesting the first batch of data
(this.state.statusCode == null & this.state.badRequest == null) ? "" : this.orderDetailsPage()
(this.state.statusCode == null & this.state.badRequest == null) ? <CircularProgress /> : this.orderDetailsPage()
);
}
}