Fix various spacing issues

Signed-off-by: Nikolaos Karaolidis <nick@karaolidis.com>
This commit is contained in:
2023-07-25 22:00:33 +03:00
parent e479e3c0ad
commit caa98736e9
28 changed files with 362 additions and 488 deletions

View File

@@ -13,6 +13,7 @@ import {
import { openDocumentTree } from 'react-native-scoped-storage';
import { useDispatch, useSelector } from 'react-redux';
import type {} from 'redux-thunk/extend-redux';
import { useDeviceOrientation } from '@react-native-community/hooks';
import styles from '../styles';
import {
RootState,
@@ -21,7 +22,6 @@ import {
setNoMedia,
setStorageUri,
} from '../state';
import { ORIENTATION, useDimensions } from '../contexts';
const settingsStyles = StyleSheet.create({
snackbar: {
@@ -34,7 +34,7 @@ const settingsStyles = StyleSheet.create({
const Settings = () => {
const { colors } = useTheme();
const { orientation } = useDimensions();
const orientation = useDeviceOrientation();
const noMedia = useSelector((state: RootState) => state.settings.noMedia);
const masonryColumns = useSelector(
(state: RootState) => state.settings.masonryColumns,
@@ -60,85 +60,80 @@ const Settings = () => {
<>
<ScrollView
contentContainerStyle={[
orientation === ORIENTATION.PORTRAIT
orientation === 'portrait'
? styles.paddingTop
: styles.smallPaddingTop,
styles.paddingHorizontal,
{ backgroundColor: colors.background },
]}>
<View>
<List.Section>
<List.Subheader>Views</List.Subheader>
<Text
style={[
settingsStyles.marginBottom,
styles.smallPaddingHorizontal,
]}>
Masonry Columns
</Text>
<SegmentedButtons
value={masonryColumns.toString()}
<List.Section>
<List.Subheader>Views</List.Subheader>
<Text
style={[
settingsStyles.marginBottom,
styles.smallPaddingHorizontal,
]}>
Masonry Columns
</Text>
<SegmentedButtons
value={masonryColumns.toString()}
onValueChange={value => {
void dispatch(
setMasonryColumns(Number.parseInt(value) as 1 | 2 | 3 | 4),
);
}}
buttons={[
{ label: '1', value: '1' },
{ label: '2', value: '2' },
{ label: '3', value: '3' },
{ label: '4', value: '4' },
]}
style={settingsStyles.marginBottom}
/>
<Text
style={[
settingsStyles.marginBottom,
styles.smallPaddingHorizontal,
]}>
Grid Columns
</Text>
<SegmentedButtons
value={gridColumns.toString()}
onValueChange={value => {
void dispatch(
setGridColumns(Number.parseInt(value) as 1 | 2 | 3 | 4),
);
}}
buttons={[
{ label: '1', value: '1' },
{ label: '2', value: '2' },
{ label: '3', value: '3' },
{ label: '4', value: '4' },
]}
/>
</List.Section>
<List.Section>
<List.Subheader>Media Storage</List.Subheader>
<Button
mode="elevated"
style={settingsStyles.marginBottom}
onPress={async () => {
const { uri } = await openDocumentTree(true);
void dispatch(setStorageUri(uri));
}}>
Change External Storage Path
</Button>
<View
style={[styles.flexRowSpaceBetween, styles.smallPaddingHorizontal]}>
<Text>Hide media from gallery</Text>
<Switch
value={noMedia}
onValueChange={value => {
void dispatch(
setMasonryColumns(Number.parseInt(value) as 1 | 2 | 3 | 4),
);
void dispatch(setNoMedia(value));
}}
buttons={[
{ label: '1', value: '1' },
{ label: '2', value: '2' },
{ label: '3', value: '3' },
{ label: '4', value: '4' },
]}
style={settingsStyles.marginBottom}
/>
<Text
style={[
settingsStyles.marginBottom,
styles.smallPaddingHorizontal,
]}>
Grid Columns
</Text>
<SegmentedButtons
value={gridColumns.toString()}
onValueChange={value => {
void dispatch(
setGridColumns(Number.parseInt(value) as 1 | 2 | 3 | 4),
);
}}
buttons={[
{ label: '1', value: '1' },
{ label: '2', value: '2' },
{ label: '3', value: '3' },
{ label: '4', value: '4' },
]}
/>
</List.Section>
<List.Section>
<List.Subheader>Media Storage</List.Subheader>
<Button
mode="elevated"
style={settingsStyles.marginBottom}
onPress={async () => {
const { uri } = await openDocumentTree(true);
void dispatch(setStorageUri(uri));
}}>
Change External Storage Path
</Button>
<View
style={[
styles.flexRowSpaceBetween,
styles.smallPaddingHorizontal,
]}>
<Text>Hide media from gallery</Text>
<Switch
value={noMedia}
onValueChange={value => {
void dispatch(setNoMedia(value));
}}
/>
</View>
</List.Section>
</View>
</View>
</List.Section>
<List.Section>
<List.Subheader>Database</List.Subheader>
<Button