self-hosted/joplin
1
0
Fork 0
mirror of https://github.com/laurent22/joplin.git synced 2024-12-21 09:38:01 +02:00
Code Issues Releases Activity

Mobile: Fixes #11130: Fix regression: Search screen not hidden when cached for search result navigation (#11131)

Browse Source
This commit is contained in:
Henry Heino 2024-09-27 07:23:31 -07:00 committed by GitHub
parent 5935c9c147
commit 42ab9ecd95
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 15 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
packages/app-mobile/components/global-style.ts
View File

@ -30,6 +30,7 @@ export type ThemeStyle = BaseTheme & typeof baseStyle & {
headerStyle: TextStyle; headerStyle: TextStyle;
headerWrapperStyle: ViewStyle; headerWrapperStyle: ViewStyle;
rootStyle: ViewStyle; rootStyle: ViewStyle;
hiddenRootStyle: ViewStyle;
keyboardAppearance: 'light'|'dark'; keyboardAppearance: 'light'|'dark';
}; };
@ -87,6 +88,11 @@ function extraStyles(theme: BaseTheme) {
backgroundColor: theme.backgroundColor, backgroundColor: theme.backgroundColor,
}; };
const hiddenRootStyle: ViewStyle = {
...rootStyle,
flex: 0.001, // This is a bit of a hack but it seems to work fine - it makes the component invisible but without unmounting it
};
return { return {
marginRight: baseStyle.margin, marginRight: baseStyle.margin,
marginLeft: baseStyle.margin, marginLeft: baseStyle.margin,
@ -101,6 +107,7 @@ function extraStyles(theme: BaseTheme) {
headerStyle, headerStyle,
headerWrapperStyle, headerWrapperStyle,
rootStyle, rootStyle,
hiddenRootStyle,
keyboardAppearance: theme.appearance, keyboardAppearance: theme.appearance,
color5: theme.color5 ?? theme.backgroundColor4, color5: theme.color5 ?? theme.backgroundColor4,

9
packages/app-mobile/components/screens/Notes.tsx
View File

@ -234,14 +234,7 @@ class NotesScreenComponent extends BaseScreenComponent<Props, State> {
const parent = this.parentItem(); const parent = this.parentItem();
const theme = themeStyle(this.props.themeId); const theme = themeStyle(this.props.themeId);
const rootStyle = { const rootStyle = this.props.visible ? theme.rootStyle : theme.hiddenRootStyle;
flex: 1,
backgroundColor: theme.backgroundColor,
};
if (!this.props.visible) {
rootStyle.flex = 0.001; // This is a bit of a hack but it seems to work fine - it makes the component invisible but without unmounting it
}
const title = parent ? parent.title : null; const title = parent ? parent.title : null;
if (!parent) { if (!parent) {

12
packages/app-mobile/components/screens/SearchScreen/index.tsx
View File

@ -10,6 +10,7 @@ import { Dispatch } from 'redux';
import { useCallback, useEffect, useMemo, useRef, useState } from 'react'; import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
import IconButton from '../../IconButton'; import IconButton from '../../IconButton';
import SearchResults from './SearchResults'; import SearchResults from './SearchResults';
import AccessibleView from '../../accessibility/AccessibleView';
interface Props { interface Props {
themeId: number; themeId: number;
@ -21,7 +22,7 @@ interface Props {
ftsEnabled: number; ftsEnabled: number;
} }
const useStyles = (theme: ThemeStyle) => { const useStyles = (theme: ThemeStyle, visible: boolean) => {
return useMemo(() => { return useMemo(() => {
return StyleSheet.create({ return StyleSheet.create({
body: { body: {
@ -46,13 +47,14 @@ const useStyles = (theme: ThemeStyle) => {
paddingRight: theme.marginRight, paddingRight: theme.marginRight,
backgroundColor: theme.backgroundColor, backgroundColor: theme.backgroundColor,
}, },
rootStyle: visible ? theme.rootStyle : theme.hiddenRootStyle,
}); });
}, [theme]); }, [theme, visible]);
}; };
const SearchScreenComponent: React.FC<Props> = props => { const SearchScreenComponent: React.FC<Props> = props => {
const theme = themeStyle(props.themeId); const theme = themeStyle(props.themeId);
const styles = useStyles(theme); const styles = useStyles(theme, props.visible);
const [query, setQuery] = useState(props.query); const [query, setQuery] = useState(props.query);
@ -79,7 +81,7 @@ const SearchScreenComponent: React.FC<Props> = props => {
}, [props.dispatch]); }, [props.dispatch]);
return ( return (
<View style={theme.rootStyle}> <AccessibleView style={styles.rootStyle} inert={!props.visible}>
<ScreenHeader <ScreenHeader
title={_('Search')} title={_('Search')}
folderPickerOptions={{ folderPickerOptions={{
@ -115,7 +117,7 @@ const SearchScreenComponent: React.FC<Props> = props => {
onHighlightedWordsChange={onHighlightedWordsChange} onHighlightedWordsChange={onHighlightedWordsChange}
/> />
</View> </View>
</View> </AccessibleView>
); );
}; };