"use client";

import { ClerkProvider } from "@clerk/nextjs";
import type { ComponentProps } from "react";
import { ThemeProvider } from "@/components/theme/theme-provider";
import { clerkAppearance } from "@/components/theme/clerk-appearance";

type ClerkAppearance = ComponentProps<typeof ClerkProvider>["appearance"];

export function Providers({ children }: { children: React.ReactNode }) {
  return (
    <ClerkProvider appearance={clerkAppearance as ClerkAppearance}>
      <ThemeProvider>{children}</ThemeProvider>
    </ClerkProvider>
  );
}