forked from cerc-io/laconic-wallet
Compare commits
1 Commits
main
...
iv-import-
Author | SHA1 | Date | |
---|---|---|---|
|
899cb90d40 |
@ -1,5 +1,5 @@
|
||||
import { View } from 'react-native';
|
||||
import React from 'react';
|
||||
import { View } from 'react-native';
|
||||
import { Button } from 'react-native-paper';
|
||||
|
||||
import { CreateWalletProps } from '../types';
|
||||
|
60
src/components/ImportWalletDialog.tsx
Normal file
60
src/components/ImportWalletDialog.tsx
Normal file
@ -0,0 +1,60 @@
|
||||
import React, { useState } from 'react';
|
||||
import { View, TextInput } from 'react-native';
|
||||
import { Dialog, Portal, Paragraph, Button } from 'react-native-paper';
|
||||
|
||||
import styles from '../styles/stylesheet';
|
||||
|
||||
const ImportWalletDialog = ({
|
||||
visible,
|
||||
hideDialog,
|
||||
importWalletHandler,
|
||||
}: {
|
||||
visible: boolean;
|
||||
hideDialog: () => void;
|
||||
importWalletHandler: (recoveryPhrase: string) => Promise<void>;
|
||||
}) => {
|
||||
const [words, setWords] = useState<string[]>(Array(12).fill(''));
|
||||
|
||||
const handleWordChange = (index: number, value: string) => {
|
||||
const newWords = [...words];
|
||||
newWords[index] = value;
|
||||
setWords(newWords);
|
||||
};
|
||||
|
||||
return (
|
||||
<Portal>
|
||||
<Dialog visible={visible} onDismiss={hideDialog}>
|
||||
<Dialog.Title>Import your wallet from your mnemonic</Dialog.Title>
|
||||
<Dialog.Content>
|
||||
<Paragraph>
|
||||
(You can paste your entire mnemonic into the first textbox)
|
||||
</Paragraph>
|
||||
<View style={styles.container}>
|
||||
{words.map((word, index) => (
|
||||
<View style={styles.inputContainer} key={index}>
|
||||
<TextInput
|
||||
value={word}
|
||||
onChangeText={text => handleWordChange(index, text)}
|
||||
placeholder={`Word ${index + 1}`}
|
||||
style={styles.textInput}
|
||||
/>
|
||||
</View>
|
||||
))}
|
||||
</View>
|
||||
</Dialog.Content>
|
||||
<Dialog.Actions>
|
||||
<Button
|
||||
mode="contained"
|
||||
onPress={() => importWalletHandler(words.join(' '))}>
|
||||
Import Wallet
|
||||
</Button>
|
||||
<Button mode="text" onPress={hideDialog}>
|
||||
Cancel
|
||||
</Button>
|
||||
</Dialog.Actions>
|
||||
</Dialog>
|
||||
</Portal>
|
||||
);
|
||||
};
|
||||
|
||||
export default ImportWalletDialog;
|
@ -8,7 +8,7 @@ import styles from '../styles/stylesheet';
|
||||
import GridView from './Grid';
|
||||
import { CustomDialogProps } from '../types';
|
||||
|
||||
const DialogComponent = ({
|
||||
const MnemonicDialog = ({
|
||||
visible,
|
||||
hideDialog,
|
||||
contentText,
|
||||
@ -55,4 +55,4 @@ const DialogComponent = ({
|
||||
);
|
||||
};
|
||||
|
||||
export { DialogComponent };
|
||||
export { MnemonicDialog };
|
@ -7,7 +7,8 @@ import { useNavigation } from '@react-navigation/native';
|
||||
import { getSdkError } from '@walletconnect/utils';
|
||||
|
||||
import { createWallet, resetWallet, retrieveAccounts } from '../utils/accounts';
|
||||
import { DialogComponent } from '../components/Dialog';
|
||||
import { MnemonicDialog } from '../components/MnemonicDialog';
|
||||
import ImportWalletDialog from '../components/ImportWalletDialog';
|
||||
import { NetworkDropdown } from '../components/NetworkDropdown';
|
||||
import Accounts from '../components/Accounts';
|
||||
import CreateWallet from '../components/CreateWallet';
|
||||
@ -55,12 +56,13 @@ const HomeScreen = () => {
|
||||
|
||||
const [isWalletCreated, setIsWalletCreated] = useState<boolean>(false);
|
||||
const [isWalletCreating, setIsWalletCreating] = useState<boolean>(false);
|
||||
const [walletDialog, setWalletDialog] = useState<boolean>(false);
|
||||
const [importWalletDialog, setImportWalletDialog] = useState<boolean>(false);
|
||||
const [mnemonicDialog, setMnemonicDialog] = useState<boolean>(false);
|
||||
const [resetWalletDialog, setResetWalletDialog] = useState<boolean>(false);
|
||||
const [isAccountsFetched, setIsAccountsFetched] = useState<boolean>(false);
|
||||
const [phrase, setPhrase] = useState('');
|
||||
|
||||
const hideWalletDialog = () => setWalletDialog(false);
|
||||
const hideMnemonicDialog = () => setMnemonicDialog(false);
|
||||
const hideResetDialog = () => setResetWalletDialog(false);
|
||||
|
||||
const fetchAccounts = useCallback(async () => {
|
||||
@ -83,12 +85,22 @@ const HomeScreen = () => {
|
||||
const mnemonic = await createWallet(networksData);
|
||||
if (mnemonic) {
|
||||
fetchAccounts();
|
||||
setWalletDialog(true);
|
||||
setMnemonicDialog(true);
|
||||
setPhrase(mnemonic);
|
||||
setSelectedNetwork(networksData[0]);
|
||||
}
|
||||
};
|
||||
|
||||
const importWalletHandler = async (recoveryPhrase: string) => {
|
||||
const mnemonic = await createWallet(networksData, recoveryPhrase);
|
||||
if (mnemonic) {
|
||||
fetchAccounts();
|
||||
setPhrase(mnemonic);
|
||||
setSelectedNetwork(networksData[0]);
|
||||
setImportWalletDialog(false);
|
||||
}
|
||||
};
|
||||
|
||||
const confirmResetWallet = useCallback(async () => {
|
||||
setIsWalletCreated(false);
|
||||
setIsWalletCreating(false);
|
||||
@ -152,14 +164,28 @@ const HomeScreen = () => {
|
||||
</View>
|
||||
</>
|
||||
) : (
|
||||
<CreateWallet
|
||||
isWalletCreating={isWalletCreating}
|
||||
createWalletHandler={createWalletHandler}
|
||||
/>
|
||||
<>
|
||||
<CreateWallet
|
||||
isWalletCreating={isWalletCreating}
|
||||
createWalletHandler={createWalletHandler}
|
||||
/>
|
||||
<View style={styles.createWalletContainer}>
|
||||
<Button
|
||||
mode="contained"
|
||||
onPress={() => setImportWalletDialog(true)}>
|
||||
Import Wallet
|
||||
</Button>
|
||||
</View>
|
||||
</>
|
||||
)}
|
||||
<DialogComponent
|
||||
visible={walletDialog}
|
||||
hideDialog={hideWalletDialog}
|
||||
<ImportWalletDialog
|
||||
visible={importWalletDialog}
|
||||
hideDialog={() => setImportWalletDialog(false)}
|
||||
importWalletHandler={importWalletHandler}
|
||||
/>
|
||||
<MnemonicDialog
|
||||
visible={mnemonicDialog}
|
||||
hideDialog={hideMnemonicDialog}
|
||||
contentText={phrase}
|
||||
/>
|
||||
<ConfirmDialog
|
||||
|
@ -117,6 +117,12 @@ const styles = StyleSheet.create({
|
||||
fontSize: 18,
|
||||
padding: 10,
|
||||
},
|
||||
textInput: {
|
||||
height: 40,
|
||||
borderWidth: 1,
|
||||
borderRadius: 4,
|
||||
paddingHorizontal: 10,
|
||||
},
|
||||
requestMessage: {
|
||||
borderWidth: 1,
|
||||
borderRadius: 5,
|
||||
|
@ -27,12 +27,25 @@ import { COSMOS, EIP155 } from './constants';
|
||||
|
||||
const createWallet = async (
|
||||
networksData: NetworksDataState[],
|
||||
recoveryPhrase?: string,
|
||||
): Promise<string> => {
|
||||
const mnemonic = utils.entropyToMnemonic(utils.randomBytes(16));
|
||||
const mnemonic = recoveryPhrase
|
||||
? recoveryPhrase
|
||||
: utils.entropyToMnemonic(utils.randomBytes(16));
|
||||
await setInternetCredentials('mnemonicServer', 'mnemonic', mnemonic);
|
||||
|
||||
const hdNode = HDNode.fromMnemonic(mnemonic);
|
||||
|
||||
await createWalletFromMnemonic(networksData, hdNode, mnemonic);
|
||||
|
||||
return mnemonic;
|
||||
};
|
||||
|
||||
const createWalletFromMnemonic = async (
|
||||
networksData: NetworksDataState[],
|
||||
hdNode: HDNode,
|
||||
mnemonic: string,
|
||||
): Promise<void> => {
|
||||
for (const network of networksData) {
|
||||
const hdPath = `m/44'/${network.coinType}'/0'/0/0`;
|
||||
const node = hdNode.derivePath(hdPath);
|
||||
@ -73,8 +86,6 @@ const createWallet = async (
|
||||
),
|
||||
]);
|
||||
}
|
||||
|
||||
return mnemonic;
|
||||
};
|
||||
|
||||
const addAccount = async (
|
||||
|
Loading…
Reference in New Issue
Block a user