diff --git a/apps/wallet/src/ui/app/components/accounts/ImportPrivateKeyForm.tsx b/apps/wallet/src/ui/app/components/accounts/ImportPrivateKeyForm.tsx index 9c76b08f7a1..455484086bc 100644 --- a/apps/wallet/src/ui/app/components/accounts/ImportPrivateKeyForm.tsx +++ b/apps/wallet/src/ui/app/components/accounts/ImportPrivateKeyForm.tsx @@ -48,7 +48,12 @@ export function ImportPrivateKeyForm({ onSubmit }: ImportPrivateKeyFormProps) { const isHexadecimal = isValid && !privateKey.startsWith('iotaprivkey'); return (
- + {isHexadecimal ? ( - -
-
diff --git a/apps/wallet/src/ui/app/pages/accounts/ImportPassphrasePage.tsx b/apps/wallet/src/ui/app/pages/accounts/ImportPassphrasePage.tsx index 19d670986b2..cbbf8377457 100644 --- a/apps/wallet/src/ui/app/pages/accounts/ImportPassphrasePage.tsx +++ b/apps/wallet/src/ui/app/pages/accounts/ImportPassphrasePage.tsx @@ -24,6 +24,18 @@ export function ImportPassphrasePage() { setIsTextVisible(!isTextVisible); } + function handleOnSubmit({ recoveryPhrase }: { recoveryPhrase: string[] }) { + setFormValues({ + type: AccountsFormType.ImportMnemonic, + entropy: entropyToSerialized(mnemonicToEntropy(recoveryPhrase.join(' '))), + }); + navigate( + `/accounts/protect-account?${new URLSearchParams({ + accountsFormType: AccountsFormType.ImportMnemonic, + }).toString()}`, + ); + } + const BUTTON_ICON_CLASSES = 'w-5 h-5 text-neutral-10'; return ( @@ -47,19 +59,7 @@ export function ImportPassphrasePage() { cancelButtonText="Back" submitButtonText="Add Profile" isTextVisible={isTextVisible} - onSubmit={({ recoveryPhrase }) => { - setFormValues({ - type: AccountsFormType.ImportMnemonic, - entropy: entropyToSerialized( - mnemonicToEntropy(recoveryPhrase.join(' ')), - ), - }); - navigate( - `/accounts/protect-account?${new URLSearchParams({ - accountsFormType: AccountsFormType.ImportMnemonic, - }).toString()}`, - ); - }} + onSubmit={handleOnSubmit} /> diff --git a/apps/wallet/src/ui/app/pages/accounts/ImportPrivateKeyPage.tsx b/apps/wallet/src/ui/app/pages/accounts/ImportPrivateKeyPage.tsx index eaacdaf54e5..86d9b4ac6c9 100644 --- a/apps/wallet/src/ui/app/pages/accounts/ImportPrivateKeyPage.tsx +++ b/apps/wallet/src/ui/app/pages/accounts/ImportPrivateKeyPage.tsx @@ -15,23 +15,23 @@ export function ImportPrivateKeyPage() { const navigate = useNavigate(); const [, setAccountsFormValues] = useAccountsFormContext(); + function handleOnSubmit({ privateKey }: { privateKey: string }) { + setAccountsFormValues({ + type: AccountsFormType.ImportPrivateKey, + keyPair: privateKey, + }); + navigate( + `/accounts/protect-account?${new URLSearchParams({ + accountsFormType: AccountsFormType.ImportPrivateKey, + }).toString()}`, + ); + } + return (
- { - setAccountsFormValues({ - type: AccountsFormType.ImportPrivateKey, - keyPair: privateKey, - }); - navigate( - `/accounts/protect-account?${new URLSearchParams({ - accountsFormType: AccountsFormType.ImportPrivateKey, - }).toString()}`, - ); - }} - /> +
diff --git a/apps/wallet/src/ui/app/pages/accounts/ImportSeedPage.tsx b/apps/wallet/src/ui/app/pages/accounts/ImportSeedPage.tsx index 3bb12e3270c..a0728863bf4 100644 --- a/apps/wallet/src/ui/app/pages/accounts/ImportSeedPage.tsx +++ b/apps/wallet/src/ui/app/pages/accounts/ImportSeedPage.tsx @@ -1,45 +1,37 @@ // Copyright (c) 2024 IOTA Stiftung // SPDX-License-Identifier: Apache-2.0 -import { Text } from '_app/shared/text'; import { useNavigate } from 'react-router-dom'; - import { AccountsFormType, useAccountsFormContext, } from '../../components/accounts/AccountsFormContext'; import { ImportSeedForm } from '../../components/accounts/ImportSeedForm'; -import { Heading } from '../../shared/heading'; +import { PageTemplate } from '../../components/PageTemplate'; export function ImportSeedPage() { const navigate = useNavigate(); const [, setAccountsFormValues] = useAccountsFormContext(); + function handleOnSubmit({ seed }: { seed: string }) { + setAccountsFormValues({ + type: AccountsFormType.ImportSeed, + seed, + }); + navigate( + `/accounts/protect-account?${new URLSearchParams({ + accountsFormType: AccountsFormType.ImportSeed, + }).toString()}`, + ); + } + return ( -
- - Wallet Setup - -
- - Import Seed - -
-
- { - setAccountsFormValues({ - type: AccountsFormType.ImportSeed, - seed, - }); - navigate( - `/accounts/protect-account?${new URLSearchParams({ - accountsFormType: AccountsFormType.ImportSeed, - }).toString()}`, - ); - }} - /> + +
+
+ +
-
+ ); } diff --git a/apps/wallet/src/ui/app/shared/forms/FormField.tsx b/apps/wallet/src/ui/app/shared/forms/FormField.tsx index 60bee54174d..a979a7fbee0 100644 --- a/apps/wallet/src/ui/app/shared/forms/FormField.tsx +++ b/apps/wallet/src/ui/app/shared/forms/FormField.tsx @@ -3,11 +3,7 @@ // SPDX-License-Identifier: Apache-2.0 import { type ReactNode } from 'react'; -import { useFormContext } from 'react-hook-form'; - import { FormLabel } from './FormLabel'; -import { InfoBox, InfoBoxStyle, InfoBoxType } from '@iota/apps-ui-kit'; -import { Exclamation } from '@iota/ui-icons'; interface FormFieldProps { name: string; @@ -15,21 +11,10 @@ interface FormFieldProps { children: ReactNode; } -export function FormField({ children, name, label }: FormFieldProps) { - const { getFieldState, formState } = useFormContext(); - const state = getFieldState(name, formState); - +export function FormField({ children, label }: FormFieldProps) { return (
{label ? {children} : children} - {state.error && ( - } - style={InfoBoxStyle.Elevated} - /> - )}
); } diff --git a/apps/wallet/src/ui/app/shared/forms/TextAreaField.tsx b/apps/wallet/src/ui/app/shared/forms/TextAreaField.tsx index 0cd70a24700..a6a15be1035 100644 --- a/apps/wallet/src/ui/app/shared/forms/TextAreaField.tsx +++ b/apps/wallet/src/ui/app/shared/forms/TextAreaField.tsx @@ -4,8 +4,8 @@ import { forwardRef, type ComponentProps, type ReactNode } from 'react'; -import { TextArea } from '@iota/apps-ui-kit'; import FormField from './FormField'; +import { TextArea } from '@iota/apps-ui-kit'; type TextAreaFieldProps = { name: string;