portfolio/app/components/ClientProviders.tsx

"use client";

import React from "react";
import { MotionConfig } from "framer-motion";
import { ToastProvider } from "@/components/Toast";
import ErrorBoundary from "@/components/ErrorBoundary";
import { ConsentProvider } from "./ConsentProvider";
import { ThemeProvider } from "./ThemeProvider";

export default function ClientProviders({
  children,
}: {
  children: React.ReactNode;
}) {
  return (
    <ErrorBoundary>
      <ErrorBoundary>
        <ConsentProvider>
          <ThemeProvider>
            {/* Respect prefers-reduced-motion in every Framer Motion animation */}
            <MotionConfig reducedMotion="user">
              <GatedProviders>
                {children}
              </GatedProviders>
            </MotionConfig>
          </ThemeProvider>
        </ConsentProvider>
      </ErrorBoundary>
    </ErrorBoundary>
  );
}

function GatedProviders({ children }: { children: React.ReactNode }) {
  return (
    <ErrorBoundary>
      <ToastProvider>
        <div className="relative z-10">{children}</div>
      </ToastProvider>
    </ErrorBoundary>
  );
}