Revert "Add custom app bar"

This reverts commit a664b65ce2.
This commit is contained in:
Brandon Presley 2022-10-23 12:32:44 +13:00
parent 2d9e561908
commit e84dd7bdea
8 changed files with 143 additions and 177 deletions

View File

@ -10,7 +10,7 @@ import {
DefaultTheme as PaperDefaultTheme, DefaultTheme as PaperDefaultTheme,
Provider, Provider,
} from 'react-native-paper'; } from 'react-native-paper';
import MaterialIcon from 'react-native-vector-icons/MaterialIcons'; import Ionicon from 'react-native-vector-icons/MaterialIcons';
import {Color} from './color'; import {Color} from './color';
import {lightColors} from './colors'; import {lightColors} from './colors';
import {runMigrations} from './db'; import {runMigrations} from './db';
@ -77,7 +77,7 @@ const App = () => {
<Color.Provider value={{color, setColor}}> <Color.Provider value={{color, setColor}}>
<Provider <Provider
theme={theme} theme={theme}
settings={{icon: props => <MaterialIcon {...props} />}}> settings={{icon: props => <Ionicon {...props} />}}>
<NavigationContainer theme={theme}> <NavigationContainer theme={theme}>
<MassiveSnack> <MassiveSnack>
{settings && ( {settings && (

View File

@ -8,7 +8,6 @@ import {FlatList, Image} from 'react-native';
import {List} from 'react-native-paper'; import {List} from 'react-native-paper';
import {getBestReps, getBestWeights} from './best.service'; import {getBestReps, getBestWeights} from './best.service';
import {BestPageParams} from './BestPage'; import {BestPageParams} from './BestPage';
import Header from './Header';
import Page from './Page'; import Page from './Page';
import Set from './set'; import Set from './set';
import {useSettings} from './use-settings'; import {useSettings} from './use-settings';
@ -59,18 +58,15 @@ export default function BestList() {
); );
return ( return (
<> <Page search={search} setSearch={setSearch}>
<Header name="Best" /> {bests?.length === 0 ? (
<Page search={search} setSearch={setSearch}> <List.Item
{bests?.length === 0 ? ( title="No exercises yet"
<List.Item description="Once sets have been added, this will highlight your personal bests."
title="No exercises yet" />
description="Once sets have been added, this will highlight your personal bests." ) : (
/> <FlatList style={{flex: 1}} renderItem={renderItem} data={bests} />
) : ( )}
<FlatList style={{flex: 1}} renderItem={renderItem} data={bests} /> </Page>
)}
</Page>
</>
); );
} }

View File

@ -1,17 +0,0 @@
import {useNavigation} from '@react-navigation/native';
import React from 'react';
import {Appbar, IconButton} from 'react-native-paper';
import {DrawerParamList} from './drawer-param-list';
import DrawerMenu from './DrawerMenu';
export default function Header({name}: {name: keyof DrawerParamList}) {
const navigation = useNavigation();
return (
<Appbar.Header>
<IconButton icon="menu" onPress={(navigation as any).openDrawer} />
<Appbar.Content title={name} />
<DrawerMenu name={name} />
</Appbar.Header>
);
}

View File

@ -7,7 +7,6 @@ import React, {useCallback, useEffect, useState} from 'react';
import {FlatList} from 'react-native'; import {FlatList} from 'react-native';
import {List} from 'react-native-paper'; import {List} from 'react-native-paper';
import DrawerMenu from './DrawerMenu'; import DrawerMenu from './DrawerMenu';
import Header from './Header';
import Page from './Page'; import Page from './Page';
import {Plan} from './plan'; import {Plan} from './plan';
import {PlanPageParams} from './plan-page-params'; import {PlanPageParams} from './plan-page-params';
@ -47,23 +46,20 @@ export default function PlanList() {
navigation.navigate('EditPlan', {plan: {days: '', workouts: ''}}); navigation.navigate('EditPlan', {plan: {days: '', workouts: ''}});
return ( return (
<> <Page onAdd={onAdd} search={search} setSearch={setSearch}>
<Header name="Plans" /> {plans?.length === 0 ? (
<Page onAdd={onAdd} search={search} setSearch={setSearch}> <List.Item
{plans?.length === 0 ? ( title="No plans yet"
<List.Item description="A plan is a list of workouts for certain days."
title="No plans yet" />
description="A plan is a list of workouts for certain days." ) : (
/> <FlatList
) : ( style={{flex: 1}}
<FlatList data={plans}
style={{flex: 1}} renderItem={renderItem}
data={plans} keyExtractor={set => set.id?.toString() || ''}
renderItem={renderItem} />
keyExtractor={set => set.id?.toString() || ''} )}
/> </Page>
)}
</Page>
</>
); );
} }

View File

@ -28,7 +28,6 @@ export default function Routes() {
screenOptions={{ screenOptions={{
headerTintColor: dark ? 'white' : 'black', headerTintColor: dark ? 'white' : 'black',
swipeEdgeWidth: 1000, swipeEdgeWidth: 1000,
headerShown: false,
}}> }}>
{routes.map(route => ( {routes.map(route => (
<Drawer.Screen <Drawer.Screen

View File

@ -6,7 +6,7 @@ import {
import React, {useCallback, useEffect, useState} from 'react'; import React, {useCallback, useEffect, useState} from 'react';
import {FlatList} from 'react-native'; import {FlatList} from 'react-native';
import {List} from 'react-native-paper'; import {List} from 'react-native-paper';
import Header from './Header'; import DrawerMenu from './DrawerMenu';
import {HomePageParams} from './home-page-params'; import {HomePageParams} from './home-page-params';
import Page from './Page'; import Page from './Page';
import Set from './set'; import Set from './set';
@ -44,7 +44,10 @@ export default function SetList() {
useFocusEffect( useFocusEffect(
useCallback(() => { useCallback(() => {
refresh(); refresh();
}, [refresh]), navigation.getParent()?.setOptions({
headerRight: () => <DrawerMenu name="Home" />,
});
}, [refresh, navigation]),
); );
useEffect(() => { useEffect(() => {
@ -83,24 +86,21 @@ export default function SetList() {
}, [navigation, set]); }, [navigation, set]);
return ( return (
<> <Page onAdd={onAdd} search={search} setSearch={setSearch}>
<Header name="Home" /> {sets?.length === 0 ? (
<Page onAdd={onAdd} search={search} setSearch={setSearch}> <List.Item
{sets?.length === 0 ? ( title="No sets yet"
<List.Item description="A set is a group of repetitions. E.g. 8 reps of Squats."
title="No sets yet" />
description="A set is a group of repetitions. E.g. 8 reps of Squats." ) : (
/> <FlatList
) : ( data={sets}
<FlatList style={{flex: 1}}
data={sets} renderItem={renderItem}
style={{flex: 1}} keyExtractor={s => s.id!.toString()}
renderItem={renderItem} onEndReached={next}
keyExtractor={s => s.id!.toString()} />
onEndReached={next} )}
/> </Page>
)}
</Page>
</>
); );
} }

View File

@ -8,7 +8,6 @@ import {useColor} from './color';
import {darkColors, lightColors} from './colors'; import {darkColors, lightColors} from './colors';
import ConfirmDialog from './ConfirmDialog'; import ConfirmDialog from './ConfirmDialog';
import {MARGIN} from './constants'; import {MARGIN} from './constants';
import Header from './Header';
import Input from './input'; import Input from './input';
import {useSnackbar} from './MassiveSnack'; import {useSnackbar} from './MassiveSnack';
import Page from './Page'; import Page from './Page';
@ -167,88 +166,85 @@ export default function SettingsPage() {
); );
return ( return (
<> <Page search={search} setSearch={setSearch}>
<Header name="Settings" /> <ScrollView style={{marginTop: MARGIN}}>
<Page search={search} setSearch={setSearch}> {switches
<ScrollView style={{marginTop: MARGIN}}> .filter(input =>
{switches input.name.toLowerCase().includes(search.toLowerCase()),
.filter(input => )
input.name.toLowerCase().includes(search.toLowerCase()), .map(input => (
) <Switch
.map(input => ( onPress={() => input.onChange(!input.value)}
<Switch key={input.name}
onPress={() => input.onChange(!input.value)} value={input.value}
key={input.name} onValueChange={input.onChange}>
value={input.value} {input.name}
onValueChange={input.onChange}> </Switch>
{input.name} ))}
</Switch> {'theme'.includes(search.toLowerCase()) && (
<Picker
style={{color}}
dropdownIconColor={color}
selectedValue={theme}
onValueChange={changeTheme}>
<Picker.Item value="system" label="Follow system theme" />
<Picker.Item value="dark" label="Dark theme" />
<Picker.Item value="light" label="Light theme" />
</Picker>
)}
{'color'.includes(search.toLowerCase()) && (
<Picker
style={{color, marginTop: -10}}
dropdownIconColor={color}
selectedValue={color}
onValueChange={value => setColor(value)}>
{lightColors.concat(darkColors).map(colorOption => (
<Picker.Item
key={colorOption.hex}
value={colorOption.hex}
label="Primary color"
color={colorOption.hex}
/>
))} ))}
{'theme'.includes(search.toLowerCase()) && ( </Picker>
<Picker )}
style={{color}} {'date format'.includes(search.toLowerCase()) && (
dropdownIconColor={color} <Picker
selectedValue={theme} style={{color, marginTop: -10}}
onValueChange={changeTheme}> dropdownIconColor={color}
<Picker.Item value="system" label="Follow system theme" /> selectedValue={settings.date}
<Picker.Item value="dark" label="Dark theme" /> onValueChange={changeDate}>
<Picker.Item value="light" label="Light theme" /> <Picker.Item
</Picker> value="%Y-%m-%d %H:%M"
)} label="Format date as 1990-12-24 15:05"
{'color'.includes(search.toLowerCase()) && ( />
<Picker <Picker.Item
style={{color, marginTop: -10}} value="%Y-%m-%d"
dropdownIconColor={color} label="Format date as 1990-12-24 (YYYY-MM-dd)"
selectedValue={color} />
onValueChange={value => setColor(value)}> <Picker.Item value="%d/%m" label="Format date as 24/12 (dd/MM)" />
{lightColors.concat(darkColors).map(colorOption => ( <Picker.Item value="%H:%M" label="Format date as 15:05 (HH:MM)" />
<Picker.Item </Picker>
key={colorOption.hex} )}
value={colorOption.hex} {'alarm sound'.includes(search.toLowerCase()) && (
label="Primary color" <Button style={{alignSelf: 'flex-start'}} onPress={changeSound}>
color={colorOption.hex} Alarm sound
/> {sound
))} ? ': ' + sound.split('/')[sound.split('/').length - 1]
</Picker> : null}
)} </Button>
{'date format'.includes(search.toLowerCase()) && ( )}
<Picker </ScrollView>
style={{color, marginTop: -10}} <ConfirmDialog
dropdownIconColor={color} title="Battery optimizations"
selectedValue={settings.date} show={battery}
onValueChange={changeDate}> setShow={setBattery}
<Picker.Item onOk={() => {
value="%Y-%m-%d %H:%M" NativeModules.AlarmModule.ignoreBattery();
label="Format date as 1990-12-24 15:05" setBattery(false);
/> }}>
<Picker.Item Disable battery optimizations for Massive to use rest timers.
value="%Y-%m-%d" </ConfirmDialog>
label="Format date as 1990-12-24 (YYYY-MM-dd)" </Page>
/>
<Picker.Item value="%d/%m" label="Format date as 24/12 (dd/MM)" />
<Picker.Item value="%H:%M" label="Format date as 15:05 (HH:MM)" />
</Picker>
)}
{'alarm sound'.includes(search.toLowerCase()) && (
<Button style={{alignSelf: 'flex-start'}} onPress={changeSound}>
Alarm sound
{sound
? ': ' + sound.split('/')[sound.split('/').length - 1]
: null}
</Button>
)}
</ScrollView>
<ConfirmDialog
title="Battery optimizations"
show={battery}
setShow={setBattery}
onOk={() => {
NativeModules.AlarmModule.ignoreBattery();
setBattery(false);
}}>
Disable battery optimizations for Massive to use rest timers.
</ConfirmDialog>
</Page>
</>
); );
} }

View File

@ -6,7 +6,6 @@ import {
import React, {useCallback, useEffect, useState} from 'react'; import React, {useCallback, useEffect, useState} from 'react';
import {FlatList} from 'react-native'; import {FlatList} from 'react-native';
import {List} from 'react-native-paper'; import {List} from 'react-native-paper';
import Header from './Header';
import Page from './Page'; import Page from './Page';
import Set from './set'; import Set from './set';
import {getDistinctSets} from './set.service'; import {getDistinctSets} from './set.service';
@ -80,24 +79,21 @@ export default function WorkoutList() {
}, [navigation]); }, [navigation]);
return ( return (
<> <Page onAdd={onAdd} search={search} setSearch={setSearch}>
<Header name="Workouts" /> {workouts?.length === 0 ? (
<Page onAdd={onAdd} search={search} setSearch={setSearch}> <List.Item
{workouts?.length === 0 ? ( title="No workouts yet."
<List.Item description="A workout is something you do at the gym. For example Deadlifts are a workout."
title="No workouts yet." />
description="A workout is something you do at the gym. For example Deadlifts are a workout." ) : (
/> <FlatList
) : ( data={workouts}
<FlatList style={{flex: 1}}
data={workouts} renderItem={renderItem}
style={{flex: 1}} keyExtractor={w => w.name}
renderItem={renderItem} onEndReached={next}
keyExtractor={w => w.name} />
onEndReached={next} )}
/> </Page>
)}
</Page>
</>
); );
} }