Add maker status on book page

This commit is contained in:
Reckless_Satoshi 2022-02-03 10:06:30 -08:00
parent 217c105fd8
commit 71532d52d0
No known key found for this signature in database
GPG Key ID: 9C4585B561315571
4 changed files with 55 additions and 46 deletions

View File

@ -55,6 +55,14 @@ class Logics():
return False, {'bad_request': 'Your order is too small. It is worth '+'{:,}'.format(order.t0_satoshis)+' Sats now, but the limit is '+'{:,}'.format(MIN_TRADE)+ ' Sats'}
return True, None
def user_activity_status(last_seen):
if last_seen > (timezone.now() - timedelta(minutes=2)):
return 'Active'
elif last_seen > (timezone.now() - timedelta(minutes=10)):
return 'Seen recently'
else:
return 'Inactive'
@classmethod
def take(cls, order, user):
is_penalized, time_out = cls.is_penalized(user)

View File

@ -136,20 +136,9 @@ class OrderView(viewsets.ViewSet):
# Add activity status of participants based on last_seen
if order.taker_last_seen != None:
if order.taker_last_seen > (timezone.now() - timedelta(minutes=2)):
data['taker_status'] = 'active'
elif order.taker_last_seen > (timezone.now() - timedelta(minutes=10)):
data['taker_status'] = 'seen_recently'
else:
data['taker_status'] = 'inactive'
data['taker_status'] = Logics.user_activity_status(order.taker_last_seen)
if order.maker_last_seen != None:
if order.maker_last_seen > (timezone.now() - timedelta(minutes=2)):
data['maker_status'] = 'active'
elif order.maker_last_seen > (timezone.now() - timedelta(minutes=10)):
data['maker_status'] = 'seen_recently'
else:
data['maker_status'] = 'inactive'
data['maker_status'] = Logics.user_activity_status(order.maker_last_seen)
# 3.b If order is between public and WF2
if order.status >= Order.Status.PUB and order.status < Order.Status.WF2:
@ -157,7 +146,6 @@ class OrderView(viewsets.ViewSet):
# 3. c) If maker and Public, add num robots in book, premium percentile and num similar orders.
if data['is_maker'] and order.status == Order.Status.PUB:
data['robots_in_book'] = None # TODO
data['premium_percentile'] = compute_premium_percentile(order)
data['num_similar_orders'] = len(Order.objects.filter(currency=order.currency, status=Order.Status.PUB))
@ -484,7 +472,7 @@ class BookView(ListAPIView):
# Compute current premium for those orders that are explicitly priced.
data['price'], data['premium'] = Logics.price_and_premium_now(order)
data['maker_status'] = Logics.user_activity_status(order.maker_last_seen)
for key in ('status','taker'): # Non participants should not see the status or who is the taker
del data[key]

View File

