diff --git a/apps/mobile/src/features/threads/worktree-setup-card.tsx b/apps/mobile/src/features/threads/worktree-setup-card.tsx index c76db938c480..70e7e8f710ad 100644 --- a/apps/mobile/src/features/threads/worktree-setup-card.tsx +++ b/apps/mobile/src/features/threads/worktree-setup-card.tsx @@ -5,14 +5,15 @@ import { } from "@t3tools/contracts"; import { worktreeSetupAgentStarted } from "@t3tools/client-runtime/worktree-setup"; import { formatDuration } from "@t3tools/shared/orchestrationTiming"; -import { useEffect, useState } from "react"; -import { AppState, Platform, Pressable, ScrollView, View } from "react-native"; +import { useState } from "react"; +import { Platform, Pressable, ScrollView, View } from "react-native"; import { useSafeAreaInsets } from "react-native-safe-area-context"; import { AppActivityIndicator } from "../../components/ui/AppActivityIndicator"; import { AppText as Text } from "../../components/ui/AppText"; import { SymbolView, type AppSymbolName } from "../../components/ui/AppSymbol"; import { WorktreeSetupSheet } from "./worktree-setup-sheet"; import { ShimmeringWorkContent } from "./thread-work-log"; +import { useVisibleSecondClock } from "./use-visible-second-clock"; export interface WorktreeSetupCardProps { snapshot: WorktreeSetupSnapshot; @@ -45,7 +46,7 @@ export function WorktreeSetupCard(props: WorktreeSetupCardProps) { const backgroundSetup = handedOff && running; const scriptName = snapshot.setupScript?.name ?? "Setup script"; const [detailsOpen, setDetailsOpen] = useState(false); - const now = useSetupClock(running || working); + const now = useVisibleSecondClock(running || working); const failed = snapshot.phase === "failed" || snapshot.stages.some((stage) => stage.status === "failed"); const label = @@ -147,7 +148,7 @@ export function WorktreeSetupCard(props: WorktreeSetupCardProps) { } export function WorktreeWorkingHeader({ startedAt }: { startedAt: string }) { - const now = useSetupClock(true); + const now = useVisibleSecondClock(true); return ( @@ -188,21 +189,6 @@ function HeaderLabel({ ); } -function useSetupClock(active: boolean) { - const [now, setNow] = useState(Date.now); - const [appState, setAppState] = useState(AppState.currentState); - useEffect(() => { - const subscription = AppState.addEventListener("change", setAppState); - return () => subscription.remove(); - }, []); - useEffect(() => { - if (!active || appState !== "active") return; - const timer = setInterval(() => setNow(Date.now()), 1000); - return () => clearInterval(timer); - }, [active, appState]); - return now; -} - function SetupDetailsSheet({ snapshot, turnStarted,