Rework Best -> Graphs

I was considering adding weight tracking,
so then this graph page would include body
weight graphs. Meaning it's not really
recording the "best" of anything.
It currently only shows the best on the list
page anyway.

BestPage.tsx

@@ -1,23 +0,0 @@
-import { createStackNavigator } from '@react-navigation/stack'
-import BestList from './BestList'
-import GymSet from './gym-set'
-import ViewBest from './ViewBest'
-
-const Stack = createStackNavigator<BestPageParams>()
-export type BestPageParams = {
-  BestList: {}
-  ViewBest: {
-    best: GymSet
-  }
-}
-
-export default function BestPage() {
-  return (
-    <Stack.Navigator
-      screenOptions={{ headerShown: false, animationEnabled: false }}
-    >
-      <Stack.Screen name='BestList' component={BestList} />
-      <Stack.Screen name='ViewBest' component={ViewBest} />
-    </Stack.Navigator>
-  )
-}

GraphsList.tsx

@@ -6,17 +6,17 @@ import {
 import { useCallback, useState } from 'react'
 import { FlatList, Image } from 'react-native'
 import { List } from 'react-native-paper'
-import { BestPageParams } from './BestPage'
+import { GraphsPageParams } from './GraphsPage'
 import { setRepo, settingsRepo } from './db'
 import DrawerHeader from './DrawerHeader'
 import GymSet from './gym-set'
 import Page from './Page'
 import Settings from './settings'
 
-export default function BestList() {
+export default function GraphsList() {
   const [bests, setBests] = useState<GymSet[]>()
   const [term, setTerm] = useState('')
-  const navigation = useNavigation<NavigationProp<BestPageParams>>()
+  const navigation = useNavigation<NavigationProp<GraphsPageParams>>()
   const [settings, setSettings] = useState<Settings>()
 
   useFocusEffect(
@@ -34,7 +34,7 @@ export default function BestList() {
       .andWhere('NOT hidden')
       .groupBy('name')
       .getMany()
-    console.log(`${BestList.name}.refresh:`, { length: weights.length })
+    console.log(`${GraphsList.name}.refresh:`, { length: weights.length })
     let newBest: GymSet[] = []
     for (const set of weights) {
       const reps = await setRepo
@@ -70,7 +70,7 @@ export default function BestList() {
       key={item.name}
       title={item.name}
       description={`${item.reps} x ${item.weight}${item.unit || 'kg'}`}
-      onPress={() => navigation.navigate('ViewBest', { best: item })}
+      onPress={() => navigation.navigate('ViewGraph', { best: item })}
       left={() =>
         (settings.images && item.image && (
           <Image
@@ -84,7 +84,7 @@ export default function BestList() {
 
   return (
     <>
-      <DrawerHeader name='Best' />
+      <DrawerHeader name='Graphs' />
       <Page term={term} search={search}>
         {bests?.length === 0
           ? (

GraphsPage.tsx

@@ -0,0 +1,23 @@
+import { createStackNavigator } from '@react-navigation/stack'
+import GraphsList from './GraphsList'
+import GymSet from './gym-set'
+import ViewGraph from './ViewGraph'
+
+const Stack = createStackNavigator<GraphsPageParams>()
+export type GraphsPageParams = {
+  GraphsList: {}
+  ViewGraph: {
+    best: GymSet
+  }
+}
+
+export default function GraphsPage() {
+  return (
+    <Stack.Navigator
+      screenOptions={{ headerShown: false, animationEnabled: false }}
+    >
+      <Stack.Screen name='GraphsList' component={GraphsList} />
+      <Stack.Screen name='ViewGraph' component={ViewGraph} />
+    </Stack.Navigator>
+  )
+}

Routes.tsx

@@ -1,6 +1,6 @@
 import { createDrawerNavigator } from '@react-navigation/drawer'
 import { IconButton } from 'react-native-paper'
-import BestPage from './BestPage'
+import GraphsPage from './GraphsPage'
 import { DrawerParamList } from './drawer-param-list'
 import HomePage from './HomePage'
 import PlanPage from './PlanPage'
@@ -33,8 +33,8 @@ export default function Routes() {
         options={{ drawerIcon: () => <IconButton icon='event' /> }}
       />
       <Drawer.Screen
-        name='Best'
-        component={BestPage}
+        name='Graphs'
+        component={GraphsPage}
         options={{ drawerIcon: () => <IconButton icon='insights' /> }}
       />
       <Drawer.Screen

ViewGraph.tsx

@@ -6,7 +6,7 @@ import { FileSystem } from 'react-native-file-access'
 import { IconButton, List } from 'react-native-paper'
 import Share from 'react-native-share'
 import { captureScreen } from 'react-native-view-shot'
-import { BestPageParams } from './BestPage'
+import { GraphsPageParams } from './GraphsPage'
 import Chart from './Chart'
 import { PADDING } from './constants'
 import { setRepo } from './db'
@@ -18,8 +18,8 @@ import StackHeader from './StackHeader'
 import useDark from './use-dark'
 import Volume from './volume'
 
-export default function ViewBest() {
-  const { params } = useRoute<RouteProp<BestPageParams, 'ViewBest'>>()
+export default function ViewGraph() {
+  const { params } = useRoute<RouteProp<GraphsPageParams, 'ViewGraph'>>()
   const [weights, setWeights] = useState<GymSet[]>()
   const [volumes, setVolumes] = useState<Volume[]>()
   const [metric, setMetric] = useState(Metrics.Weight)

drawer-param-list.ts

@@ -1,7 +1,7 @@
 export type DrawerParamList = {
   Home: {}
   Settings: {}
-  Best: {}
+  Graphs: {}
   Plans: {}
   Workouts: {}
   Timer: {}

tests/GraphsPage.test.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import 'react-native'
 import { fireEvent, render, waitFor } from 'react-native-testing-library'
-import BestPage from '../BestPage'
+import GraphsPage from '../GraphsPage'
 import { MockProviders } from '../mock-providers'
 import Settings from '../settings'
 
@@ -46,17 +46,17 @@ jest.mock('../db.ts', () => ({
 test('renders correctly', async () => {
   const { getByText } = render(
     <MockProviders>
-      <BestPage />
+      <GraphsPage />
     </MockProviders>,
   )
-  const title = await waitFor(() => getByText('Best'))
+  const title = await waitFor(() => getByText('Graphs'))
   expect(title).toBeDefined()
 })
 
 test('searches', async () => {
   const { getByDisplayValue, getByPlaceholder } = render(
     <MockProviders>
-      <BestPage />
+      <GraphsPage />
     </MockProviders>,
   )
   const search = await waitFor(() => getByPlaceholder('Search'))

tests/ViewGraph.test.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import 'react-native'
 import { fireEvent, render, waitFor } from 'react-native-testing-library'
-import BestPage from '../BestPage'
+import GraphsPage from '../GraphsPage'
 import { MockProviders } from '../mock-providers'
 import Settings from '../settings'
 
@@ -69,7 +69,7 @@ jest.mock('../db.ts', () => ({
 test('renders correctly', async () => {
   const { getAllByText, getByText } = render(
     <MockProviders>
-      <BestPage />
+      <GraphsPage />
     </MockProviders>,
   )
   const benches = await waitFor(() => getAllByText('Bench press'))
@@ -83,7 +83,7 @@ test('renders correctly', async () => {
 test('volume', async () => {
   const { getAllByText, getByText } = render(
     <MockProviders>
-      <BestPage />
+      <GraphsPage />
     </MockProviders>,
   )
   const benches = await waitFor(() => getAllByText('Bench press'))
@@ -99,7 +99,7 @@ test('volume', async () => {
 test('one rep max', async () => {
   const { getAllByText, getByText } = render(
     <MockProviders>
-      <BestPage />
+      <GraphsPage />
     </MockProviders>,
   )
   const benches = await waitFor(() => getAllByText(/Bench press/i))
@@ -115,7 +115,7 @@ test('one rep max', async () => {
 test('this week', async () => {
   const { getAllByText, getByText } = render(
     <MockProviders>
-      <BestPage />
+      <GraphsPage />
     </MockProviders>,
   )
   const benches = await waitFor(() => getAllByText(/Bench press/i))
@@ -129,7 +129,7 @@ test('this week', async () => {
 test('this year', async () => {
   const { getAllByText, getByText } = render(
     <MockProviders>
-      <BestPage />
+      <GraphsPage />
     </MockProviders>,
   )
   const benches = await waitFor(() => getAllByText(/Bench press/i))