self-hosted/joplin
1
0
Fork 0
mirror of https://github.com/laurent22/joplin.git synced 2025-11-26 22:41:17 +02:00
Code Issues Releases Activity

Mobile: Improve tag screen usability to allow add or remove tag with a single press, when the keyboard is open (#12954)

Browse Source
This commit is contained in:
mrjo118
2025-08-20 07:33:31 +01:00
committed by GitHub
parent 0f13bf9d51
commit a414241541
3 changed files with 9 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
packages/app-mobile/components/ComboBox.tsx
View File

@@ -540,6 +540,7 @@ const ComboBox: React.FC<Props> = ({
}; };
const activeId = `${baseId}-${selectedIndex}`; const activeId = `${baseId}-${selectedIndex}`;
const searchResults = <NestableFlatList const searchResults = <NestableFlatList
keyboardShouldPersistTaps="handled"
ref={listRef} ref={listRef}
data={results} data={results}
{...searchResultProps} {...searchResultProps}

14
packages/app-mobile/components/SearchInput.tsx
View File

@@ -1,11 +1,10 @@
import * as React from 'react'; import * as React from 'react';
import TextInput from './TextInput'; import TextInput from './TextInput';
import { View, StyleSheet, TextInputProps, ViewStyle, TextInput as ReactNativeTextInput } from 'react-native'; import { View, StyleSheet, TextInputProps, ViewStyle, TextInput as ReactNativeTextInput, Keyboard } from 'react-native';
import { _ } from '@joplin/lib/locale'; import { _ } from '@joplin/lib/locale';
import { Ref, useCallback, useMemo } from 'react'; import { Ref, useCallback, useMemo } from 'react';
import { themeStyle } from './global-style'; import { themeStyle } from './global-style';
import IconButton from './IconButton'; import IconButton from './IconButton';
import Icon from './Icon';
interface SearchInputProps extends TextInputProps { interface SearchInputProps extends TextInputProps {
@@ -58,11 +57,12 @@ const SearchInput: React.FC<SearchInputProps> = ({ inputRef, themeId, value, con
}, [onChangeText]); }, [onChangeText]);
return <View style={[styles.root, containerStyle]}> return <View style={[styles.root, containerStyle]}>
<Icon <IconButton
aria-hidden={true} iconName='material magnify'
name='material magnify' onPress={() => Keyboard.dismiss()}
accessibilityLabel={null} description={_('Hide keyboard')}
style={styles.icon} iconStyle={styles.icon}
themeId={themeId}
/> />
<TextInput <TextInput
ref={inputRef} ref={inputRef}

1
packages/app-mobile/components/TagEditor.tsx
View File

@@ -171,6 +171,7 @@ const TagsBox: React.FC<TagsBoxProps> = props => {
return <View style={props.styles.tagBoxRoot}> return <View style={props.styles.tagBoxRoot}>
<Text style={props.styles.header} role='heading'>{_('Associated tags:')}</Text> <Text style={props.styles.header} role='heading'>{_('Associated tags:')}</Text>
<ScrollView <ScrollView
keyboardShouldPersistTaps="handled"
style={props.styles.tagBoxScrollView} style={props.styles.tagBoxScrollView}
// On web, specifying aria-live here announces changes to the associated tags. // On web, specifying aria-live here announces changes to the associated tags.
// However, on Android (and possibly iOS), this breaks focus behavior: // However, on Android (and possibly iOS), this breaks focus behavior: