"use client";

import { useEffect, useState } from "react";
import { startCafePush } from "@/lib/cafePush";
import { useI18n } from "@/lib/i18n";
import Sidebar from "./Sidebar";
import TopBar from "./TopBar";

export default function DashboardLayout({
  children,
}: {
  children: React.ReactNode;
}) {
  const [mobileOpen, setMobileOpen] = useState(false);
  const { lang } = useI18n();

  useEffect(() => {
    let active = true;
    let stop = () => {};
    startCafePush(lang)
      .then((cleanup) => {
        if (!active) cleanup();
        else stop = cleanup;
      })
      .catch(() => {});
    return () => {
      active = false;
      stop();
    };
  }, [lang]);

  return (
    <div className="min-h-screen bg-[#FAFAF8]">
      <Sidebar mobileOpen={mobileOpen} onClose={() => setMobileOpen(false)} />
      <div className="transition-all lg:ms-[260px]">
        <TopBar onMenuClick={() => setMobileOpen(true)} />
        <main className="min-h-[calc(100vh-64px)] p-4 lg:p-8">
          {children}
        </main>
      </div>
    </div>
  );
}