import "@/styles/globals.css";
import { ChakraProvider } from "@chakra-ui/react";
import { QueryParamProvider } from "use-query-params";
import { NextAdapter } from "next-query-params";
import { theme } from "@/components/theme";

export default function App({ Component, pageProps }) {
  const Adapter = (props) => <NextAdapter {...props} shallow={true} />;

  return (
    <ChakraProvider theme={theme}>
      <QueryParamProvider adapter={Adapter} options={{ enableBatching: true }}>
        <QueryParamProvider>
          <Component {...pageProps} />
        </QueryParamProvider>
      </QueryParamProvider>
    </ChakraProvider>
  );
}