"use client"

import * as React from "react"
import { ConvexReactClient } from "convex/react";
import { useAuth } from "@clerk/nextjs";
import { ConvexProviderWithClerk } from "convex/react-clerk";
import { CONVEX_URL } from "@/lib/convexUrl";
import { LanguageProvider } from "@/modules/i18n/language-provider";

// Resolved Convex URL (pins the live EU deployment over Vercel's stale inject).
const convexUrl = CONVEX_URL;

let convex: ConvexReactClient | null = null;

if (convexUrl) {
  convex = new ConvexReactClient(convexUrl);
}

export function Providers({ children }: { children: React.ReactNode }) {
  React.useEffect(() => {
    if (convexUrl) {
      console.info("[CoreDesk] Convex URL:", convexUrl);
    }
  }, []);

  // If no Convex URL, just render children without provider (demo mode)
  if (!convex) {
    return <LanguageProvider syncPreference={false}>{children}</LanguageProvider>;
  }

  // LanguageProvider lives here rather than in the dashboard layout so that the
  // admin console, the auth screens and the public pages all get a translator
  // too. It must sit inside ConvexProviderWithClerk because its preference sync
  // reads and writes through Convex.
  return (
    <ConvexProviderWithClerk client={convex} useAuth={useAuth}>
      <LanguageProvider>{children}</LanguageProvider>
    </ConvexProviderWithClerk>
  );
}