Revert "Add custom app bar"

This reverts commit a664b65ce2.

App.tsx

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

BestList.tsx

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

Header.tsx

@@ -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>
-  );
-}

PlanList.tsx

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

Routes.tsx

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

SetList.tsx

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

SettingsPage.tsx

@@ -8,7 +8,6 @@ import {useColor} from './color';
 import {darkColors, lightColors} from './colors';
 import ConfirmDialog from './ConfirmDialog';
 import {MARGIN} from './constants';
-import Header from './Header';
 import Input from './input';
 import {useSnackbar} from './MassiveSnack';
 import Page from './Page';
@@ -167,88 +166,85 @@ export default function SettingsPage() {
   );
 
   return (
-    <>
-      <Header name="Settings" />
-      <Page search={search} setSearch={setSearch}>
-        <ScrollView style={{marginTop: MARGIN}}>
-          {switches
-            .filter(input =>
-              input.name.toLowerCase().includes(search.toLowerCase()),
-            )
-            .map(input => (
-              <Switch
-                onPress={() => input.onChange(!input.value)}
-                key={input.name}
-                value={input.value}
-                onValueChange={input.onChange}>
-                {input.name}
-              </Switch>
+    <Page search={search} setSearch={setSearch}>
+      <ScrollView style={{marginTop: MARGIN}}>
+        {switches
+          .filter(input =>
+            input.name.toLowerCase().includes(search.toLowerCase()),
+          )
+          .map(input => (
+            <Switch
+              onPress={() => input.onChange(!input.value)}
+              key={input.name}
+              value={input.value}
+              onValueChange={input.onChange}>
+              {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
-              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}
-                />
-              ))}
-            </Picker>
-          )}
-          {'date format'.includes(search.toLowerCase()) && (
-            <Picker
-              style={{color, marginTop: -10}}
-              dropdownIconColor={color}
-              selectedValue={settings.date}
-              onValueChange={changeDate}>
-              <Picker.Item
-                value="%Y-%m-%d %H:%M"
-                label="Format date as 1990-12-24 15:05"
-              />
-              <Picker.Item
-                value="%Y-%m-%d"
-                label="Format date as 1990-12-24 (YYYY-MM-dd)"
-              />
-              <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>
-    </>
+          </Picker>
+        )}
+        {'date format'.includes(search.toLowerCase()) && (
+          <Picker
+            style={{color, marginTop: -10}}
+            dropdownIconColor={color}
+            selectedValue={settings.date}
+            onValueChange={changeDate}>
+            <Picker.Item
+              value="%Y-%m-%d %H:%M"
+              label="Format date as 1990-12-24 15:05"
+            />
+            <Picker.Item
+              value="%Y-%m-%d"
+              label="Format date as 1990-12-24 (YYYY-MM-dd)"
+            />
+            <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>
   );
 }

WorkoutList.tsx

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