import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
import { StrictMode } from "react";
import { createRoot } from "react-dom/client";
import { createConfig, http, WagmiProvider } from "wagmi";
import { baseSepolia } from "wagmi/chains";
import { App } from "./App";
import "./app.css";
import { anvil } from "./config/chains";
import { useBankDashboard } from "./hooks/useBankDashboard";

const wagmiConfig = createConfig({
  chains: [anvil, baseSepolia],
  connectors: [],
  transports: {
    [anvil.id]: http("http://127.0.0.1:8545"),
    [baseSepolia.id]: http("https://sepolia.base.org"),
  },
});
const queryClient = new QueryClient({ defaultOptions: { queries: { retry: false } } });

export function LiveConsole() {
  const dashboard = useBankDashboard();
  return <App dashboard={dashboard} />;
}

createRoot(document.getElementById("root")!).render(
  <StrictMode>
    <WagmiProvider config={wagmiConfig} reconnectOnMount={false}>
      <QueryClientProvider client={queryClient}>
        <LiveConsole />
      </QueryClientProvider>
    </WagmiProvider>
  </StrictMode>,
);