Skip to content

Commit

Permalink
Wallet Creation GUI Fixes
Browse files Browse the repository at this point in the history
  • Loading branch information
@thesolarminer
thesolarminer committed Apr 14, 2021
1 parent 253a94c commit bd91df0
Show file tree
Hide file tree
Showing 3 changed files with 24 additions and 23 deletions.
20 changes: 8 additions & 12 deletions src/presentation/components/login-modal/login-modal.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -41,20 +41,16 @@ export function LoginModal() {
</div>
<div className={style['modal-body']}>
<div className={style['address-content']}>
<p>All data will be encrypted with this password.</p>
<p>Insert your password to decrypt all data stored in the BeeHive Desktop.</p>
<p>Your wallet can only be recovered with your password.</p>
<p>Keep in mind that this password will not be stored on the BeeHive Desktop.</p>
{!loading && (
<React.Fragment>
<div className={style['password-wrapper']}>
<input
className={style.inputPass}
placeholder="Insert your password"
placeholder="Enter your BeeHive password"
onInput={(e) => setLocalPassword(e.target.value)}
type={showPassword ? 'text' : 'password'}
autoFocus
/>
/>


<button
Expand All @@ -64,21 +60,21 @@ export function LoginModal() {
>
{showPassword ? 'Hide' : 'Show'}
</button>

</div>

{decryptError && (
<p className="alert-error">Wallet is not possible decrypt using this password.</p>
<p className="alert-error">Password entered is not correct.</p>
)}

<div className={style.accept}>
<input id="accept" type='checkbox' onChange={(event) => setSavePasswordInContext(event.target.checked)} />
<label htmlFor='accept'>Remember password</label>
<label htmlFor='accept'>Remember password while open.</label>
</div>

<div className={style.buttonArea}>
<button className={style.btnOpen} onClick={handleDecryptWallets}>Open wallet using password above</button>
</div>
<button className={style.btnOpen} onClick={handleDecryptWallets}>Start BeeHive</button>
</div>
</React.Fragment>
)}
{loading && (
Expand Down
19 changes: 12 additions & 7 deletions src/presentation/components/wallet-modal/mnemonic/mnemonic.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ export function Mnemonic({ hide }) {
};
});

generatePDF({ wallets: walletsGenerated, filename: `SmartCash_Address_${Date.now()}`, mnemonic: words, passphrase });
generatePDF({ wallets: walletsGenerated, filename: `BeeHive_USB_Backup_${Date.now()}`, mnemonic: words, passphrase });

walletsGenerated.forEach((wallet) => {
wallet.privateKey = CryptoJS.AES.encrypt(wallet.privateKey, passphrase).toString();
Expand Down Expand Up @@ -68,28 +68,33 @@ export function Mnemonic({ hide }) {
<div>
<div>
<textarea placeholder="BIP39 Mnemonic" value={words} onChange={(event) => setWords(event.target?.value)} />
</div>
<div>
</div><div>
<button className={[style.btn, style.btn_outline].join(' ')} onClick={() => setWords(generatePhrase())}>
Generate
Generate a new random mnemonic phrase
</button>
</div>
<div>{words && !validatePhrase({ words }) && <p>Invalid mnemonic words</p>}</div>
</div>
<div>
<textarea placeholder="Passphrase" onChange={passphraseValidation} />
<br></br>
<textarea placeholder="Enter A Password. This will be used when opening your BeeHive" onChange={passphraseValidation} />
{passphraseError && <p>{passphraseError}</p>}
</div>
<div className={style.accept}>
<input id="accept" type="checkbox" onChange={(event) => setAccept(event.target.checked)} />
<label htmlFor="accept">I confirm that I have stored my mnemonic</label>
<label htmlFor="accept">I confirm that I have stored my mnemonic phrase and password.</label>
</div>
<div className={style.accept}>
<input id="accept" type="checkbox" onChange={(event) => setAccept(event.target.checked)} />
<label htmlFor="accept">The next screen will allow you to save an unencrypted backup file.<br></br>
I understand that this needs to be saved on a USB drive and not on my computer.</label>
</div>
<button
disabled={buttonDisabled()}
className={style.btn}
onClick={() => handleGenerateRandomMnemonic(words, passphrase)}
>
Import
Create Wallet
</button>
</div>
);
Expand Down
8 changes: 4 additions & 4 deletions src/presentation/components/wallet-modal/wallet-modal.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ import style from './wallet-modal.module.css';
import { Mnemonic } from './mnemonic/mnemonic';

export default function WalletModal({ isShowing, hide, disableCloseButton }) {
const [tab, setTab] = useState(0);
const [tab, setTab] = useState(1);
const [createWallet, setCreateWallet] = useState(false);
const [wallet, setWallet] = useState();

Expand All @@ -22,14 +22,14 @@ export default function WalletModal({ isShowing, hide, disableCloseButton }) {

return (
isShowing && (
<Modal title="New Wallet" onClose={handleCloseModal} showCloseButton={disableCloseButton}>
<Modal title="Creating Your BeeHive Desktop Wallet" onClose={handleCloseModal} showCloseButton={disableCloseButton}>
<div className={style['address-content']}>
<div className={style.tabs}>
<button className={tab === 0 ? style.activated : null} onClick={() => handleSetTab(0)}>
Use Private Key
Use A Single Private Key
</button>
<button className={tab === 1 ? style.activated : null} onClick={() => handleSetTab(1)}>
Use Mnemonic
Use Mnemonic Phrase (Recommended)
</button>
</div>

Expand Down

0 comments on commit bd91df0

Please sign in to comment.