parent
8648cf166e
commit
da17f8899c
|
@ -6,15 +6,19 @@ import {
|
||||||
import { useCallback, useState } from "react";
|
import { useCallback, useState } from "react";
|
||||||
import { FlatList, Image } from "react-native";
|
import { FlatList, Image } from "react-native";
|
||||||
import { List } from "react-native-paper";
|
import { List } from "react-native-paper";
|
||||||
import { GraphsPageParams } from "./GraphsPage";
|
import { getBestSets } from "./best.service";
|
||||||
import { setRepo, settingsRepo } from "./db";
|
import { LIMIT } from "./constants";
|
||||||
|
import { settingsRepo } from "./db";
|
||||||
import DrawerHeader from "./DrawerHeader";
|
import DrawerHeader from "./DrawerHeader";
|
||||||
|
import { GraphsPageParams } from "./GraphsPage";
|
||||||
import GymSet from "./gym-set";
|
import GymSet from "./gym-set";
|
||||||
import Page from "./Page";
|
import Page from "./Page";
|
||||||
import Settings from "./settings";
|
import Settings from "./settings";
|
||||||
|
|
||||||
export default function GraphsList() {
|
export default function GraphsList() {
|
||||||
const [bests, setBests] = useState<GymSet[]>();
|
const [bests, setBests] = useState<GymSet[]>([]);
|
||||||
|
const [offset, setOffset] = useState(0);
|
||||||
|
const [end, setEnd] = useState(false);
|
||||||
const [term, setTerm] = useState("");
|
const [term, setTerm] = useState("");
|
||||||
const navigation = useNavigation<NavigationProp<GraphsPageParams>>();
|
const navigation = useNavigation<NavigationProp<GraphsPageParams>>();
|
||||||
const [settings, setSettings] = useState<Settings>();
|
const [settings, setSettings] = useState<Settings>();
|
||||||
|
@ -26,22 +30,9 @@ export default function GraphsList() {
|
||||||
);
|
);
|
||||||
|
|
||||||
const refresh = useCallback(async (value: string) => {
|
const refresh = useCallback(async (value: string) => {
|
||||||
const result = await setRepo
|
const result = await getBestSets({ term: value, offset: 0 });
|
||||||
.createQueryBuilder("gym_set")
|
|
||||||
.select(["gym_set.name", "gym_set.reps", "gym_set.weight"])
|
|
||||||
.groupBy("gym_set.name")
|
|
||||||
.innerJoin(
|
|
||||||
(qb) =>
|
|
||||||
qb
|
|
||||||
.select(["gym_set2.name", "MAX(gym_set2.weight) AS max_weight"])
|
|
||||||
.from(GymSet, "gym_set2")
|
|
||||||
.where("gym_set2.name LIKE (:name)", { name: `%${value.trim()}%` })
|
|
||||||
.groupBy("gym_set2.name"),
|
|
||||||
"subquery",
|
|
||||||
"gym_set.name = subquery.gym_set2_name AND gym_set.weight = subquery.max_weight"
|
|
||||||
)
|
|
||||||
.getMany();
|
|
||||||
setBests(result);
|
setBests(result);
|
||||||
|
setOffset(0);
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
useFocusEffect(
|
useFocusEffect(
|
||||||
|
@ -50,6 +41,18 @@ export default function GraphsList() {
|
||||||
}, [refresh, term])
|
}, [refresh, term])
|
||||||
);
|
);
|
||||||
|
|
||||||
|
const next = useCallback(async () => {
|
||||||
|
if (end) return;
|
||||||
|
const newOffset = offset + LIMIT;
|
||||||
|
console.log(`${GraphsList.name}.next:`, { offset, newOffset, term });
|
||||||
|
const newBests = await getBestSets({ term, offset });
|
||||||
|
if (newBests.length === 0) return setEnd(true);
|
||||||
|
if (!bests) return;
|
||||||
|
setBests([...bests, ...newBests]);
|
||||||
|
if (newBests.length < LIMIT) return setEnd(true);
|
||||||
|
setOffset(newOffset);
|
||||||
|
}, [term, end, offset, bests]);
|
||||||
|
|
||||||
const search = useCallback(
|
const search = useCallback(
|
||||||
(value: string) => {
|
(value: string) => {
|
||||||
setTerm(value);
|
setTerm(value);
|
||||||
|
@ -86,7 +89,12 @@ export default function GraphsList() {
|
||||||
description="Once sets have been added, this will highlight your personal bests."
|
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}
|
||||||
|
onEndReached={next}
|
||||||
|
/>
|
||||||
)}
|
)}
|
||||||
</Page>
|
</Page>
|
||||||
</>
|
</>
|
||||||
|
|
13
SetList.tsx
13
SetList.tsx
|
@ -7,6 +7,7 @@ import { useCallback, 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 { Like } from "typeorm";
|
import { Like } from "typeorm";
|
||||||
|
import { LIMIT } from "./constants";
|
||||||
import { getNow, setRepo, settingsRepo } from "./db";
|
import { getNow, setRepo, settingsRepo } from "./db";
|
||||||
import DrawerHeader from "./DrawerHeader";
|
import DrawerHeader from "./DrawerHeader";
|
||||||
import GymSet, { defaultSet } from "./gym-set";
|
import GymSet, { defaultSet } from "./gym-set";
|
||||||
|
@ -16,8 +17,6 @@ import Page from "./Page";
|
||||||
import SetItem from "./SetItem";
|
import SetItem from "./SetItem";
|
||||||
import Settings from "./settings";
|
import Settings from "./settings";
|
||||||
|
|
||||||
const limit = 15;
|
|
||||||
|
|
||||||
export default function SetList() {
|
export default function SetList() {
|
||||||
const [sets, setSets] = useState<GymSet[]>([]);
|
const [sets, setSets] = useState<GymSet[]>([]);
|
||||||
const [offset, setOffset] = useState(0);
|
const [offset, setOffset] = useState(0);
|
||||||
|
@ -30,11 +29,11 @@ export default function SetList() {
|
||||||
const refresh = useCallback(async (value: string) => {
|
const refresh = useCallback(async (value: string) => {
|
||||||
const newSets = await setRepo.find({
|
const newSets = await setRepo.find({
|
||||||
where: { name: Like(`%${value.trim()}%`), hidden: 0 as any },
|
where: { name: Like(`%${value.trim()}%`), hidden: 0 as any },
|
||||||
take: limit,
|
take: LIMIT,
|
||||||
skip: 0,
|
skip: 0,
|
||||||
order: { created: "DESC" },
|
order: { created: "DESC" },
|
||||||
});
|
});
|
||||||
console.log(`${SetList.name}.refresh:`, { value, limit });
|
console.log(`${SetList.name}.refresh:`, { value });
|
||||||
setSets(newSets);
|
setSets(newSets);
|
||||||
setOffset(0);
|
setOffset(0);
|
||||||
setEnd(false);
|
setEnd(false);
|
||||||
|
@ -63,18 +62,18 @@ export default function SetList() {
|
||||||
|
|
||||||
const next = useCallback(async () => {
|
const next = useCallback(async () => {
|
||||||
if (end) return;
|
if (end) return;
|
||||||
const newOffset = offset + limit;
|
const newOffset = offset + LIMIT;
|
||||||
console.log(`${SetList.name}.next:`, { offset, newOffset, term });
|
console.log(`${SetList.name}.next:`, { offset, newOffset, term });
|
||||||
const newSets = await setRepo.find({
|
const newSets = await setRepo.find({
|
||||||
where: { name: Like(`%${term}%`), hidden: 0 as any },
|
where: { name: Like(`%${term}%`), hidden: 0 as any },
|
||||||
take: limit,
|
take: LIMIT,
|
||||||
skip: newOffset,
|
skip: newOffset,
|
||||||
order: { created: "DESC" },
|
order: { created: "DESC" },
|
||||||
});
|
});
|
||||||
if (newSets.length === 0) return setEnd(true);
|
if (newSets.length === 0) return setEnd(true);
|
||||||
if (!sets) return;
|
if (!sets) return;
|
||||||
setSets([...sets, ...newSets]);
|
setSets([...sets, ...newSets]);
|
||||||
if (newSets.length < limit) return setEnd(true);
|
if (newSets.length < LIMIT) return setEnd(true);
|
||||||
setOffset(newOffset);
|
setOffset(newOffset);
|
||||||
}, [term, end, offset, sets]);
|
}, [term, end, offset, sets]);
|
||||||
|
|
||||||
|
|
|
@ -6,6 +6,7 @@ import {
|
||||||
import { useCallback, useState } from "react";
|
import { useCallback, 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 { LIMIT } from "./constants";
|
||||||
import { setRepo, settingsRepo } from "./db";
|
import { setRepo, settingsRepo } from "./db";
|
||||||
import DrawerHeader from "./DrawerHeader";
|
import DrawerHeader from "./DrawerHeader";
|
||||||
import GymSet from "./gym-set";
|
import GymSet from "./gym-set";
|
||||||
|
@ -15,8 +16,6 @@ import Settings from "./settings";
|
||||||
import WorkoutItem from "./WorkoutItem";
|
import WorkoutItem from "./WorkoutItem";
|
||||||
import { WorkoutsPageParams } from "./WorkoutsPage";
|
import { WorkoutsPageParams } from "./WorkoutsPage";
|
||||||
|
|
||||||
const limit = 15;
|
|
||||||
|
|
||||||
export default function WorkoutList() {
|
export default function WorkoutList() {
|
||||||
const [workouts, setWorkouts] = useState<GymSet[]>();
|
const [workouts, setWorkouts] = useState<GymSet[]>();
|
||||||
const [offset, setOffset] = useState(0);
|
const [offset, setOffset] = useState(0);
|
||||||
|
@ -32,7 +31,7 @@ export default function WorkoutList() {
|
||||||
.where("name LIKE :name", { name: `%${value.trim()}%` })
|
.where("name LIKE :name", { name: `%${value.trim()}%` })
|
||||||
.groupBy("name")
|
.groupBy("name")
|
||||||
.orderBy("name")
|
.orderBy("name")
|
||||||
.limit(limit)
|
.limit(LIMIT)
|
||||||
.getMany();
|
.getMany();
|
||||||
console.log(`${WorkoutList.name}`, { newWorkout: newWorkouts[0] });
|
console.log(`${WorkoutList.name}`, { newWorkout: newWorkouts[0] });
|
||||||
setWorkouts(newWorkouts);
|
setWorkouts(newWorkouts);
|
||||||
|
@ -61,10 +60,10 @@ export default function WorkoutList() {
|
||||||
|
|
||||||
const next = useCallback(async () => {
|
const next = useCallback(async () => {
|
||||||
if (end) return;
|
if (end) return;
|
||||||
const newOffset = offset + limit;
|
const newOffset = offset + LIMIT;
|
||||||
console.log(`${SetList.name}.next:`, {
|
console.log(`${SetList.name}.next:`, {
|
||||||
offset,
|
offset,
|
||||||
limit,
|
limit: LIMIT,
|
||||||
newOffset,
|
newOffset,
|
||||||
term,
|
term,
|
||||||
});
|
});
|
||||||
|
@ -74,13 +73,13 @@ export default function WorkoutList() {
|
||||||
.where("name LIKE :name", { name: `%${term.trim()}%` })
|
.where("name LIKE :name", { name: `%${term.trim()}%` })
|
||||||
.groupBy("name")
|
.groupBy("name")
|
||||||
.orderBy("name")
|
.orderBy("name")
|
||||||
.limit(limit)
|
.limit(LIMIT)
|
||||||
.offset(newOffset)
|
.offset(newOffset)
|
||||||
.getMany();
|
.getMany();
|
||||||
if (newWorkouts.length === 0) return setEnd(true);
|
if (newWorkouts.length === 0) return setEnd(true);
|
||||||
if (!workouts) return;
|
if (!workouts) return;
|
||||||
setWorkouts([...workouts, ...newWorkouts]);
|
setWorkouts([...workouts, ...newWorkouts]);
|
||||||
if (newWorkouts.length < limit) return setEnd(true);
|
if (newWorkouts.length < LIMIT) return setEnd(true);
|
||||||
setOffset(newOffset);
|
setOffset(newOffset);
|
||||||
}, [term, end, offset, workouts]);
|
}, [term, end, offset, workouts]);
|
||||||
|
|
||||||
|
|
|
@ -1,3 +1,4 @@
|
||||||
|
import { LIMIT } from "./constants";
|
||||||
import { setRepo } from "./db";
|
import { setRepo } from "./db";
|
||||||
import GymSet from "./gym-set";
|
import GymSet from "./gym-set";
|
||||||
|
|
||||||
|
@ -13,3 +14,29 @@ export const getBestSet = async (name: string): Promise<GymSet> => {
|
||||||
.addOrderBy("reps", "DESC")
|
.addOrderBy("reps", "DESC")
|
||||||
.getOne();
|
.getOne();
|
||||||
};
|
};
|
||||||
|
|
||||||
|
export const getBestSets = ({
|
||||||
|
term: term,
|
||||||
|
offset,
|
||||||
|
}: {
|
||||||
|
term: string;
|
||||||
|
offset?: number;
|
||||||
|
}) => {
|
||||||
|
return setRepo
|
||||||
|
.createQueryBuilder("gym_set")
|
||||||
|
.select(["gym_set.name", "gym_set.reps", "gym_set.weight"])
|
||||||
|
.groupBy("gym_set.name")
|
||||||
|
.innerJoin(
|
||||||
|
(qb) =>
|
||||||
|
qb
|
||||||
|
.select(["gym_set2.name", "MAX(gym_set2.weight) AS max_weight"])
|
||||||
|
.from(GymSet, "gym_set2")
|
||||||
|
.where("gym_set2.name LIKE (:name)", { name: `%${term.trim()}%` })
|
||||||
|
.groupBy("gym_set2.name"),
|
||||||
|
"subquery",
|
||||||
|
"gym_set.name = subquery.gym_set2_name AND gym_set.weight = subquery.max_weight"
|
||||||
|
)
|
||||||
|
.limit(LIMIT)
|
||||||
|
.offset(offset || 0)
|
||||||
|
.getMany();
|
||||||
|
};
|
||||||
|
|
|
@ -3,3 +3,4 @@ export const PADDING = 10;
|
||||||
export const ITEM_PADDING = 8;
|
export const ITEM_PADDING = 8;
|
||||||
export const DARK_RIPPLE = "#444444";
|
export const DARK_RIPPLE = "#444444";
|
||||||
export const LIGHT_RIPPLE = "#c2c2c2";
|
export const LIGHT_RIPPLE = "#c2c2c2";
|
||||||
|
export const LIMIT = 15;
|
||||||
|
|
Loading…
Reference in New Issue