@ -1,5 +1,5 @@
import React, { Component } from "react";
import { Tooltip, Paper, Button , CircularProgress, ListItemButton, Typography, Grid, Select, MenuItem, FormControl, FormHelperText, List, ListItem, ListItemText, Avatar, RouterLink, ListItemAvatar, IconButton} from "@mui/material";
import { Badge, Tooltip, Paper, Button , CircularProgress, ListItemButton, Typography, Grid, Select, MenuItem, FormControl, FormHelperText, List, ListItem, ListItemText, Avatar, RouterLink, ListItemAvatar, IconButton} from "@mui/material";
import { Link } from 'react-router-dom'
import { DataGrid } from '@mui/x-data-grid';
import MediaQuery from 'react-responsive'
@ -70,6 +70,13 @@ export default class BookPage extends Component {
return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
}
// Colors for the status badges
statusBadgeColor(status){
if(status=='Active'){return("success")}
if(status=='Seen recently'){return("warning")}
if(status=='Inactive'){return('error')}
}
bookListTableDesktop=()=>{
return (
<div style={{ height: 475, width: '100%' }}>
@ -78,7 +85,8 @@ export default class BookPage extends Component {
this.state.orders.map((order) =>
({id: order.id,
avatar: window.location.origin +'/static/assets/avatars/' + order.maker_nick + '.png',
robosat: order.maker_nick,
robot: order.maker_nick,
robot_status: order.maker_status,
type: order.type ? "Seller": "Buyer",
amount: parseFloat(parseFloat(order.amount).toFixed(4)),
currency: this.getCurrencyCode(order.currency),
@ -90,21 +98,25 @@ export default class BookPage extends Component {
columns={[
// { field: 'id', headerName: 'ID', width: 40 },
{ field: 'robosat', headerName: 'RoboSat', width: 240,
{ field: 'robot', headerName: 'Robot', width: 240,
renderCell: (params) => {return (
<ListItemButton style={{ cursor: "pointer" }}>
<ListItemAvatar>
<div style={{ width: 48, height: 48 }}>
<Image className='bookAvatar'
disableError='true'
disableSpinner='true'
color='null'
alt={params.row.robosat}
src={params.row.avatar}
/>
</div>
<Tooltip placement="right" enterTouchDelay="0" title={params.row.robot_status}>
<Badge variant="dot" overlap="circular" badgeContent="" color={this.statusBadgeColor(params.row.robot_status)}>
<div style={{ width: 45, height: 45 }}>
<Image className='bookAvatar'
disableError='true'
disableSpinner='true'
color='null'
alt={params.row.robot}
src={params.row.avatar}
/>
</div>
</Badge>
</Tooltip>
</ListItemAvatar>
<ListItemText primary={params.row.robosat}/>
<ListItemText primary={params.row.robot}/>
</ListItemButton>
);
} },
@ -141,7 +153,8 @@ export default class BookPage extends Component {
this.state.orders.map((order) =>
({id: order.id,
avatar: window.location.origin +'/static/assets/avatars/' + order.maker_nick + '.png',
robosat: order.maker_nick,
robot: order.maker_nick,
robot_status: order.maker_status,
type: order.type ? "Seller": "Buyer",
amount: parseFloat(parseFloat(order.amount).toFixed(4)),
currency: this.getCurrencyCode(order.currency),
@ -153,23 +166,30 @@ export default class BookPage extends Component {
columns={[
// { field: 'id', headerName: 'ID', width: 40 },
{ field: 'robosat', headerName: 'Robot', width: 80,
{ field: 'robot', headerName: 'Robot', width: 80,
renderCell: (params) => {return (
<Tooltip placement="right" enterTouchDelay="0" title={params.row.robosat+" ("+params.row.type+")"}>
<Tooltip placement="right" enterTouchDelay="0" title={params.row.robot+" ("+params.row.robot_status+")"}>
<Badge variant="dot" overlap="circular" badgeContent="" color={this.statusBadgeColor(params.row.robot_status)}>
<div style={{ width: 45, height: 45 }}>
<Image className='bookAvatar'
disableError='true'
disableSpinner='true'
color='null'
alt={params.row.robosat}
alt={params.row.robot}
src={params.row.avatar}
/>
</div>
</Badge>
</Tooltip>
);
} },
{ field: 'type', headerName: 'Is', width: 60, hide:'true'},
{ field: 'amount', headerName: 'Amount', type: 'number', width: 80 },
{ field: 'amount', headerName: 'Amount', type: 'number', width: 80,
renderCell: (params) => {return (
<Tooltip placement="right" enterTouchDelay="0" title={params.row.type}>
<div style={{ cursor: "pointer" }}>{this.pn(params.row.amount)}</div>
</Tooltip>
)} },
{ field: 'currency', headerName: 'Currency', width: 100,
renderCell: (params) => {return (
<Tooltip placement="left" enterTouchDelay="0" title={params.row.payment_method}>

View File

@ -355,16 +355,9 @@ export default class OrderPage extends Component {
// Colors for the status badges
statusBadgeColor(status){
if(status=='active'){return("success")}
if(status=='seen_recently'){return("warning")}
if(status=='inactive'){return('error')}
}
// Colors for the status badges
statusTooltip(status){
if(status=='active'){return("Active")}
if(status=='seen_recently'){return("Seen recently")}
if(status=='inactive'){return('Inactive')}
if(status=='Active'){return("success")}
if(status=='Seen recently'){return("warning")}
if(status=='Inactive'){return('error')}
}
orderBox=()=>{
@ -380,8 +373,8 @@ export default class OrderPage extends Component {
<List dense="true">
<ListItem >
<ListItemAvatar sx={{ width: 56, height: 56 }}>
<Tooltip placement="top" enterTouchDelay="0" title={this.statusTooltip(this.state.maker_status)} >
<Badge variant="dot" badgeContent="" color={this.statusBadgeColor(this.state.maker_status)}>
<Tooltip placement="top" enterTouchDelay="0" title={this.state.maker_status} >
<Badge variant="dot" overlap="circular" badgeContent="" color={this.statusBadgeColor(this.state.maker_status)}>
<Avatar className="flippedSmallAvatar"
alt={this.state.maker_nick}
src={window.location.origin +'/static/assets/avatars/' + this.state.maker_nick + '.png'}
@ -401,7 +394,7 @@ export default class OrderPage extends Component {
<ListItemText primary={this.state.taker_nick + (this.state.type ? " (Buyer)" : " (Seller)")} secondary="Order taker"/>
<ListItemAvatar >
<Tooltip enterTouchDelay="0" title={this.statusTooltip(this.state.taker_status)} >
<Badge variant="dot" badgeContent="" color={this.statusBadgeColor(this.state.taker_status)}>
<Badge variant="dot" overlap="circular" badgeContent="" color={this.statusBadgeColor(this.state.taker_status)}>
<Avatar className="smallAvatar"
alt={this.state.taker_nick}
src={window.location.origin +'/static/assets/avatars/' + this.state.taker_nick + '.png'}