From a4afb81ccc569c1bd4678fcd308d0b2a6eb709ad Mon Sep 17 00:00:00 2001 From: Reckless_Satoshi Date: Tue, 3 May 2022 15:23:27 -0700 Subject: [PATCH] Prompt user to store token before order making --- frontend/src/components/HomePage.js | 4 +- frontend/src/components/MakerPage.js | 82 +++++++++++++++++++++++++- frontend/src/components/UserGenPage.js | 7 ++- frontend/src/locales/en.json | 8 ++- frontend/src/locales/es.json | 5 ++ 5 files changed, 98 insertions(+), 8 deletions(-) diff --git a/frontend/src/components/HomePage.js b/frontend/src/components/HomePage.js index d6fb25d5..2a6c36b0 100644 --- a/frontend/src/components/HomePage.js +++ b/frontend/src/components/HomePage.js @@ -40,9 +40,9 @@ export default class HomePage extends Component { }/> }/> - + }/> }/> - + }/>
diff --git a/frontend/src/components/MakerPage.js b/frontend/src/components/MakerPage.js index ef33c6ef..dde2af9c 100644 --- a/frontend/src/components/MakerPage.js +++ b/frontend/src/components/MakerPage.js @@ -1,6 +1,6 @@ import React, { Component } from 'react'; import { withTranslation } from "react-i18next"; -import { InputAdornment, LinearProgress, Accordion, AccordionDetails, AccordionSummary, Checkbox, Slider, Box, Tab, Tabs, SliderThumb, Tooltip, Paper, Button , Grid, Typography, TextField, Select, FormHelperText, MenuItem, FormControl, Radio, FormControlLabel, RadioGroup} from "@mui/material" +import { InputAdornment, LinearProgress, Dialog, IconButton, DialogActions, DialogContent, DialogContentText, DialogTitle, Accordion, AccordionDetails, AccordionSummary, Checkbox, Slider, Box, Tab, Tabs, SliderThumb, Tooltip, Paper, Button , Grid, Typography, TextField, Select, FormHelperText, MenuItem, FormControl, Radio, FormControlLabel, RadioGroup} from "@mui/material" import { LocalizationProvider, TimePicker} from '@mui/lab'; import DateFnsUtils from "@date-io/date-fns"; import { Link as LinkRouter } from 'react-router-dom' @@ -18,6 +18,7 @@ import BuySatsIcon from "./icons/BuySatsIcon"; import BuySatsCheckedIcon from "./icons/BuySatsCheckedIcon"; import SellSatsIcon from "./icons/SellSatsIcon"; import SellSatsCheckedIcon from "./icons/SellSatsCheckedIcon"; +import ContentCopy from "@mui/icons-material/ContentCopy"; import { getCookie } from "../utils/cookies"; import { pn } from "../utils/prettyNumbers"; @@ -232,6 +233,7 @@ class MakerPage extends Component { .then((response) => response.json()) .then((data) => (this.setState({badRequest:data.bad_request}) & (data.id ? this.props.history.push('/order/' + data.id) :""))); + this.setState({openStoreToken:false}); } getCurrencyCode(val){ @@ -696,6 +698,73 @@ class MakerPage extends Component { ) } + StoreTokenDialog = () =>{ + const { t } = this.props; + + // If there is a robot cookie, prompt user to store it + // Else, prompt user to generate a robot + if (getCookie("robot_token")){ + return( + this.setState({openStoreToken:false})} + > + + {t("Store your robot token")} + + + + {t("You might need to recover your robot avatar in the future: store it safely. You can simply copy it into another application.")} + +
+ + + (navigator.clipboard.writeText(getCookie("robot_token")) & this.props.setAppState({copiedToken:true}))}> + + + , + }} + /> + +
+ + + + +
+ ) + }else{ + return( + this.setState({openStoreToken:false})} + > + + {t("You do not have a robot avatar")} + + + + {t("You need to generate a robot avatar in order to become an order maker")} + + + + + + + + ) + } + } + makeOrderBox=()=>{ const [value, setValue] = React.useState(this.state.showAdvanced); const { t } = this.props; @@ -732,6 +801,8 @@ class MakerPage extends Component { ORDER MAKER */} + + @@ -745,10 +816,15 @@ class MakerPage extends Component { (!this.state.is_explicit & this.state.badPremium != null)) ? -
+
: - + } diff --git a/frontend/src/components/UserGenPage.js b/frontend/src/components/UserGenPage.js index da03a34a..f060cdac 100644 --- a/frontend/src/components/UserGenPage.js +++ b/frontend/src/components/UserGenPage.js @@ -73,11 +73,14 @@ class UserGenPage extends Component { avatarLoaded: false, }) : - (console.log(token) & this.props.setAppState({ + (this.props.setAppState({ nickname: data.nickname, token: token, avatarLoaded: false, - })) & writeCookie("robot_token",token)) + })) & writeCookie("robot_token",token)) + & + // If the robot has been found (recovered) we assume the token is backed up + (data.found ? this.props.setAppState({copiedToken:true}) : null) }); } diff --git a/frontend/src/locales/en.json b/frontend/src/locales/en.json index a4578621..1928bc97 100644 --- a/frontend/src/locales/en.json +++ b/frontend/src/locales/en.json @@ -70,7 +70,13 @@ "Must be more than {{min}}%":"Must be more than {{min}}%", "Must be less than {{maxSats}": "Must be less than {{maxSats}}", "Must be more than {{minSats}}": "Must be more than {{minSats}}", - + "Store your robot token":"Store your robot token", + "You might need to recover your robot avatar in the future: store it safely. You can simply copy it into another application.":"You might need to recover your robot avatar in the future: store it safely. You can simply copy it into another application.", + "Done":"Done", + "You do not have a robot avatar":"You do not have a robot avatar", + "You need to generate a robot avatar in order to become an order maker":"You need to generate a robot avatar in order to become an order maker", + + "PAYMENT METHODS - autocompletePayments.js": "Payment method strings", "not specified":"Not specified", "Instant SEPA":"Instant SEPA", diff --git a/frontend/src/locales/es.json b/frontend/src/locales/es.json index 5c56ff94..b4f66464 100644 --- a/frontend/src/locales/es.json +++ b/frontend/src/locales/es.json @@ -70,6 +70,11 @@ "Must be more than {{min}}%":"Debe ser más del {{min}}%", "Must be less than {{maxSats}": "Debe ser menos de {{maxSats}}", "Must be more than {{minSats}}": "Debe ser más de {{minSats}}", + "Store your robot token":"Guarda el token", + "You might need to recover your robot avatar in the future: store it safely. You can simply copy it into another application.":"Puede que necesites recuperar tu robot avatar en el futuro: haz una copia de seguridad del token. Puedes simplemente copiarlo en otra aplicación.", + "Done":"Hecho", + "You do not have a robot avatar":"No tienes un avatar robot", + "You need to generate a robot avatar in order to become an order maker":"Necesitas generar un avatar robot antes de crear una orden", "PAYMENT METHODS - autocompletePayments.js": "Payment method strings",