"use client";

import { ChakraProvider } from "@chakra-ui/react";
import { SessionProvider } from "next-auth/react";
import { ColorModeProvider, type ColorModeProviderProps } from "./color-mode";
import { system } from "../../theme/theme";
import { Toaster } from "./feedback/toaster";
import TopLoader from "./top-loader";
import ReactQueryProvider from "@/provider/react-query-provider";

export function Provider(props: ColorModeProviderProps) {
  return (
    <SessionProvider>
      <ReactQueryProvider>
        <ChakraProvider value={system}>
          <TopLoader />
          <ColorModeProvider {...props} />
          <Toaster />
        </ChakraProvider>
      </ReactQueryProvider>
    </SessionProvider>
  );
}
