Changeset View
Changeset View
Standalone View
Standalone View
web/cashtab/src/components/Configure/Configure.js
Show First 20 Lines • Show All 235 Lines • ▼ Show 20 Lines | const Configure = () => { | ||||
const [newWalletName, setNewWalletName] = useState(''); | const [newWalletName, setNewWalletName] = useState(''); | ||||
const [ | const [ | ||||
confirmationOfWalletToBeDeleted, | confirmationOfWalletToBeDeleted, | ||||
setConfirmationOfWalletToBeDeleted, | setConfirmationOfWalletToBeDeleted, | ||||
] = useState(''); | ] = useState(''); | ||||
const [newWalletNameIsValid, setNewWalletNameIsValid] = useState(null); | const [newWalletNameIsValid, setNewWalletNameIsValid] = useState(null); | ||||
const [walletDeleteValid, setWalletDeleteValid] = useState(null); | const [walletDeleteValid, setWalletDeleteValid] = useState(null); | ||||
const [seedInput, openSeedInput] = useState(false); | const [seedInput, openSeedInput] = useState(false); | ||||
const [langCheck, setLangCheck] = useState(false); | |||||
bytesofman: Better variable name. For the way this is being used in the app, a good one would be… | |||||
const showPopulatedDeleteWalletModal = walletInfo => { | const showPopulatedDeleteWalletModal = walletInfo => { | ||||
setWalletToBeDeleted(walletInfo); | setWalletToBeDeleted(walletInfo); | ||||
setShowDeleteWalletModal(true); | setShowDeleteWalletModal(true); | ||||
}; | }; | ||||
const showPopulatedRenameWalletModal = walletInfo => { | const showPopulatedRenameWalletModal = walletInfo => { | ||||
setWalletToBeRenamed(walletInfo); | setWalletToBeRenamed(walletInfo); | ||||
Show All 24 Lines | const Configure = () => { | ||||
const [isValidMnemonic, setIsValidMnemonic] = useState(null); | const [isValidMnemonic, setIsValidMnemonic] = useState(null); | ||||
useEffect(() => { | useEffect(() => { | ||||
// Update savedWallets every time the active wallet changes | // Update savedWallets every time the active wallet changes | ||||
updateSavedWallets(wallet); | updateSavedWallets(wallet); | ||||
}, [wallet]); | }, [wallet]); | ||||
useEffect(() => { | |||||
console.log(langCheck); | |||||
bytesofmanUnsubmitted Not Done Inline ActionsThis kind of console.log statement is important for testing, but needs to be removed for production. Only potentially useful console.log statements should go to prod. bytesofman: This kind of `console.log` statement is important for testing, but needs to be removed for… | |||||
const langVar = navigator.languages; | |||||
bytesofmanUnsubmitted Not Done Inline ActionsBe more descriptive with your variable names. For example, this could be something like detectedBrowserLang bytesofman: Be more descriptive with your variable names.
For example, this could be something like… | |||||
console.log(langVar); | |||||
bytesofmanUnsubmitted Not Done Inline ActionsDon't need this console.log for prod bytesofman: Don't need this console.log for prod | |||||
if (langVar.includes('id')) { | |||||
setLangCheck(true); | |||||
return console.log('conditions met, langCheck set to true'); | |||||
bytesofmanUnsubmitted Not Done Inline ActionsSame same, remove this return console.log bytesofman: Same same, remove this return console.log | |||||
} | |||||
}, []); | |||||
// Need this function to ensure that savedWallets are updated on new wallet creation | // Need this function to ensure that savedWallets are updated on new wallet creation | ||||
const updateSavedWalletsOnCreate = async importMnemonic => { | const updateSavedWalletsOnCreate = async importMnemonic => { | ||||
// Event("Category", "Action", "Label") | // Event("Category", "Action", "Label") | ||||
// Track number of times a different wallet is activated | // Track number of times a different wallet is activated | ||||
Event('Configure.js', 'Create Wallet', 'New'); | Event('Configure.js', 'Create Wallet', 'New'); | ||||
const walletAdded = await addNewSavedWallet(importMnemonic); | const walletAdded = await addNewSavedWallet(importMnemonic); | ||||
if (!walletAdded) { | if (!walletAdded) { | ||||
Modal.error({ | Modal.error({ | ||||
▲ Show 20 Lines • Show All 209 Lines • ▼ Show 20 Lines | return ( | ||||
<ThemedCopyOutlined /> Backup your wallet | <ThemedCopyOutlined /> Backup your wallet | ||||
</h2> | </h2> | ||||
<Alert | <Alert | ||||
style={{ marginBottom: '12px' }} | style={{ marginBottom: '12px' }} | ||||
description="Your seed phrase is the only way to restore your wallet. Write it down. Keep it safe." | description="Your seed phrase is the only way to restore your wallet. Write it down. Keep it safe." | ||||
type="warning" | type="warning" | ||||
showIcon | showIcon | ||||
/> | /> | ||||
{langCheck && ( | |||||
<Alert | |||||
style={{ marginBottom: '12px' }} | |||||
description="In order to avoid issues with built in browser translation, consider adding English to your browser's list of languages." | |||||
bytesofmanUnsubmitted Not Done Inline ActionsUse this text for the alert description: Please do not translate your seed phrase. Store your seed phrase in English. You must re-enter these exact English words to restore your wallet from seed. bytesofman: Use this text for the alert description:
Please do not translate your seed phrase. Store your… | |||||
type="warning" | |||||
showIcon | |||||
/> | |||||
)} | |||||
{wallet && wallet.mnemonic && ( | {wallet && wallet.mnemonic && ( | ||||
<StyledCollapse> | <StyledCollapse> | ||||
<Panel header="Click to reveal seed phrase" key="1"> | <Panel header="Click to reveal seed phrase" key="1"> | ||||
<p className="notranslate"> | <p className="notranslate"> | ||||
{wallet && wallet.mnemonic ? wallet.mnemonic : ''} | {wallet && wallet.mnemonic ? wallet.mnemonic : ''} | ||||
</p> | </p> | ||||
</Panel> | </Panel> | ||||
</StyledCollapse> | </StyledCollapse> | ||||
▲ Show 20 Lines • Show All 148 Lines • Show Last 20 Lines |
Better variable name. For the way this is being used in the app, a good one would be showTranslationWarning
That way, if showTranslationWarning is false...the translation warning is not shown. Makes sense.