fix(workout-builder): defer TextInput updates to onBlur using local state

This commit is contained in:
2026-08-11 16:48:01 +02:00
parent 7f2fe0c300
commit 070429627b
@@ -16,6 +16,7 @@ export function BuilderScreen() {
const navigation = useNavigation<NativeStackNavigationProp<RootStackParamList>>();
const { poolLength: defaultPoolLength } = useSettings();
const [poolLength, setPoolLength] = useState(defaultPoolLength);
const [fieldValues, setFieldValues] = useState<Record<string, string>>({});
const {
sets,
workoutName,
@@ -124,8 +125,19 @@ export function BuilderScreen() {
<Text className="text-xs font-medium text-slate-500 mb-1">{t("distanceM")}</Text>
<TextInput
keyboardType="numeric"
value={String(set.distancePerRep)}
onChangeText={(val) => updateSet(index, { distancePerRep: Number(val) || 0 })}
value={fieldValues[`${index}-distance`] ?? String(set.distancePerRep)}
onChangeText={(val) => setFieldValues((prev) => ({ ...prev, [`${index}-distance`]: val }))}
onBlur={() => {
const num = Number(fieldValues[`${index}-distance`] ?? set.distancePerRep);
updateSet(index, { distancePerRep: isNaN(num) || num < poolLength ? poolLength : num });
setFieldValues((prev) => {
const next = { ...prev };
delete next[`${index}-distance`];
return next;
});
}}
placeholder={String(poolLength)}
placeholderTextColor="#94a3b8"
className="bg-white border border-slate-300 rounded-lg px-3 py-2 text-slate-900"
/>
</View>
@@ -133,8 +145,19 @@ export function BuilderScreen() {
<Text className="text-xs font-medium text-slate-500 mb-1">{t("reps")}</Text>
<TextInput
keyboardType="numeric"
value={String(set.repCount)}
onChangeText={(val) => updateSet(index, { repCount: Number(val) || 1 })}
value={fieldValues[`${index}-rep`] ?? String(set.repCount)}
onChangeText={(val) => setFieldValues((prev) => ({ ...prev, [`${index}-rep`]: val }))}
onBlur={() => {
const num = Number(fieldValues[`${index}-rep`] ?? set.repCount);
updateSet(index, { repCount: isNaN(num) || num < 1 ? 1 : num });
setFieldValues((prev) => {
const next = { ...prev };
delete next[`${index}-rep`];
return next;
});
}}
placeholder="1"
placeholderTextColor="#94a3b8"
className="bg-white border border-slate-300 rounded-lg px-3 py-2 text-slate-900"
/>
</View>
@@ -142,8 +165,19 @@ export function BuilderScreen() {
<Text className="text-xs font-medium text-slate-500 mb-1">{t("restS")}</Text>
<TextInput
keyboardType="numeric"
value={String(set.restDuration)}
onChangeText={(val) => updateSet(index, { restDuration: Number(val) || 0 })}
value={fieldValues[`${index}-rest`] ?? String(set.restDuration)}
onChangeText={(val) => setFieldValues((prev) => ({ ...prev, [`${index}-rest`]: val }))}
onBlur={() => {
const num = Number(fieldValues[`${index}-rest`] ?? set.restDuration);
updateSet(index, { restDuration: isNaN(num) || num < 0 ? 0 : num });
setFieldValues((prev) => {
const next = { ...prev };
delete next[`${index}-rest`];
return next;
});
}}
placeholder="0"
placeholderTextColor="#94a3b8"
className="bg-white border border-slate-300 rounded-lg px-3 py-2 text-slate-900"
/>
</View>