76 lines
1.9 KiB
TypeScript
76 lines
1.9 KiB
TypeScript
import { RouteProp, useRoute } from "@react-navigation/native";
|
|
import { useCallback, useEffect, useState } from "react";
|
|
import { FlatList } from "react-native";
|
|
import { List } from "react-native-paper";
|
|
import { Like } from "typeorm";
|
|
import { StackParams } from "./AppStack";
|
|
import SetItem from "./SetItem";
|
|
import StackHeader from "./StackHeader";
|
|
import { LIMIT } from "./constants";
|
|
import { setRepo, settingsRepo } from "./db";
|
|
import GymSet from "./gym-set";
|
|
import Settings from "./settings";
|
|
|
|
export default function ViewSetList() {
|
|
const [sets, setSets] = useState<GymSet[]>();
|
|
const [settings, setSettings] = useState<Settings>();
|
|
const { params } = useRoute<RouteProp<StackParams, "ViewSetList">>();
|
|
|
|
useEffect(() => {
|
|
settingsRepo.findOne({ where: {} }).then(setSettings);
|
|
|
|
const reset = async () => {
|
|
const newSets = await setRepo.find({
|
|
where: { name: Like(`%${params.name}%`), hidden: 0 as any },
|
|
take: LIMIT * 2,
|
|
skip: 0,
|
|
order: { created: "DESC" },
|
|
});
|
|
setSets(newSets);
|
|
};
|
|
|
|
reset();
|
|
}, [params.name]);
|
|
|
|
const renderItem = useCallback(
|
|
({ item }: { item: GymSet }) => (
|
|
<SetItem
|
|
settings={settings}
|
|
item={item}
|
|
key={item.id}
|
|
ids={[]}
|
|
setIds={() => null}
|
|
disablePress
|
|
/>
|
|
),
|
|
[settings]
|
|
);
|
|
|
|
const getContent = () => {
|
|
if (!settings) return null;
|
|
if (sets?.length === 0)
|
|
return (
|
|
<List.Item
|
|
title="No sets yet"
|
|
description="A set is a group of repetitions. E.g. 8 reps of Squats."
|
|
/>
|
|
);
|
|
return (
|
|
<FlatList
|
|
data={sets ?? []}
|
|
style={{ flex: 1 }}
|
|
renderItem={renderItem}
|
|
keyExtractor={(set) => set.id?.toString()}
|
|
/>
|
|
);
|
|
};
|
|
|
|
return (
|
|
<>
|
|
<StackHeader title={params.name} />
|
|
|
|
{getContent()}
|
|
</>
|
|
);
|
|
}
|