Skip to content

feat: import SRP continue button and keyboard changes added #24693

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
ieow merged 3 commits into from
Jan 23, 2026
Merged

feat: import SRP continue button and keyboard changes added #24693

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
45381fe
import SRP continue button and keyboard changes added
grvgoel81 Jan 16, 2026
58f07bf
fix: remove extra error message
grvgoel81 Jan 16, 2026
753ac25
fix: focus issue
grvgoel81 Jan 16, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 6 additions & 0 deletions app/components/UI/SrpInputGrid/SrpInputGrid.types.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,4 +48,10 @@ export interface SrpInputGridProps {
* Callback when the current input word changes
*/
onCurrentWordChange?: (word: string) => void;

/**
* Whether to auto focus the first input on mount
* @default true
*/
autoFocus?: boolean;
}
34 changes: 34 additions & 0 deletions app/components/UI/SrpInputGrid/__snapshots__/index.test.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -93,7 +93,9 @@ exports[`SrpInputGrid renders with custom uniqueId 1`] = `
autoComplete="off"
autoCorrect={false}
autoFocus={false}
blurOnSubmit={false}
editable={true}
enablesReturnKeyAutomatically={false}
importantForAutofill="no"
keyboardType="visible-password"
onBlur={[Function]}
Expand All @@ -104,6 +106,7 @@ exports[`SrpInputGrid renders with custom uniqueId 1`] = `
onSubmitEditing={[Function]}
placeholder=""
placeholderTextColor="#b7bbc8"
returnKeyType="done"
showSoftInputOnFocus={true}
spellCheck={false}
style={
Expand Down Expand Up @@ -187,7 +190,9 @@ exports[`SrpInputGrid renders with custom uniqueId 1`] = `
autoComplete="off"
autoCorrect={false}
autoFocus={true}
blurOnSubmit={false}
editable={true}
enablesReturnKeyAutomatically={false}
importantForAutofill="no"
keyboardType="visible-password"
multiline={true}
Expand All @@ -196,8 +201,10 @@ exports[`SrpInputGrid renders with custom uniqueId 1`] = `
onFocus={[Function]}
onKeyPress={[Function]}
onSelectionChange={[Function]}
onSubmitEditing={[Function]}
placeholder="Enter your Secret Recovery Phrase"
placeholderTextColor="#686e7d"
returnKeyType="done"
showSoftInputOnFocus={true}
spellCheck={false}
style={
Expand Down Expand Up @@ -345,7 +352,9 @@ exports[`SrpInputGrid renders with disabled state 1`] = `
autoComplete="off"
autoCorrect={false}
autoFocus={false}
blurOnSubmit={false}
editable={false}
enablesReturnKeyAutomatically={false}
importantForAutofill="no"
keyboardType="visible-password"
onBlur={[Function]}
Expand All @@ -356,6 +365,7 @@ exports[`SrpInputGrid renders with disabled state 1`] = `
onSubmitEditing={[Function]}
placeholder=""
placeholderTextColor="#b7bbc8"
returnKeyType="done"
showSoftInputOnFocus={true}
spellCheck={false}
style={
Expand Down Expand Up @@ -439,7 +449,9 @@ exports[`SrpInputGrid renders with disabled state 1`] = `
autoComplete="off"
autoCorrect={false}
autoFocus={true}
blurOnSubmit={false}
editable={false}
enablesReturnKeyAutomatically={false}
importantForAutofill="no"
keyboardType="visible-password"
multiline={true}
Expand All @@ -448,8 +460,10 @@ exports[`SrpInputGrid renders with disabled state 1`] = `
onFocus={[Function]}
onKeyPress={[Function]}
onSelectionChange={[Function]}
onSubmitEditing={[Function]}
placeholder="Enter your Secret Recovery Phrase"
placeholderTextColor="#686e7d"
returnKeyType="done"
showSoftInputOnFocus={true}
spellCheck={false}
style={
Expand Down Expand Up @@ -597,7 +611,9 @@ exports[`SrpInputGrid renders with empty seed phrase 1`] = `
autoComplete="off"
autoCorrect={false}
autoFocus={false}
blurOnSubmit={false}
editable={true}
enablesReturnKeyAutomatically={false}
importantForAutofill="no"
keyboardType="visible-password"
onBlur={[Function]}
Expand All @@ -608,6 +624,7 @@ exports[`SrpInputGrid renders with empty seed phrase 1`] = `
onSubmitEditing={[Function]}
placeholder=""
placeholderTextColor="#b7bbc8"
returnKeyType="done"
showSoftInputOnFocus={true}
spellCheck={false}
style={
Expand Down Expand Up @@ -691,7 +708,9 @@ exports[`SrpInputGrid renders with empty seed phrase 1`] = `
autoComplete="off"
autoCorrect={false}
autoFocus={true}
blurOnSubmit={false}
editable={true}
enablesReturnKeyAutomatically={false}
importantForAutofill="no"
keyboardType="visible-password"
multiline={true}
Expand All @@ -700,8 +719,10 @@ exports[`SrpInputGrid renders with empty seed phrase 1`] = `
onFocus={[Function]}
onKeyPress={[Function]}
onSelectionChange={[Function]}
onSubmitEditing={[Function]}
placeholder="Enter your Secret Recovery Phrase"
placeholderTextColor="#686e7d"
returnKeyType="done"
showSoftInputOnFocus={true}
spellCheck={false}
style={
Expand Down Expand Up @@ -884,7 +905,9 @@ exports[`SrpInputGrid renders with multiple words 1`] = `
autoComplete="off"
autoCorrect={false}
autoFocus={false}
blurOnSubmit={false}
editable={true}
enablesReturnKeyAutomatically={false}
importantForAutofill="no"
keyboardType="visible-password"
onBlur={[Function]}
Expand All @@ -895,6 +918,7 @@ exports[`SrpInputGrid renders with multiple words 1`] = `
onSubmitEditing={[Function]}
placeholder=""
placeholderTextColor="#b7bbc8"
returnKeyType="done"
showSoftInputOnFocus={true}
spellCheck={false}
style={
Expand Down Expand Up @@ -1014,7 +1038,9 @@ exports[`SrpInputGrid renders with multiple words 1`] = `
autoComplete="off"
autoCorrect={false}
autoFocus={false}
blurOnSubmit={false}
editable={true}
enablesReturnKeyAutomatically={false}
importantForAutofill="no"
keyboardType="visible-password"
onBlur={[Function]}
Expand All @@ -1025,6 +1051,7 @@ exports[`SrpInputGrid renders with multiple words 1`] = `
onSubmitEditing={[Function]}
placeholder=""
placeholderTextColor="#b7bbc8"
returnKeyType="done"
showSoftInputOnFocus={true}
spellCheck={false}
style={
Expand Down Expand Up @@ -1144,7 +1171,9 @@ exports[`SrpInputGrid renders with multiple words 1`] = `
autoComplete="off"
autoCorrect={false}
autoFocus={false}
blurOnSubmit={false}
editable={true}
enablesReturnKeyAutomatically={false}
importantForAutofill="no"
keyboardType="visible-password"
onBlur={[Function]}
Expand All @@ -1155,6 +1184,7 @@ exports[`SrpInputGrid renders with multiple words 1`] = `
onSubmitEditing={[Function]}
placeholder=""
placeholderTextColor="#b7bbc8"
returnKeyType="done"
showSoftInputOnFocus={true}
spellCheck={false}
style={
Expand Down Expand Up @@ -1239,7 +1269,9 @@ exports[`SrpInputGrid renders with multiple words 1`] = `
autoComplete="off"
autoCorrect={false}
autoFocus={false}
blurOnSubmit={false}
editable={true}
enablesReturnKeyAutomatically={false}
importantForAutofill="no"
keyboardType="visible-password"
multiline={true}
Expand All @@ -1248,8 +1280,10 @@ exports[`SrpInputGrid renders with multiple words 1`] = `
onFocus={[Function]}
onKeyPress={[Function]}
onSelectionChange={[Function]}
onSubmitEditing={[Function]}
placeholder="Enter your Secret Recovery Phrase"
placeholderTextColor="#686e7d"
returnKeyType="done"
showSoftInputOnFocus={true}
spellCheck={false}
style={
Expand Down
2 changes: 1 addition & 1 deletion app/components/UI/SrpInputGrid/index.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -133,7 +133,7 @@ describe('SrpInputGrid', () => {
expect(mockOnSeedPhraseChange).toHaveBeenCalled();
});

it('handles enter key press to move to next input', () => {
it('dismisses keyboard on submit editing', () => {
const seedPhrase = ['wallet', ''];
const { getByTestId } = renderWithProvider(
<SrpInputGrid {...defaultProps} seedPhrase={seedPhrase} />,
Expand Down
29 changes: 14 additions & 15 deletions app/components/UI/SrpInputGrid/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -58,6 +58,7 @@ const SrpInputGrid = React.forwardRef<SrpInputGridRef, SrpInputGridProps>(
uniqueId = uuidv4(),
disabled = false,
onCurrentWordChange,
autoFocus: autoFocusProp = true,
},
ref,
) => {
Expand Down Expand Up @@ -279,16 +280,6 @@ const SrpInputGrid = React.forwardRef<SrpInputGridRef, SrpInputGridProps>(
[seedPhrase, onSeedPhraseChange],
);

const handleEnterKeyPress = useCallback(
(index: number) => {
handleSeedPhraseChangeAtIndexRef.current(
`${seedPhrase[index]}${SPACE_CHAR}`,
index,
);
},
[seedPhrase],
);

// Validate seed phrase and show errors
const error = useMemo(() => {
const hasWordErrors = Object.values(errorWordIndexes).some(Boolean);
Expand Down Expand Up @@ -406,9 +397,7 @@ const SrpInputGrid = React.forwardRef<SrpInputGridRef, SrpInputGridProps>(
? handleSeedPhraseChange(text)
: handleSeedPhraseChangeAtIndex(text, index);
}}
onSubmitEditing={() => {
handleEnterKeyPress(index);
}}
onSubmitEditing={() => Keyboard.dismiss()}
placeholder=""
placeholderTextColor={colors.text.muted}
size={TextFieldSize.Md}
Expand All @@ -433,11 +422,17 @@ const SrpInputGrid = React.forwardRef<SrpInputGridRef, SrpInputGridProps>(
autoCapitalize="none"
testID={`${testIdPrefix}_${index}`}
keyboardType="visible-password"
returnKeyType="done"
blurOnSubmit={false}
enablesReturnKeyAutomatically={false}
autoCorrect={false}
textContentType="none"
spellCheck={false}
importantForAutofill="no"
autoFocus={index === nextSeedPhraseInputFocusedIndex}
autoFocus={
index === nextSeedPhraseInputFocusedIndex &&
(autoFocusProp || index > 0)
}
onKeyPress={(e) => handleKeyPress(e, index)}
isDisabled={disabled}
/>
Expand Down Expand Up @@ -472,11 +467,15 @@ const SrpInputGrid = React.forwardRef<SrpInputGridRef, SrpInputGridProps>(
autoCapitalize="none"
testID={testIdPrefix}
keyboardType="visible-password"
returnKeyType="done"
blurOnSubmit={false}
enablesReturnKeyAutomatically={false}
onSubmitEditing={() => Keyboard.dismiss()}
autoCorrect={false}
textContentType="none"
spellCheck={false}
importantForAutofill="no"
autoFocus={isFirstInput}
autoFocus={autoFocusProp && isFirstInput}
multiline
onKeyPress={(e) => handleKeyPress(e, 0)}
isDisabled={disabled}
Expand Down
Loading
Loading