Differential D19604 Diff 58919 cashtab/src/components/OnBoarding/index.tsx

Changeset View

Standalone View

cashtab/src/components/OnBoarding/index.tsx

// Copyright (c) 2024 The Bitcoin developers		// Copyright (c) 2024 The Bitcoin developers
// Distributed under the MIT software license, see the accompanying		// Distributed under the MIT software license, see the accompanying
// file COPYING or http://www.opensource.org/licenses/mit-license.php.		// file COPYING or http://www.opensource.org/licenses/mit-license.php.

import React, { useState } from 'react';		import React, { useState } from 'react';
import { WalletContext } from 'wallet/context';		import { WalletContext } from 'wallet/context';
import PrimaryButton, { SecondaryButton } from 'components/Common/Buttons';		import PrimaryButton, { SecondaryButton } from 'components/Common/Buttons';
import { Event } from 'components/Common/GoogleAnalytics';		import { Event } from 'components/Common/GoogleAnalytics';
import { validateMnemonic } from 'validation';		import { validateMnemonic } from 'validation';
import appConfig from 'config/app';		import appConfig from 'config/app';
import { createCashtabWallet, generateMnemonic } from 'wallet';		import { createCashtabWallet, generateMnemonic } from 'wallet';
import { WelcomeCtn, WelcomeLink, WelcomeText } from './styles';		import { WelcomeCtn, WelcomeLink, WelcomeText } from './styles';
import Modal from 'components/Common/Modal';		import Modal from 'components/Common/Modal';
import { ModalTextArea } from 'components/Common/Inputs';		import { ModalTextArea } from 'components/Common/Inputs';
		import CashtabLogo from 'assets/cashtab_xec.png';

const OnBoarding = () => {		const OnBoarding = () => {
const ContextValue = React.useContext(WalletContext);		const ContextValue = React.useContext(WalletContext);
const { updateCashtabState } = ContextValue;		const { updateCashtabState } = ContextValue;

const [importedMnemonic, setImportedMnemonic] = useState<string>('');		const [importedMnemonic, setImportedMnemonic] = useState<string>('');
const [showImportWalletModal, setShowImportWalletModal] =		const [showImportWalletModal, setShowImportWalletModal] =
useState<boolean>(false);		useState<boolean>(false);
▲ Show 20 Lines • Show All 82 Lines • ▼ Show 20 Lines	return (
spellCheck={false}		spellCheck={false}
autoCorrect="off"		autoCorrect="off"
autoCapitalize="off"		autoCapitalize="off"
/>		/>
</Modal>		</Modal>
)}		)}

<WelcomeCtn>		<WelcomeCtn>
<h2>Welcome to Cashtab!</h2>		<img src={CashtabLogo} alt="cashtab" />
		<div>
<WelcomeText>		<WelcomeText>
Cashtab is an{' '}		Welcome to Cashtab! The{' '}
<WelcomeLink		<WelcomeLink
href="https://github.com/bitcoin-abc/bitcoin-abc"		href="https://github.com/bitcoin-abc/bitcoin-abc"
target="_blank"		target="_blank"
rel="noreferrer"		rel="noreferrer"
>		>
open source,		open source,
</WelcomeLink>{' '}		</WelcomeLink>{' '}
non-custodial web wallet for {appConfig.name}.		non-custodial web wallet for {appConfig.name}.
</WelcomeText>		</WelcomeText>

<PrimaryButton onClick={() => createNewWallet()}>		<PrimaryButton onClick={() => createNewWallet()}>
New Wallet		New Wallet
</PrimaryButton>		</PrimaryButton>

<SecondaryButton onClick={() => setShowImportWalletModal(true)}>		<SecondaryButton
		type="button"
		onClick={() => setShowImportWalletModal(true)}
		>
Import Wallet		Import Wallet
</SecondaryButton>		</SecondaryButton>
		</div>
</WelcomeCtn>		</WelcomeCtn>
</>		</>
);		);
};		};

export default OnBoarding;		export default OnBoarding;