fix(kock): ta bort buggig in-app-timer, ersatt med statisk tidshint
Timern (setInterval-nedrakning per steg) forsvann vid stegbyte och hade ingen
bakgrund/notis. Borttagen helt – visar nu bara stegets ungefarliga tid som text
("⏱ 5 min – anvand din telefons egen timer"). Ingen nedrakning, ingen bugg.
This commit is contained in:
@@ -1,8 +1,7 @@
|
|||||||
import { useEffect, useRef, useState } from "react";
|
import { useState } from "react";
|
||||||
import { Alert, Pressable, ScrollView, Text, View } from "react-native";
|
import { Alert, Pressable, ScrollView, Text, View } from "react-native";
|
||||||
import { router, useLocalSearchParams } from "expo-router";
|
import { router, useLocalSearchParams } from "expo-router";
|
||||||
import { useKeepAwake } from "expo-keep-awake";
|
import { useKeepAwake } from "expo-keep-awake";
|
||||||
import * as Haptics from "expo-haptics";
|
|
||||||
import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
|
import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
|
||||||
import { api } from "@/lib/api";
|
import { api } from "@/lib/api";
|
||||||
import { t } from "@/lib/i18n";
|
import { t } from "@/lib/i18n";
|
||||||
@@ -54,8 +53,6 @@ export default function CookingScreen() {
|
|||||||
const queryClient = useQueryClient();
|
const queryClient = useQueryClient();
|
||||||
const [stepIndex, setStepIndex] = useState(0);
|
const [stepIndex, setStepIndex] = useState(0);
|
||||||
const [showIngredients, setShowIngredients] = useState(false);
|
const [showIngredients, setShowIngredients] = useState(false);
|
||||||
const [timerLeft, setTimerLeft] = useState<number | null>(null);
|
|
||||||
const timerRef = useRef<ReturnType<typeof setInterval> | null>(null);
|
|
||||||
const [finishing, setFinishing] = useState(false);
|
const [finishing, setFinishing] = useState(false);
|
||||||
const [completedSessionId, setCompletedSessionId] = useState<string | null>(null);
|
const [completedSessionId, setCompletedSessionId] = useState<string | null>(null);
|
||||||
const [mealBoxPortions, setMealBoxPortions] = useState(0);
|
const [mealBoxPortions, setMealBoxPortions] = useState(0);
|
||||||
@@ -96,12 +93,6 @@ export default function CookingScreen() {
|
|||||||
Alert.alert(t("common.oops"), err instanceof Error ? err.message : t("common.error")),
|
Alert.alert(t("common.oops"), err instanceof Error ? err.message : t("common.error")),
|
||||||
});
|
});
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
return () => {
|
|
||||||
if (timerRef.current) clearInterval(timerRef.current);
|
|
||||||
};
|
|
||||||
}, []);
|
|
||||||
|
|
||||||
if (query.isLoading) return <LoadingView />;
|
if (query.isLoading) return <LoadingView />;
|
||||||
if (query.isError || !query.data) return <ErrorView onRetry={() => void query.refetch()} />;
|
if (query.isError || !query.data) return <ErrorView onRetry={() => void query.refetch()} />;
|
||||||
const recipe = query.data;
|
const recipe = query.data;
|
||||||
@@ -109,21 +100,6 @@ export default function CookingScreen() {
|
|||||||
const step = recipe.steps[stepIndex];
|
const step = recipe.steps[stepIndex];
|
||||||
const isLast = stepIndex >= recipe.steps.length - 1;
|
const isLast = stepIndex >= recipe.steps.length - 1;
|
||||||
|
|
||||||
const startTimer = (seconds: number) => {
|
|
||||||
if (timerRef.current) clearInterval(timerRef.current);
|
|
||||||
setTimerLeft(seconds);
|
|
||||||
timerRef.current = setInterval(() => {
|
|
||||||
setTimerLeft((prev) => {
|
|
||||||
if (prev == null || prev <= 1) {
|
|
||||||
if (timerRef.current) clearInterval(timerRef.current);
|
|
||||||
void Haptics.notificationAsync(Haptics.NotificationFeedbackType.Success);
|
|
||||||
return 0;
|
|
||||||
}
|
|
||||||
return prev - 1;
|
|
||||||
});
|
|
||||||
}, 1000);
|
|
||||||
};
|
|
||||||
|
|
||||||
const finish = () => {
|
const finish = () => {
|
||||||
setFinishing(true);
|
setFinishing(true);
|
||||||
};
|
};
|
||||||
@@ -310,26 +286,19 @@ export default function CookingScreen() {
|
|||||||
)}
|
)}
|
||||||
|
|
||||||
{step?.timerSeconds != null && (
|
{step?.timerSeconds != null && (
|
||||||
<Pressable
|
<View
|
||||||
onPress={() => startTimer(step.timerSeconds!)}
|
|
||||||
style={{
|
style={{
|
||||||
backgroundColor: timerLeft != null ? colors.accentSoft : colors.primarySoft,
|
backgroundColor: colors.primarySoft,
|
||||||
padding: spacing.lg,
|
padding: spacing.md,
|
||||||
borderRadius: 16,
|
borderRadius: 16,
|
||||||
alignItems: "center",
|
alignItems: "center",
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<Text style={{ fontSize: 32, fontWeight: "700", color: colors.primaryDark }}>
|
<Text style={{ fontSize: 22, fontWeight: "700", color: colors.primaryDark }}>
|
||||||
{timerLeft != null ? formatTime(timerLeft) : formatTime(step.timerSeconds)}
|
⏱ {formatTime(step.timerSeconds)}
|
||||||
</Text>
|
</Text>
|
||||||
<Small>
|
<Small>Ungefärlig tid för steget – använd din telefons egen timer.</Small>
|
||||||
{timerLeft != null
|
</View>
|
||||||
? timerLeft === 0
|
|
||||||
? `${t("cooking.timerDone")} 🎉`
|
|
||||||
: t("cooking.timerRunning", { time: formatTime(timerLeft) })
|
|
||||||
: t("cooking.timer")}
|
|
||||||
</Small>
|
|
||||||
</Pressable>
|
|
||||||
)}
|
)}
|
||||||
<Small>{t("cooking.keepAwake")}</Small>
|
<Small>{t("cooking.keepAwake")}</Small>
|
||||||
</View>
|
</View>
|
||||||
|
|||||||
Reference in New Issue
Block a user