"use client";

import { useEffect } from "react";
import { useNavHistory } from "@/src/lib/context/NavHistoryContext";

/**
 * Lets a page tell the back button what to call it, e.g. "Smartivo" rather
 * than the full SEO title "Smartivo | Coding Basics for Ages 4-6".
 *
 * Renders nothing. Drop it into any page whose name only the API knows.
 */
export default function NavLabel({ label }: { label: string }) {
  const { setPageLabel, clearPageLabel } = useNavHistory();

  useEffect(() => {
    if (!label) return;
    setPageLabel(label);
    return () => clearPageLabel();
  }, [label, setPageLabel, clearPageLabel]);

  return null;
}