Factor out StartPlanItem
This commit is contained in:
parent
992b3d0ba6
commit
e33ff1172a
|
@ -2,9 +2,8 @@ import {RouteProp, useFocusEffect, useRoute} from '@react-navigation/native';
|
||||||
import {useCallback, useMemo, useRef, useState} from 'react';
|
import {useCallback, useMemo, useRef, useState} from 'react';
|
||||||
import {NativeModules, TextInput, View} from 'react-native';
|
import {NativeModules, TextInput, View} from 'react-native';
|
||||||
import {FlatList} from 'react-native-gesture-handler';
|
import {FlatList} from 'react-native-gesture-handler';
|
||||||
import {Button, List, RadioButton} from 'react-native-paper';
|
import {Button} from 'react-native-paper';
|
||||||
import {getBestSet} from './best.service';
|
import {getBestSet} from './best.service';
|
||||||
import {useColor} from './color';
|
|
||||||
import {PADDING} from './constants';
|
import {PADDING} from './constants';
|
||||||
import CountMany from './count-many';
|
import CountMany from './count-many';
|
||||||
import MassiveInput from './MassiveInput';
|
import MassiveInput from './MassiveInput';
|
||||||
|
@ -14,6 +13,7 @@ import Set from './set';
|
||||||
import {addSet, countMany} from './set.service';
|
import {addSet, countMany} from './set.service';
|
||||||
import SetForm from './SetForm';
|
import SetForm from './SetForm';
|
||||||
import StackHeader from './StackHeader';
|
import StackHeader from './StackHeader';
|
||||||
|
import StartPlanItem from './StartPlanItem';
|
||||||
import {useSettings} from './use-settings';
|
import {useSettings} from './use-settings';
|
||||||
|
|
||||||
export default function StartPlan() {
|
export default function StartPlan() {
|
||||||
|
@ -34,7 +34,6 @@ export default function StartPlan() {
|
||||||
const repsRef = useRef<TextInput>(null);
|
const repsRef = useRef<TextInput>(null);
|
||||||
const unitRef = useRef<TextInput>(null);
|
const unitRef = useRef<TextInput>(null);
|
||||||
const workouts = useMemo(() => params.plan.workouts.split(','), [params]);
|
const workouts = useMemo(() => params.plan.workouts.split(','), [params]);
|
||||||
const {color} = useColor();
|
|
||||||
|
|
||||||
const [selection, setSelection] = useState({
|
const [selection, setSelection] = useState({
|
||||||
start: 0,
|
start: 0,
|
||||||
|
@ -90,10 +89,10 @@ export default function StartPlan() {
|
||||||
async (index: number) => {
|
async (index: number) => {
|
||||||
setSelected(index);
|
setSelected(index);
|
||||||
console.log(`${StartPlan.name}.next:`, {name});
|
console.log(`${StartPlan.name}.next:`, {name});
|
||||||
if (!workouts) return;
|
if (!counts) return;
|
||||||
const workout = workouts[index];
|
const workout = counts[index];
|
||||||
console.log(`${StartPlan.name}.next:`, {workout});
|
console.log(`${StartPlan.name}.next:`, {workout});
|
||||||
const newBest = await getBestSet(workout);
|
const newBest = await getBestSet(workout.name);
|
||||||
setMinutes(newBest.minutes);
|
setMinutes(newBest.minutes);
|
||||||
setSeconds(newBest.seconds);
|
setSeconds(newBest.seconds);
|
||||||
setName(newBest.name);
|
setName(newBest.name);
|
||||||
|
@ -102,7 +101,7 @@ export default function StartPlan() {
|
||||||
setUnit(newBest.unit);
|
setUnit(newBest.unit);
|
||||||
setBest(newBest);
|
setBest(newBest);
|
||||||
},
|
},
|
||||||
[name, workouts],
|
[name, counts],
|
||||||
);
|
);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
@ -141,22 +140,11 @@ export default function StartPlan() {
|
||||||
{counts && (
|
{counts && (
|
||||||
<FlatList
|
<FlatList
|
||||||
data={counts}
|
data={counts}
|
||||||
renderItem={({item, index}) => (
|
renderItem={props => (
|
||||||
<List.Item
|
<StartPlanItem
|
||||||
title={item.name}
|
{...props}
|
||||||
description={item.total.toString()}
|
onSelect={select}
|
||||||
onPress={() => select(index)}
|
selected={selected}
|
||||||
left={() => (
|
|
||||||
<View
|
|
||||||
style={{alignItems: 'center', justifyContent: 'center'}}>
|
|
||||||
<RadioButton
|
|
||||||
onPress={() => select(index)}
|
|
||||||
value={index.toString()}
|
|
||||||
status={selected === index ? 'checked' : 'unchecked'}
|
|
||||||
color={color}
|
|
||||||
/>
|
|
||||||
</View>
|
|
||||||
)}
|
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
/>
|
/>
|
||||||
|
|
32
StartPlanItem.tsx
Normal file
32
StartPlanItem.tsx
Normal file
|
@ -0,0 +1,32 @@
|
||||||
|
import {ListRenderItemInfo, View} from 'react-native';
|
||||||
|
import {List, RadioButton} from 'react-native-paper';
|
||||||
|
import {useColor} from './color';
|
||||||
|
import CountMany from './count-many';
|
||||||
|
|
||||||
|
interface Props extends ListRenderItemInfo<CountMany> {
|
||||||
|
onSelect: (index: number) => void;
|
||||||
|
selected: number;
|
||||||
|
}
|
||||||
|
|
||||||
|
export default function StartPlanItem(props: Props) {
|
||||||
|
const {index, item, onSelect, selected} = props;
|
||||||
|
const {color} = useColor();
|
||||||
|
|
||||||
|
return (
|
||||||
|
<List.Item
|
||||||
|
title={item.name}
|
||||||
|
description={item.total.toString()}
|
||||||
|
onPress={() => onSelect(index)}
|
||||||
|
left={() => (
|
||||||
|
<View style={{alignItems: 'center', justifyContent: 'center'}}>
|
||||||
|
<RadioButton
|
||||||
|
onPress={() => onSelect(index)}
|
||||||
|
value={index.toString()}
|
||||||
|
status={selected === index ? 'checked' : 'unchecked'}
|
||||||
|
color={color}
|
||||||
|
/>
|
||||||
|
</View>
|
||||||
|
)}
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
}
|
Loading…
Reference in New Issue
Block a user