sapphic.moe
🏷️ Search for custom tailnet name offers with keywords.
1import { useCallback, useEffect, useState } from 'react';
2
3export const useTimer = () => {
4 const [status, setStatus] = useState<'Running' | 'Stopped'>('Stopped');
5 const [timer, setTimer] = useState<number | null>(null);
6 const [loading, setLoading] = useState(true);
7
8 const fetchAndSetTimer = useCallback(() => {
9 browser.runtime.sendMessage({ action: 'getNextAlarm' }, (resp) => {
10 setTimer(resp?.timeRemaining ?? null);
11 });
12 }, []);
13
14 useEffect(() => {
15 browser.runtime.sendMessage({ action: 'getStatus' }, (response) => {
16 setStatus(response?.status || 'Stopped');
17 setLoading(false);
18 if (response?.status === 'Running') {
19 fetchAndSetTimer();
20 }
21 });
22 }, [fetchAndSetTimer]);
23
24 useEffect(() => {
25 if (status === 'Running') {
26 fetchAndSetTimer(); // Ensure timer is set immediately on status change
27 const interval = setInterval(fetchAndSetTimer, 1000);
28 return () => clearInterval(interval);
29 } else {
30 setTimer(null);
31 }
32 }, [status, fetchAndSetTimer]);
33
34 return { status, setStatus, timer, loading, setLoading };
35};