spb/earth-now Public License

1/**2 * earth-now.co3 * Author:  Simon-Pierre Boucher4 * Contact: contact@spboucher.ai5 * File:    apps/web/components/EmbedCounter.tsx6 * Purpose: Client wrapper for /embed/[id] — one fullscreen LiveCounter with a fixed locale and a tiny earth-now.co attribution link7 */89"use client";1011import { useMemo, useState } from "react";12import type { CounterModel, CounterWindow } from "@earth-now/counter";13import type { Locale, MetricSummary } from "@/lib/api";14import { I18nProvider } from "@/lib/i18n";15import LiveCounter from "./LiveCounter";1617export interface EmbedCounterProps {18  metric: MetricSummary;19  model?: CounterModel | undefined;20  window: CounterWindow;21  locale: Locale;22}2324export default function EmbedCounter({ metric, model, window: win, locale }: EmbedCounterProps) {25  // Locale is fixed by the ?lang= query — the toggle just satisfies the provider contract.26  const [embedLocale, setEmbedLocale] = useState<Locale>(locale);27  // Session window in an embed = since the iframe loaded.28  const sessionStart = useMemo(() => Date.now(), []);2930  return (31    <I18nProvider locale={embedLocale} setLocale={setEmbedLocale}>32      <div className="fixed inset-0 z-50 flex items-center justify-center bg-page p-4">33        <div className="w-full max-w-xl">34          <LiveCounter35            metric={metric}36            model={model}37            window={win}38            sessionStart={sessionStart}39            size="display"40          />41        </div>42        <a43          href="https://earth-now.co"44          target="_blank"45          rel="noreferrer"46          className="absolute bottom-2 right-3 text-[10px] text-muted hover:text-ink2"47        >48          earth-now.co49        </a>50      </div>51    </I18nProvider>52  );53}54