mirror of
https://github.com/RoboSats/robosats.git
synced 2025-01-31 02:21:35 +00:00
Fix warnings in Tradebox and Chat
This commit is contained in:
Reckless_Satoshi
parent
9af2e722be
commit
6112e64b61
@ -84,87 +84,88 @@ class Chat extends Component {
|
||||
const { t } = this.props;
|
||||
return (
|
||||
<Container component="main" maxWidth="xs" >
|
||||
<Grid container xs={12} spacing={0.5}>
|
||||
<Grid item xs={0.3}/>
|
||||
<Grid item xs={5.5}>
|
||||
<Paper elevation={1} style={this.state.connected ? {backgroundColor: '#e8ffe6'}: {backgroundColor: '#FFF1C5'}}>
|
||||
<Typography variant='caption' sx={{color: '#111111'}}>
|
||||
{t("You")+": "}{this.state.connected ? t("connected"): t("disconnected")}
|
||||
</Typography>
|
||||
</Paper>
|
||||
</Grid>
|
||||
<Grid item xs={0.4}/>
|
||||
<Grid item xs={5.5}>
|
||||
<Paper elevation={1} style={this.state.peer_connected ? {backgroundColor: '#e8ffe6'}: {backgroundColor: '#FFF1C5'}}>
|
||||
<Typography variant='caption' sx={{color: '#111111'}}>
|
||||
{t("Peer")+": "}{this.state.peer_connected ? t("connected"): t("disconnected")}
|
||||
</Typography>
|
||||
</Paper>
|
||||
</Grid>
|
||||
<Grid item xs={0.3}/>
|
||||
</Grid>
|
||||
<Paper elevation={1} style={{ height: '300px', maxHeight: '300px' , width: '280px' ,overflow: 'auto', backgroundColor: '#F7F7F7' }}>
|
||||
{this.state.messages.map(message => <>
|
||||
<Card elevation={5} align="left" >
|
||||
{/* If message sender is not our nick, gray color, if it is our nick, green color */}
|
||||
{message.userNick == this.props.ur_nick ?
|
||||
<CardHeader sx={{color: '#111111'}}
|
||||
avatar={
|
||||
<Badge variant="dot" overlap="circular" badgeContent="" color={this.state.connected ? "success" : "error"}>
|
||||
<Avatar className="flippedSmallAvatar"
|
||||
alt={message.userNick}
|
||||
src={window.location.origin +'/static/assets/avatars/' + message.userNick + '.png'}
|
||||
/>
|
||||
</Badge>
|
||||
}
|
||||
style={{backgroundColor: '#eeeeee'}}
|
||||
title={message.userNick}
|
||||
subheader={message.msg}
|
||||
subheaderTypographyProps={{sx: {wordWrap: "break-word", width: '200px', color: '#444444'}}}
|
||||
/>
|
||||
:
|
||||
<CardHeader sx={{color: '#111111'}}
|
||||
avatar={
|
||||
<Badge variant="dot" overlap="circular" badgeContent="" color={this.state.peer_connected ? "success" : "error"}>
|
||||
<Avatar className="flippedSmallAvatar"
|
||||
alt={message.userNick}
|
||||
src={window.location.origin +'/static/assets/avatars/' + message.userNick + '.png'}
|
||||
/>
|
||||
</Badge>
|
||||
}
|
||||
style={{backgroundColor: '#fafafa'}}
|
||||
title={message.userNick}
|
||||
subheader={message.msg}
|
||||
subheaderTypographyProps={{sx: {wordWrap: "break-word", width: '200px', color: '#444444'}}}
|
||||
/>}
|
||||
</Card>
|
||||
</>)}
|
||||
<div style={{ float:"left", clear: "both" }} ref={(el) => { this.messagesEnd = el; }}></div>
|
||||
<Grid container spacing={0.5}>
|
||||
<Grid item xs={0.3}/>
|
||||
<Grid item xs={5.5}>
|
||||
<Paper elevation={1} style={this.state.connected ? {backgroundColor: '#e8ffe6'}: {backgroundColor: '#FFF1C5'}}>
|
||||
<Typography variant='caption' sx={{color: '#111111'}}>
|
||||
{t("You")+": "}{this.state.connected ? t("connected"): t("disconnected")}
|
||||
</Typography>
|
||||
</Paper>
|
||||
<form noValidate onSubmit={this.onButtonClicked}>
|
||||
<Grid containter alignItems="stretch" style={{ display: "flex" }}>
|
||||
<Grid item alignItems="stretch" style={{ display: "flex"}}>
|
||||
<TextField
|
||||
label={t("Type a message")}
|
||||
variant="standard"
|
||||
size="small"
|
||||
helperText={this.state.connected ? null : t("Connecting...")}
|
||||
value={this.state.value}
|
||||
onChange={e => {
|
||||
this.setState({ value: e.target.value });
|
||||
this.value = this.state.value;
|
||||
}}
|
||||
sx={{width: 214}}
|
||||
/>
|
||||
</Grid>
|
||||
<Grid item alignItems="stretch" style={{ display: "flex" }}>
|
||||
<Button sx={{'width':68}} disabled={!this.state.connected} type="submit" variant="contained" color="primary">{t("Send")} </Button>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</form>
|
||||
<FormHelperText>
|
||||
{t("The chat has no memory: if you leave, messages are lost.")} <Link target="_blank" href={t("PGP_guide_url")}> {t("Learn easy PGP encryption.")}</Link>
|
||||
</FormHelperText>
|
||||
</Grid>
|
||||
<Grid item xs={0.4}/>
|
||||
<Grid item xs={5.5}>
|
||||
<Paper elevation={1} style={this.state.peer_connected ? {backgroundColor: '#e8ffe6'}: {backgroundColor: '#FFF1C5'}}>
|
||||
<Typography variant='caption' sx={{color: '#111111'}}>
|
||||
{t("Peer")+": "}{this.state.peer_connected ? t("connected"): t("disconnected")}
|
||||
</Typography>
|
||||
</Paper>
|
||||
</Grid>
|
||||
<Grid item xs={0.3}/>
|
||||
</Grid>
|
||||
<Paper elevation={1} style={{ height: '300px', maxHeight: '300px' , width: '280px' ,overflow: 'auto', backgroundColor: '#F7F7F7' }}>
|
||||
{this.state.messages.map((message, index) =>
|
||||
<li style={{listStyleType:"none"}} key={index}>
|
||||
<Card elevation={5} align="left" >
|
||||
{/* If message sender is not our nick, gray color, if it is our nick, green color */}
|
||||
{message.userNick == this.props.ur_nick ?
|
||||
<CardHeader sx={{color: '#111111'}}
|
||||
avatar={
|
||||
<Badge variant="dot" overlap="circular" badgeContent="" color={this.state.connected ? "success" : "error"}>
|
||||
<Avatar className="flippedSmallAvatar"
|
||||
alt={message.userNick}
|
||||
src={window.location.origin +'/static/assets/avatars/' + message.userNick + '.png'}
|
||||
/>
|
||||
</Badge>
|
||||
}
|
||||
style={{backgroundColor: '#eeeeee'}}
|
||||
title={message.userNick}
|
||||
subheader={message.msg}
|
||||
subheaderTypographyProps={{sx: {wordWrap: "break-word", width: '200px', color: '#444444'}}}
|
||||
/>
|
||||
:
|
||||
<CardHeader sx={{color: '#111111'}}
|
||||
avatar={
|
||||
<Badge variant="dot" overlap="circular" badgeContent="" color={this.state.peer_connected ? "success" : "error"}>
|
||||
<Avatar className="flippedSmallAvatar"
|
||||
alt={message.userNick}
|
||||
src={window.location.origin +'/static/assets/avatars/' + message.userNick + '.png'}
|
||||
/>
|
||||
</Badge>
|
||||
}
|
||||
style={{backgroundColor: '#fafafa'}}
|
||||
title={message.userNick}
|
||||
subheader={message.msg}
|
||||
subheaderTypographyProps={{sx: {wordWrap: "break-word", width: '200px', color: '#444444'}}}
|
||||
/>}
|
||||
</Card>
|
||||
</li>)}
|
||||
<div style={{ float:"left", clear: "both" }} ref={(el) => { this.messagesEnd = el; }}></div>
|
||||
</Paper>
|
||||
<form noValidate onSubmit={this.onButtonClicked}>
|
||||
<Grid alignItems="stretch" style={{ display: "flex" }}>
|
||||
<Grid item alignItems="stretch" style={{ display: "flex"}}>
|
||||
<TextField
|
||||
label={t("Type a message")}
|
||||
variant="standard"
|
||||
size="small"
|
||||
helperText={this.state.connected ? null : t("Connecting...")}
|
||||
value={this.state.value}
|
||||
onChange={e => {
|
||||
this.setState({ value: e.target.value });
|
||||
this.value = this.state.value;
|
||||
}}
|
||||
sx={{width: 214}}
|
||||
/>
|
||||
</Grid>
|
||||
<Grid item alignItems="stretch" style={{ display: "flex" }}>
|
||||
<Button sx={{'width':68}} disabled={!this.state.connected} type="submit" variant="contained" color="primary">{t("Send")} </Button>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</form>
|
||||
<FormHelperText>
|
||||
{t("The chat has no memory: if you leave, messages are lost.")} <Link target="_blank" href={t("PGP_guide_url")}> {t("Learn easy PGP encryption.")}</Link>
|
||||
</FormHelperText>
|
||||
</Container>
|
||||
)
|
||||
}
|
||||
|
||||
@ -36,6 +36,7 @@ class OrderPage extends Component {
|
||||
openCancel: false,
|
||||
openCollaborativeCancel: false,
|
||||
openInactiveMaker: false,
|
||||
openStoreToken: false,
|
||||
tabValue: 1,
|
||||
orderId: this.props.match.params.orderId,
|
||||
};
|
||||
@ -180,8 +181,8 @@ class OrderPage extends Component {
|
||||
if(this.state.has_range){
|
||||
return(
|
||||
<Grid container align="center" alignItems="stretch" justifyContent="center" style={{ display: "flex"}}>
|
||||
<this.InactiveMakerDialog/>
|
||||
<this.StoreTokenDialog/>
|
||||
{this.InactiveMakerDialog()}
|
||||
{this.StoreTokenDialog()}
|
||||
<div style={{maxWidth:120}}>
|
||||
<Tooltip placement="top" enterTouchDelay={500} enterDelay={700} enterNextDelay={2000} title={t("Enter amount of fiat to exchange for bitcoin")}>
|
||||
<Paper elevation={5} sx={{maxHeight:40}}>
|
||||
@ -226,8 +227,8 @@ class OrderPage extends Component {
|
||||
}else{
|
||||
return(
|
||||
<>
|
||||
<this.InactiveMakerDialog/>
|
||||
<this.StoreTokenDialog/>
|
||||
{this.InactiveMakerDialog()}
|
||||
{this.StoreTokenDialog()}
|
||||
<Button sx={{height:38}} variant='contained' color='primary'
|
||||
onClick={this.props.copiedToken ? (this.state.maker_status=='Inactive' ? this.handleClickOpenInactiveMakerDialog : this.takeOrder) : (() => this.setState({openStoreToken:true}))}>
|
||||
{t("Take Order")}
|
||||
@ -383,7 +384,7 @@ class OrderPage extends Component {
|
||||
size='small'
|
||||
InputProps={{
|
||||
endAdornment:
|
||||
<Tooltip disableHoverListener enterTouchDelay="0" title={t("Copied!")}>
|
||||
<Tooltip disableHoverListener enterTouchDelay={0} title={t("Copied!")}>
|
||||
<IconButton onClick= {()=> (navigator.clipboard.writeText(getCookie("robot_token")) & this.props.setAppState({copiedToken:true}))}>
|
||||
<ContentCopy color={this.props.copiedToken ? "inherit" : "primary"}/>
|
||||
</IconButton>
|
||||
@ -532,7 +533,7 @@ class OrderPage extends Component {
|
||||
{t("Order Box")}
|
||||
</Typography>
|
||||
</MediaQuery>
|
||||
<Paper elevation={12} style={{ padding: 8,}}>
|
||||
<Paper elevation={12} >
|
||||
<List dense={true}>
|
||||
<ListItem >
|
||||
<ListItemAvatar sx={{ width: 56, height: 56 }}>
|
||||
|
||||
@ -636,11 +636,21 @@ class TradeBox extends Component {
|
||||
<b> {t("We have received your statement")} </b>
|
||||
</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={12} align="left">
|
||||
<Typography variant="body2">
|
||||
<p>{t("We are waiting for your trade counterpart statement. If you are hesitant about the state of the dispute or want to add more information, contact robosats@protonmail.com.")}</p>
|
||||
<p>{t("Please, save the information needed to identify your order and your payments: order ID; payment hashes of the bonds or escrow (check on your lightning wallet); exact amount of satoshis; and robot nickname. You will have to identify yourself as the user involved in this trade via email (or other contact methods).")}</p>
|
||||
</Typography>
|
||||
<Grid item xs={12} align="center">
|
||||
<List dense={true}>
|
||||
<Divider/>
|
||||
<ListItem>
|
||||
<Typography variant="body2">
|
||||
{t("We are waiting for your trade counterpart statement. If you are hesitant about the state of the dispute or want to add more information, contact robosats@protonmail.com.")}
|
||||
</Typography>
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<Typography variant="body2">
|
||||
{t("Please, save the information needed to identify your order and your payments: order ID; payment hashes of the bonds or escrow (check on your lightning wallet); exact amount of satoshis; and robot nickname. You will have to identify yourself as the user involved in this trade via email (or other contact methods).")}
|
||||
</Typography>
|
||||
</ListItem>
|
||||
<Divider/>
|
||||
</List>
|
||||
</Grid>
|
||||
{this.showBondIsSettled()}
|
||||
</Grid>
|
||||
@ -752,10 +762,20 @@ class TradeBox extends Component {
|
||||
</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={12} align="center">
|
||||
<Typography variant="body2" align="left">
|
||||
<p>{t("We are waiting for the seller lock the trade amount.")}</p>
|
||||
<p>{t("Just hang on for a moment. If the seller does not deposit, you will get your bond back automatically. In addition, you will receive a compensation (check the rewards in your profile).")}</p>
|
||||
</Typography>
|
||||
<List dense={true}>
|
||||
<Divider/>
|
||||
<ListItem>
|
||||
<Typography variant="body2" align="left">
|
||||
{t("We are waiting for the seller lock the trade amount.")}
|
||||
</Typography>
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<Typography variant="body2" align="left">
|
||||
{t("Just hang on for a moment. If the seller does not deposit, you will get your bond back automatically. In addition, you will receive a compensation (check the rewards in your profile).")}
|
||||
</Typography>
|
||||
</ListItem>
|
||||
<Divider/>
|
||||
</List>
|
||||
</Grid>
|
||||
{this.showBondIsLocked()}
|
||||
</Grid>
|
||||
@ -774,10 +794,21 @@ class TradeBox extends Component {
|
||||
</Typography>
|
||||
</Grid>
|
||||
<Grid item xs={12} align="center">
|
||||
<Typography variant="body2" align="left">
|
||||
<p>{t("We are waiting for the buyer to post a lightning invoice. Once he does, you will be able to directly communicate the fiat payment details.")} </p>
|
||||
<p>{t("Just hang on for a moment. If the buyer does not cooperate, you will get back the trade collateral and your bond automatically. In addition, you will receive a compensation (check the rewards in your profile).")}</p>
|
||||
</Typography>
|
||||
<List dense={true}>
|
||||
<Divider/>
|
||||
<ListItem>
|
||||
<Typography variant="body2" align="left">
|
||||
{t("We are waiting for the buyer to post a lightning invoice. Once he does, you will be able to directly communicate the fiat payment details.")}
|
||||
</Typography>
|
||||
</ListItem>
|
||||
|
||||
<ListItem>
|
||||
<Typography variant="body2" align="left">
|
||||
{t("Just hang on for a moment. If the buyer does not cooperate, you will get back the trade collateral and your bond automatically. In addition, you will receive a compensation (check the rewards in your profile).")}
|
||||
</Typography>
|
||||
</ListItem>
|
||||
<Divider/>
|
||||
</List>
|
||||
</Grid>
|
||||
{this.showBondIsLocked()}
|
||||
</Grid>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user