ee7946316c
- sourceUrl was already saved on URL import but never displayed — render it as a link (hostname only) under the description. - Extract cook-mode's wake lock into a reusable useWakeLock hook, add visibility-change re-acquisition (a wake lock releases when the tab goes background and won't come back on its own), and use it on the regular recipe view too, not just cook mode. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
44 lines
1.1 KiB
TypeScript
44 lines
1.1 KiB
TypeScript
"use client";
|
|
|
|
import { useEffect, useRef } from "react";
|
|
|
|
/** Keeps the screen awake while the component is mounted and the tab is visible. */
|
|
export function useWakeLock(enabled = true) {
|
|
const wakeLockRef = useRef<WakeLockSentinel | null>(null);
|
|
|
|
useEffect(() => {
|
|
if (!enabled) return;
|
|
|
|
let cancelled = false;
|
|
|
|
async function acquire() {
|
|
try {
|
|
const lock = await navigator.wakeLock?.request("screen");
|
|
if (cancelled) {
|
|
void lock?.release();
|
|
return;
|
|
}
|
|
wakeLockRef.current = lock ?? null;
|
|
} catch {
|
|
// Wake Lock unsupported or denied — silently degrade.
|
|
}
|
|
}
|
|
|
|
function handleVisibilityChange() {
|
|
if (document.visibilityState === "visible" && !wakeLockRef.current) {
|
|
void acquire();
|
|
}
|
|
}
|
|
|
|
void acquire();
|
|
document.addEventListener("visibilitychange", handleVisibilityChange);
|
|
|
|
return () => {
|
|
cancelled = true;
|
|
document.removeEventListener("visibilitychange", handleVisibilityChange);
|
|
void wakeLockRef.current?.release().catch(() => {});
|
|
wakeLockRef.current = null;
|
|
};
|
|
}, [enabled]);
|
|
}
|