06 Warnings Only

1// T4 case 06 — Patterns that warn but don't block.
2//
3// Should be detected by lint_source.py with:
4//   - r2hf/delay-render (warning) — drop the call; HF handles asset readiness
5//   - r2hf/use-callback (warning) — decorative, drop the wrapper
6//   - r2hf/use-memo    (warning) — decorative, drop the wrapper
7//
8// 0 blockers expected — the skill should still translate this composition
9// after dropping the wrappers. delayRender is paired with continueRender via
10// an empty-deps useEffect (mount-once side effect), which doesn't trip the
11// use-effect-deps blocker.
12
13import React, { useCallback, useMemo } from "react";
14import { AbsoluteFill, delayRender, continueRender, useCurrentFrame, interpolate } from "remotion";
15
16const handle = delayRender();
17// Resolve the handle once at module load — no per-frame side effects.
18queueMicrotask(() => continueRender(handle));
19
20export const WarningsOnly: React.FC = () => {
21  const frame = useCurrentFrame();
22
23  // useCallback / useMemo — decorative for render-perf in React, no equivalent
24  // needed in the seek-driven HF model.
25  const opacity = useMemo(
26    () => interpolate(frame, [0, 30], [0, 1], { extrapolateRight: "clamp" }),
27    [frame],
28  );
29  const onMount = useCallback(() => {}, []);
30
31  return (
32    <AbsoluteFill style={{ opacity }} onClick={onMount}>
33      <div>frame {frame}</div>
34    </AbsoluteFill>
35  );
36};