nik/watch-party
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fixed time out of sync not showing

Browse Source
This commit is contained in:
Nik Afiq 2025-11-11 22:48:42 +09:00
parent 062c659cde
commit d915375c7f
2 changed files with 6 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
frontend/src/components/TimeSyncNotice.tsx
View File

@ -8,17 +8,15 @@ function formatMs(ms: number) {
export default function TimeSyncNotice({
thresholdMs = 500,
endpoint,
intervalMs,
lang = "ja",
}: {
thresholdMs?: number;
endpoint?: string;
intervalMs?: number;
lang?: "ja" | "en";
}) {
// removed `error`
const { skewMs, rttMs, recheck } = useTimeSkew({ endpoint, intervalMs });
const { skewMs, rttMs, recheck } = useTimeSkew({ intervalMs });
const [dismissed, setDismissed] = useState<boolean>(() => {
try { return sessionStorage.getItem("timesync.dismissed") === "1"; } catch { return false; }

8
frontend/src/hooks/useTimeSkew.ts
View File

@ -1,4 +1,5 @@
import { useEffect, useRef, useState } from "react";
import { API_ENDPOINT } from "../api/endpoint";
/**
* Measures client clock skew vs server time {now: <ms since epoch, UTC>}.
@ -9,6 +10,8 @@ import { useEffect, useRef, useState } from "react";
* offset ≈ ((t0 + t1)/2) - s
* Positive offset => client is AHEAD by that many ms.
*/
const TIME_URL_ENDPOINT = API_ENDPOINT.v1.TIME;
export function useTimeSkew(opts?: {
endpoint?: string; // e.g., "/api/time" or `${import.meta.env.BASE_URL}api/time`
intervalMs?: number; // how often to recheck; default 5 min
@ -16,7 +19,6 @@ export function useTimeSkew(opts?: {
enabled?: boolean; // allow turning off; default true
}) {
const {
endpoint = "/api/time",
intervalMs = 5 * 60_000,
samples = 1,
enabled = true,
@ -29,7 +31,7 @@ export function useTimeSkew(opts?: {
const measureOnce = async () => {
const t0 = Date.now();
const res = await fetch(endpoint, { cache: "no-store" });
const res = await fetch(TIME_URL_ENDPOINT, { cache: "no-store" });
const t1 = Date.now();
if (!res.ok) throw new Error(`HTTP ${res.status}`);
const data = await res.json();
@ -81,7 +83,7 @@ export function useTimeSkew(opts?: {
if (timerRef.current) window.clearInterval(timerRef.current);
};
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [endpoint, intervalMs, samples, enabled]);
}, [intervalMs, samples, enabled]);
return { skewMs, rttMs, error, recheck: measure };
}