diff --git a/nym-wallet/src/index.tsx b/nym-wallet/src/index.tsx
index 3cd6c03462..61daf238c0 100644
--- a/nym-wallet/src/index.tsx
+++ b/nym-wallet/src/index.tsx
@@ -10,6 +10,7 @@ import { Admin, Welcome, Settings } from './pages';
import { ErrorFallback } from './components';
import { NymWalletTheme, WelcomeTheme } from './theme';
import { maximizeWindow } from './utils';
+import { SignInProvider } from './pages/welcome/context';
const App = () => {
const { clientDetails } = useContext(ClientContext);
@@ -20,7 +21,9 @@ const App = () => {
return !clientDetails ? (
-
+
+
+
) : (
diff --git a/nym-wallet/src/pages/welcome/context/index.tsx b/nym-wallet/src/pages/welcome/context/index.tsx
new file mode 100644
index 0000000000..3e868a93f8
--- /dev/null
+++ b/nym-wallet/src/pages/welcome/context/index.tsx
@@ -0,0 +1,72 @@
+import React, { createContext, useEffect, useMemo, useState } from 'react';
+import { createMnemonic, signInWithMnemonic } from 'src/requests';
+import { TMnemonicWords } from '../types';
+
+export const SignInContext = createContext({} as TSignInContent);
+
+export type TSignInContent = {
+ error?: string;
+ password: string;
+ mnemonic: string;
+ mnemonicWords: TMnemonicWords;
+ setError: (err?: string) => void;
+ setMnemonic: (mnc: string) => void;
+ generateMnemonic: () => Promise;
+ validateMnemonic: () => Promise;
+ setPassword: (paswd: string) => void;
+};
+
+const mnemonicToArray = (mnemonic: string): TMnemonicWords =>
+ mnemonic
+ .split(' ')
+ .reduce((a, c: string, index) => [...a, { name: c, index: index + 1, disabled: false }], [] as TMnemonicWords);
+
+export const SignInProvider: React.FC = ({ children }) => {
+ const [password, setPassword] = useState('');
+ const [mnemonic, setMnemonic] = useState('');
+ const [mnemonicWords, setMnemonicWords] = useState([]);
+ const [error, setError] = useState();
+
+ const generateMnemonic = async () => {
+ const mnemonicPhrase = await createMnemonic();
+ setMnemonic(mnemonicPhrase);
+ };
+
+ const validateMnemonic = async () => {
+ try {
+ await signInWithMnemonic(mnemonic);
+ } catch (e) {
+ setError(e as string);
+ }
+ };
+
+ useEffect(() => {
+ if (mnemonic.length > 0) {
+ const mnemonicArray = mnemonicToArray(mnemonic);
+ setMnemonicWords(mnemonicArray);
+ } else {
+ setMnemonicWords([]);
+ }
+ }, [mnemonic]);
+
+ return (
+ ({
+ error,
+ password,
+ mnemonic,
+ mnemonicWords,
+ setError,
+ setMnemonic,
+ generateMnemonic,
+ validateMnemonic,
+ setPassword,
+ }),
+ [error, password, mnemonic, mnemonicWords],
+ )}
+ >
+ {children}
+
+ );
+};