mirror of
https://github.com/RoboSats/robosats.git
synced 2024-12-13 19:06:26 +00:00
Localize encrypted chat
This commit is contained in:
Reckless_Satoshi
parent
508151eae5
commit
185909c50d
@ -22,6 +22,31 @@ import ContentCopy from "@mui/icons-material/ContentCopy";
|
|||||||
import ForumIcon from '@mui/icons-material/Forum';
|
import ForumIcon from '@mui/icons-material/Forum';
|
||||||
import { ExportIcon, NewTabIcon } from '../Icons';
|
import { ExportIcon, NewTabIcon } from '../Icons';
|
||||||
|
|
||||||
|
function CredentialTextfield(props){
|
||||||
|
return(
|
||||||
|
<Grid item align="center" xs={12}>
|
||||||
|
<Tooltip placement="top" enterTouchDelay={200} enterDelay={200} title={props.tooltipTitle}>
|
||||||
|
<TextField
|
||||||
|
sx={{width:"100%", maxWidth:"550px"}}
|
||||||
|
disabled
|
||||||
|
label={<b>{props.label}</b>}
|
||||||
|
value={props.value}
|
||||||
|
variant='filled'
|
||||||
|
size='small'
|
||||||
|
InputProps={{
|
||||||
|
endAdornment:
|
||||||
|
<Tooltip disableHoverListener enterTouchDelay={0} title={props.copiedTitle}>
|
||||||
|
<IconButton onClick={()=> navigator.clipboard.writeText(props.value)}>
|
||||||
|
<ContentCopy/>
|
||||||
|
</IconButton>
|
||||||
|
</Tooltip>,
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</Tooltip>
|
||||||
|
</Grid>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
type Props = {
|
type Props = {
|
||||||
open: boolean;
|
open: boolean;
|
||||||
onClose: () => void;
|
onClose: () => void;
|
||||||
@ -66,89 +91,29 @@ const AuditPGPDialog = ({
|
|||||||
<Button component={Link} target="_blank" href="https://learn.robosats.com/docs/pgp-encryption">{t("Learn how to verify")} <NewTabIcon sx={{width:16,height:16}}/></Button>
|
<Button component={Link} target="_blank" href="https://learn.robosats.com/docs/pgp-encryption">{t("Learn how to verify")} <NewTabIcon sx={{width:16,height:16}}/></Button>
|
||||||
</Grid>
|
</Grid>
|
||||||
|
|
||||||
<Grid item align="center" xs={12}>
|
<CredentialTextfield
|
||||||
<Tooltip placement="top" enterTouchDelay={0} enterDelay={0} title={t("Your PGP public key. Your peer uses it to encrypt messages only you can read.")}>
|
tooltipTitle={t("Your PGP public key. Your peer uses it to encrypt messages only you can read.")}
|
||||||
<TextField
|
label={t("Your public key")}
|
||||||
sx={{width:"100%", maxWidth:"550px"}}
|
|
||||||
disabled
|
|
||||||
label={<b>{t("Your public key")}</b>}
|
|
||||||
value={own_pub_key}
|
value={own_pub_key}
|
||||||
variant='filled'
|
copiedTitle={t("Copied!")}/>
|
||||||
size='small'
|
|
||||||
InputProps={{
|
|
||||||
endAdornment:
|
|
||||||
<Tooltip disableHoverListener enterTouchDelay={0} title={t("Copied!")}>
|
|
||||||
<IconButton onClick={()=> navigator.clipboard.writeText(own_pub_key)}>
|
|
||||||
<ContentCopy/>
|
|
||||||
</IconButton>
|
|
||||||
</Tooltip>,
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</Tooltip>
|
|
||||||
</Grid>
|
|
||||||
|
|
||||||
<Grid item align="center" xs={12}>
|
<CredentialTextfield
|
||||||
<Tooltip placement="top" enterTouchDelay={0} enterDelay={0} title={t("Your peer PGP public key. You use it to encrypt messages only he can read.and to verify your peer signed the incoming messages.")}>
|
tooltipTitle={t("Your peer PGP public key. You use it to encrypt messages only he can read and to verify your peer signed the incoming messages.")}
|
||||||
<TextField
|
label={t("Peer public key")}
|
||||||
sx={{width:"100%", maxWidth:"550px"}}
|
|
||||||
disabled
|
|
||||||
label={<b>{t("Peer public key")}</b>}
|
|
||||||
value={peer_pub_key}
|
value={peer_pub_key}
|
||||||
variant='filled'
|
copiedTitle={t("Copied!")}/>
|
||||||
size='small'
|
|
||||||
InputProps={{
|
|
||||||
endAdornment:
|
|
||||||
<Tooltip disableHoverListener enterTouchDelay={0} title={t("Copied!")}>
|
|
||||||
<IconButton onClick={()=> navigator.clipboard.writeText(peer_pub_key)}>
|
|
||||||
<ContentCopy/>
|
|
||||||
</IconButton>
|
|
||||||
</Tooltip>,
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</Tooltip>
|
|
||||||
</Grid>
|
|
||||||
|
|
||||||
<Grid item align="center" xs={12}>
|
<CredentialTextfield
|
||||||
<Tooltip placement="top" enterTouchDelay={0} enterDelay={0} title={t("Your encrypted private key. You use it to decrypt the messages that your peer encrypted for you. You also use it to sign the messages you send.")}>
|
tooltipTitle={t("Your encrypted private key. You use it to decrypt the messages that your peer encrypted for you. You also use it to sign the messages you send.")}
|
||||||
<TextField
|
label={t("Your encrypted private key")}
|
||||||
sx={{width:"100%", maxWidth:"550px"}}
|
|
||||||
disabled
|
|
||||||
label={<b>{t("Your encrypted private key")}</b>}
|
|
||||||
value={own_enc_priv_key}
|
value={own_enc_priv_key}
|
||||||
variant='filled'
|
copiedTitle={t("Copied!")}/>
|
||||||
size='small'
|
|
||||||
InputProps={{
|
|
||||||
endAdornment:
|
|
||||||
<Tooltip disableHoverListener enterTouchDelay={0} title={t("Copied!")}>
|
|
||||||
<IconButton onClick={()=> navigator.clipboard.writeText(own_enc_priv_key)}>
|
|
||||||
<ContentCopy/>
|
|
||||||
</IconButton>
|
|
||||||
</Tooltip>,
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</Tooltip>
|
|
||||||
</Grid>
|
|
||||||
|
|
||||||
<Grid item align="center" xs={12}>
|
<CredentialTextfield
|
||||||
<Tooltip placement="top" enterTouchDelay={0} enterDelay={0} title={t("The passphrase to decrypt your private key. Only you know it! Do not share. It is also your robot avatar user token.")}>
|
tooltipTitle={t("The passphrase to decrypt your private key. Only you know it! Do not share. It is also your robot token.")}
|
||||||
<TextField
|
label={t("Your private key passphrase (keep secure!)")}
|
||||||
sx={{width:"100%", maxWidth:"550px"}}
|
|
||||||
disabled
|
|
||||||
label={<b>{t("Your private key passphrase (keep secure!)")}</b>}
|
|
||||||
value={passphrase}
|
value={passphrase}
|
||||||
variant='filled'
|
copiedTitle={t("Copied!")}/>
|
||||||
size='small'
|
|
||||||
InputProps={{
|
|
||||||
endAdornment:
|
|
||||||
<Tooltip disableHoverListener enterTouchDelay={0} title={t("Copied!")}>
|
|
||||||
<IconButton onClick={()=> navigator.clipboard.writeText(passphrase)}>
|
|
||||||
<ContentCopy/>
|
|
||||||
</IconButton>
|
|
||||||
</Tooltip>,
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</Tooltip>
|
|
||||||
</Grid>
|
|
||||||
|
|
||||||
<br/>
|
<br/>
|
||||||
<Grid item xs={6}>
|
<Grid item xs={6}>
|
||||||
|
|||||||
@ -241,101 +241,11 @@ class Chat extends Component {
|
|||||||
<Paper elevation={1} style={{ height: '300px', maxHeight: '300px' , width: '280px' ,overflow: 'auto', backgroundColor: '#F7F7F7' }}>
|
<Paper elevation={1} style={{ height: '300px', maxHeight: '300px' , width: '280px' ,overflow: 'auto', backgroundColor: '#F7F7F7' }}>
|
||||||
{this.state.messages.map((message, index) =>
|
{this.state.messages.map((message, index) =>
|
||||||
<li style={{listStyleType:"none"}} key={index}>
|
<li style={{listStyleType:"none"}} key={index}>
|
||||||
{/* If message sender is not our nick, gray color, if it is our nick, green color */}
|
|
||||||
{message.userNick == this.props.ur_nick ?
|
{message.userNick == this.props.ur_nick ?
|
||||||
<this.messageCard message={message} index={index} cardColor={'#eeeeee'} userConnected={this.state.connected}/>
|
<this.messageCard message={message} index={index} cardColor={'#eeeeee'} userConnected={this.state.connected}/>
|
||||||
:
|
:
|
||||||
<this.messageCard message={message} index={index} cardColor={'#fafafa'} userConnected={this.state.peer_connected}/>
|
<this.messageCard message={message} index={index} cardColor={'#fafafa'} userConnected={this.state.peer_connected}/>
|
||||||
}
|
}
|
||||||
{/* // <CardHeader sx={{color: '#333333'}}
|
|
||||||
// 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={
|
|
||||||
// <Tooltip placement="top" enterTouchDelay={0} enterDelay={500} enterNextDelay={2000} title={t(message.validSignature ? "Verified signature by {{nickname}}": "Invalid signature! Not sent by {{nickname}}",{"nickname": message.userNick})}>
|
|
||||||
// <div style={{display:'flex',alignItems:'center', flexWrap:'wrap', position:'relative',left:-5, width:210}}>
|
|
||||||
// <div style={{width:168,display:'flex',alignItems:'center', flexWrap:'wrap'}}>
|
|
||||||
// {message.userNick}
|
|
||||||
// {message.validSignature ?
|
|
||||||
// <CheckIcon sx={{height:16}} color="success"/>
|
|
||||||
// :
|
|
||||||
// <CloseIcon sx={{height:16}} color="error"/>
|
|
||||||
// }
|
|
||||||
// </div>
|
|
||||||
// <div style={{width:20}}>
|
|
||||||
// <IconButton sx={{height:18,width:18}}
|
|
||||||
// onClick={()=>
|
|
||||||
// this.setState(prevState => {
|
|
||||||
// const newShowPGP = [...prevState.showPGP];
|
|
||||||
// newShowPGP[index] = !newShowPGP[index];
|
|
||||||
// return {showPGP: newShowPGP};
|
|
||||||
// })}>
|
|
||||||
// <VisibilityIcon color={this.state.showPGP[index]? "primary":"inherit"} sx={{height:16,width:16,color:this.state.showPGP[index]? "primary":"#333333"}}/>
|
|
||||||
// </IconButton>
|
|
||||||
// </div>
|
|
||||||
// <div style={{width:20}}>
|
|
||||||
// <Tooltip disableHoverListener enterTouchDelay={0} title={t("Copied!")}>
|
|
||||||
// <IconButton sx={{height:18,width:18}}
|
|
||||||
// onClick={()=> navigator.clipboard.writeText(this.state.showPGP[index] ? message.encryptedMessage : message.plainTextMessage)}>
|
|
||||||
// <ContentCopy sx={{height:16,width:16,color:'#333333'}}/>
|
|
||||||
// </IconButton>
|
|
||||||
// </Tooltip>
|
|
||||||
// </div>
|
|
||||||
// </div>
|
|
||||||
// </Tooltip>
|
|
||||||
// }
|
|
||||||
// subheader={this.state.showPGP[index] ? message.encryptedMessage : message.plainTextMessage}
|
|
||||||
// subheaderTypographyProps={{sx: {wordWrap: "break-word", width: '200px', color: '#444444', fontSize: this.state.showPGP[index]? 11 : null }}}
|
|
||||||
// />
|
|
||||||
// :
|
|
||||||
// <CardHeader sx={{color: '#333333'}}
|
|
||||||
// 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={
|
|
||||||
// <Tooltip placement="top" enterTouchDelay={0} enterDelay={500} enterNextDelay={2000} title={t(message.validSignature ? "Verified signature by {{nickname}}": "Invalid signature! Not sent by {{nickname}}",{"nickname": message.userNick})}>
|
|
||||||
// <div style={{display:'flex',alignItems:'center', flexWrap:'wrap', position:'relative',left:-5, width:210}}>
|
|
||||||
// <div style={{width:168,display:'flex',alignItems:'center', flexWrap:'wrap'}}>
|
|
||||||
// {message.userNick}
|
|
||||||
// {message.validSignature ?
|
|
||||||
// <CheckIcon sx={{height:16}} color="success"/>
|
|
||||||
// :
|
|
||||||
// <CloseIcon sx={{height:16}} color="error"/>
|
|
||||||
// }
|
|
||||||
// </div>
|
|
||||||
// <div style={{width:20}}>
|
|
||||||
// <IconButton sx={{height:18,width:18}}
|
|
||||||
// onClick={()=>
|
|
||||||
// this.setState(prevState => {
|
|
||||||
// const newShowPGP = [...prevState.showPGP];
|
|
||||||
// newShowPGP[index] = !newShowPGP[index];
|
|
||||||
// return {showPGP: newShowPGP};
|
|
||||||
// })}>
|
|
||||||
// <VisibilityIcon color={this.state.showPGP[index]? "primary":"inherit"} sx={{height:16,width:16,color:this.state.showPGP[index]? "primary":"#333333"}}/>
|
|
||||||
// </IconButton>
|
|
||||||
// </div>
|
|
||||||
// <div style={{width:20}}>
|
|
||||||
// <Tooltip disableHoverListener enterTouchDelay={0} title={t("Copied!")}>
|
|
||||||
// <IconButton sx={{height:18,width:18}}
|
|
||||||
// onClick={()=> navigator.clipboard.writeText(this.state.showPGP[index] ? message.encryptedMessage : message.plainTextMessage)}>
|
|
||||||
// <ContentCopy sx={{height:16,width:16,color:'#333333'}}/>
|
|
||||||
// </IconButton>
|
|
||||||
// </Tooltip>
|
|
||||||
// </div>
|
|
||||||
// </div>
|
|
||||||
// </Tooltip> */}
|
|
||||||
</li>)}
|
</li>)}
|
||||||
<div style={{ float:"left", clear: "both" }} ref={(el) => { this.messagesEnd = el; }}></div>
|
<div style={{ float:"left", clear: "both" }} ref={(el) => { this.messagesEnd = el; }}></div>
|
||||||
</Paper>
|
</Paper>
|
||||||
|
|||||||
@ -259,9 +259,32 @@
|
|||||||
"Type a message":"Type a message",
|
"Type a message":"Type a message",
|
||||||
"Connecting...":"Connecting...",
|
"Connecting...":"Connecting...",
|
||||||
"Send":"Send",
|
"Send":"Send",
|
||||||
"The chat has no memory: if you leave, messages are lost.":"The chat has no memory: if you leave, messages are lost.",
|
"Verify your privacy":"Verify your privacy",
|
||||||
"Learn easy PGP encryption.":"Learn easy PGP encryption.",
|
"Audit PGP":"Audit PGP",
|
||||||
"PGP_guide_url":"https://learn.robosats.com/docs/pgp-encryption/",
|
"Save full log as a JSON file (messages and credentials)":"Save full log as a JSON file (messages and credentials)",
|
||||||
|
"Export":"Export",
|
||||||
|
"Don't trust, verify":"Don't trust, verify",
|
||||||
|
"Your communication is end-to-end encrypted with OpenPGP. You can verify the privacy of this chat using any tool based on the OpenPGP standard.":"Your communication is end-to-end encrypted with OpenPGP. You can verify the privacy of this chat using any tool based on the OpenPGP standard.",
|
||||||
|
"Learn how to verify":"Learn how to verify",
|
||||||
|
"Your PGP public key. Your peer uses it to encrypt messages only you can read.":"Your PGP public key. Your peer uses it to encrypt messages only you can read.",
|
||||||
|
"Your public key":"Your public key",
|
||||||
|
"Your peer PGP public key. You use it to encrypt messages only he can read and to verify your peer signed the incoming messages.":"Your peer PGP public key. You use it to encrypt messages only he can read.and to verify your peer signed the incoming messages.",
|
||||||
|
"Peer public key":"Peer public key",
|
||||||
|
"Your encrypted private key. You use it to decrypt the messages that your peer encrypted for you. You also use it to sign the messages you send.":"Your encrypted private key. You use it to decrypt the messages that your peer encrypted for you. You also use it to sign the messages you send.",
|
||||||
|
"Your encrypted private key":"Your encrypted private key",
|
||||||
|
"The passphrase to decrypt your private key. Only you know it! Do not share. It is also your robot token.":"The passphrase to decrypt your private key. Only you know it! Do not share. It is also your robot avatar user token.",
|
||||||
|
"Your private key passphrase (keep secure!)":"Your private key passphrase (keep secure!)",
|
||||||
|
"Save credentials as a JSON file":"Save credentials as a JSON file",
|
||||||
|
"Keys":"Keys",
|
||||||
|
"Save messages as a JSON file":"Save messages as a JSON file",
|
||||||
|
"Messages":"Messages",
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
"CONTRACT BOX - TradeBox.js": "The Contract Box that guides users trough the whole trade pipeline",
|
"CONTRACT BOX - TradeBox.js": "The Contract Box that guides users trough the whole trade pipeline",
|
||||||
"Contract Box":"Contract Box",
|
"Contract Box":"Contract Box",
|
||||||
|
|||||||
@ -258,9 +258,25 @@
|
|||||||
"Type a message": "Escribe un mensaje",
|
"Type a message": "Escribe un mensaje",
|
||||||
"Connecting...": "Conectando...",
|
"Connecting...": "Conectando...",
|
||||||
"Send": "Enviar",
|
"Send": "Enviar",
|
||||||
"The chat has no memory: if you leave, messages are lost.": "Chat sin memoria: si lo cierras, los mensajes se pierden.",
|
"Verify your privacy":"Verifica tu privacidad",
|
||||||
"Learn easy PGP encryption.": "Aprende encriptación PGP.",
|
"Audit PGP":"Auditar",
|
||||||
"PGP_guide_url":"https://learn.robosats.com/docs/pgp-encryption/es",
|
"Save full log as a JSON file (messages and credentials)":"Guardar el log completo como JSON (credenciales y mensajes)",
|
||||||
|
"Export":"Exporta",
|
||||||
|
"Don't trust, verify":"No confíes, verifica",
|
||||||
|
"Your communication is end-to-end encrypted with OpenPGP. You can verify the privacy of this chat using any tool based on the OpenPGP standard.":"Tu comunicación se encripta de punta-a-punta con OpenPGP. Puedes verificar la privacida de este chat con cualquier herramienta de tercero basada en el estandar PGP.",
|
||||||
|
"Learn how to verify":"Aprende a verificar",
|
||||||
|
"Your PGP public key. Your peer uses it to encrypt messages only you can read.":"Esta es tu llave pública PGP. Tu contraparte la usa para encriptar mensajes que sólo tú puedes leer.",
|
||||||
|
"Your public key":"Tu llave pública",
|
||||||
|
"Your peer PGP public key. You use it to encrypt messages only he can read and to verify your peer signed the incoming messages.":"La llave pública PGP de tu contraparte. La usas para encriptar mensajes que solo él puede leer y verificar que es él quíen firmó los mensajes que recibes.",
|
||||||
|
"Peer public key":"Llave pública de tu contraparte",
|
||||||
|
"Your encrypted private key. You use it to decrypt the messages that your peer encrypted for you. You also use it to sign the messages you send.":"Tu llave privada PGP encriptada. La usas para desencriptar los mensajes que tu contraparte te envia. También la usas para firmar los mensajes que le envias.",
|
||||||
|
"Your encrypted private key":"Tu llave privada encriptada",
|
||||||
|
"The passphrase to decrypt your private key. Only you know it! Do not share. It is also your robot token.":"La contraseña para desencriptar tu llave privada. ¡Solo tú la sabes! Mantenla en secreto. También es el token de tu robot.",
|
||||||
|
"Your private key passphrase (keep secure!)":"La contraseña de tu llave privada ¡Mantener segura!",
|
||||||
|
"Save credentials as a JSON file":"Guardar credenciales como achivo JSON",
|
||||||
|
"Keys":"Llaves",
|
||||||
|
"Save messages as a JSON file":"Guardar mensajes como archivo JSON",
|
||||||
|
"Messages":"Mensajes",
|
||||||
|
|
||||||
"CONTRACT BOX - TradeBox.js": "The Contract Box that guides users trough the whole trade pipeline",
|
"CONTRACT BOX - TradeBox.js": "The Contract Box that guides users trough the whole trade pipeline",
|
||||||
"Contract Box": "Contrato",
|
"Contract Box": "Contrato",
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user