diff --git a/App.tsx b/App.tsx index 30a457d..bd2f50b 100644 --- a/App.tsx +++ b/App.tsx @@ -36,20 +36,19 @@ const App = () => { const [db, setDb] = useState(null); const dark = useColorScheme() === 'dark'; - const init = async () => { - const gotDb = await getDb(); - await gotDb.executeSql(createPlans); - await gotDb.executeSql(createSets); - setDb(gotDb); - const minutes = await getItem('minutes'); - if (minutes === null) await setItem('minutes', '3'); - const seconds = await getItem('seconds'); - if (seconds === null) await setItem('seconds', '30'); - const alarmEnabled = await getItem('alarmEnabled'); - if (alarmEnabled === null) await setItem('alarmEnabled', 'false'); - }; - useEffect(() => { + const init = async () => { + const gotDb = await getDb(); + await gotDb.executeSql(createPlans); + await gotDb.executeSql(createSets); + setDb(gotDb); + const minutes = await getItem('minutes'); + if (minutes === null) await setItem('minutes', '3'); + const seconds = await getItem('seconds'); + if (seconds === null) await setItem('seconds', '30'); + const alarmEnabled = await getItem('alarmEnabled'); + if (alarmEnabled === null) await setItem('alarmEnabled', 'false'); + }; init(); }, []); diff --git a/BestPage.tsx b/BestPage.tsx index 407c445..9d89f3e 100644 --- a/BestPage.tsx +++ b/BestPage.tsx @@ -1,4 +1,4 @@ -import React, {useContext, useEffect, useState} from 'react'; +import React, {useCallback, useContext, useEffect, useState} from 'react'; import {FlatList, StyleSheet, View} from 'react-native'; import {List, Searchbar} from 'react-native-paper'; import {DatabaseContext} from './App'; @@ -12,22 +12,22 @@ export default function BestPage() { const [best, setBest] = useState(); const db = useContext(DatabaseContext); - const bestWeight = ` - SELECT name, reps, unit, MAX(weight) AS weight - FROM sets - WHERE name LIKE ? - GROUP BY name; - `; + const refresh = useCallback(async () => { + const bestWeight = ` + SELECT name, reps, unit, MAX(weight) AS weight + FROM sets + WHERE name LIKE ? + GROUP BY name; + `; - const bestReps = ` - SELECT name, MAX(reps) as reps, unit, weight - FROM sets - WHERE name = ? - AND weight = ? - GROUP BY name; - `; + const bestReps = ` + SELECT name, MAX(reps) as reps, unit, weight + FROM sets + WHERE name = ? + AND weight = ? + GROUP BY name; + `; - const refresh = async () => { const [weight] = await db.executeSql(bestWeight, [`%${search}%`]); if (!weight) return setBests([]); let newBest: Best[] = []; @@ -39,7 +39,7 @@ export default function BestPage() { newBest = newBest.concat(reps.rows.raw()); } setBests(newBest); - }; + }, [search]); useEffect(() => { refresh(); diff --git a/EditPlan.tsx b/EditPlan.tsx index b27c00f..74f6b1a 100644 --- a/EditPlan.tsx +++ b/EditPlan.tsx @@ -28,16 +28,17 @@ export default function EditPlan({ const [names, setNames] = useState([]); const db = useContext(DatabaseContext); - const refresh = async () => { - const [namesResult] = await db.executeSql('SELECT DISTINCT name FROM sets'); - if (!namesResult.rows.length) return setNames([]); - setNames(namesResult.rows.raw().map(({name}) => name)); - if (!plan) return; - setDays(plan.days.split(',')); - setWorkouts(plan.workouts.split(',')); - }; - useEffect(() => { + const refresh = async () => { + const [namesResult] = await db.executeSql( + 'SELECT DISTINCT name FROM sets', + ); + if (!namesResult.rows.length) return setNames([]); + setNames(namesResult.rows.raw().map(({name}) => name)); + if (!plan) return; + setDays(plan.days.split(',')); + setWorkouts(plan.workouts.split(',')); + }; refresh(); }, [plan]); diff --git a/HomePage.tsx b/HomePage.tsx index 29237bf..f860035 100644 --- a/HomePage.tsx +++ b/HomePage.tsx @@ -1,5 +1,5 @@ import AsyncStorage from '@react-native-async-storage/async-storage'; -import React, {useContext, useEffect, useState} from 'react'; +import React, {useCallback, useContext, useEffect, useState} from 'react'; import {FlatList, NativeModules, StyleSheet, View} from 'react-native'; import {List, Searchbar} from 'react-native-paper'; import {DatabaseContext} from './App'; @@ -25,23 +25,14 @@ export default function HomePage() { ORDER BY created DESC LIMIT ? OFFSET ? `; - const getSets = ({ - search, - limit, - offset, - }: { - search: string; - limit: number; - offset: number; - }) => db.executeSql(selectSets, [`%${search}%`, limit, offset]); - const refresh = async () => { - const [result] = await getSets({search, limit, offset: 0}); + const refresh = useCallback(async () => { + const [result] = await db.executeSql(selectSets, [`%${search}%`, limit, 0]); if (!result) return setSets([]); setSets(result.rows.raw()); setOffset(0); setEnd(false); - }; + }, [search]); const refreshLoader = async () => { setRefresing(true); @@ -66,19 +57,19 @@ export default function HomePage() { NativeModules.AlarmModule.timer(milliseconds); }; - const next = async () => { + const next = useCallback(async () => { if (end) return; setRefresing(true); const newOffset = offset + limit; - const [result] = await getSets({search, limit, offset: newOffset}).finally( - () => setRefresing(false), - ); + const [result] = await db + .executeSql(selectSets, [`%${search}%`, limit, newOffset]) + .finally(() => setRefresing(false)); if (result.rows.length === 0) return setEnd(true); if (!sets) return; setSets([...sets, ...result.rows.raw()]); if (result.rows.length < limit) return setEnd(true); setOffset(newOffset); - }; + }, [search, end]); return ( diff --git a/PlanPage.tsx b/PlanPage.tsx index 26e4549..482c847 100644 --- a/PlanPage.tsx +++ b/PlanPage.tsx @@ -1,4 +1,4 @@ -import React, {useContext, useEffect, useState} from 'react'; +import React, {useCallback, useContext, useEffect, useState} from 'react'; import {FlatList, StyleSheet, View} from 'react-native'; import {List, Searchbar} from 'react-native-paper'; import {DatabaseContext} from './App'; @@ -14,21 +14,20 @@ export default function PlanPage() { const [plan, setPlan] = useState(); const db = useContext(DatabaseContext); - const selectPlans = ` - SELECT * from plans - WHERE days LIKE ? OR workouts LIKE ? -`; - const getPlans = ({search}: {search: string}) => - db.executeSql(selectPlans, [`%${search}%`, `%${search}%`]); - - const refresh = async () => { - const [plansResult] = await getPlans({search}); + const refresh = useCallback(async () => { + const selectPlans = ` + SELECT * from plans + WHERE days LIKE ? OR workouts LIKE ? + `; + const getPlans = ({s}: {s: string}) => + db.executeSql(selectPlans, [`%${s}%`, `%${s}%`]); + const [plansResult] = await getPlans({s: search}); setPlans(plansResult.rows.raw()); - }; + }, [search, db]); useEffect(() => { refresh(); - }, [search]); + }, [search, refresh]); const renderItem = ({item}: {item: Plan}) => ( diff --git a/SettingsPage.tsx b/SettingsPage.tsx index dc11e86..25f607a 100644 --- a/SettingsPage.tsx +++ b/SettingsPage.tsx @@ -65,9 +65,9 @@ export default function SettingsPage() { value={seconds} keyboardType="numeric" placeholder="30" - onChangeText={seconds => { - setSeconds(seconds); - setItem('seconds', seconds); + onChangeText={s => { + setSeconds(s); + setItem('seconds', s); }} style={styles.text} /> diff --git a/ViewBest.tsx b/ViewBest.tsx index 1a6b7fe..2399478 100644 --- a/ViewBest.tsx +++ b/ViewBest.tsx @@ -34,7 +34,7 @@ export default function ViewBest({ setUnit(result.rows.item(0).unit); }; refresh(); - }, [best]); + }, [best, db]); const contentInset = {top: 20, bottom: 20}; @@ -65,7 +65,10 @@ export default function ViewBest({ -