Object(...) is not a function Error calling any hooks

[dobbobalina2]

So I'm new to WAGMI library. I'm having a hard time getting any hooks setup properly.

so here is my setup.

index.js

`const { chains, provider } = configureChains(
  [chain.mainnet, chain.rinkeby],
  [infuraProvider({ infuraId: " id" })]
);
const client = createClient({
  connectors: [new InjectedConnector({ chains })],
  provider,
});
const root = ReactDOM.createRoot(document.getElementById("root"));
root.render(
  <React.StrictMode>
    <WagmiConfig client={client}>
      <App />
    </WagmiConfig>
  </React.StrictMode>
);`

app.js

`xport default function App() {
  const { data: account } = useAccount({
    onError(error) {
      toast(error.message);
      console.log(error);
    },
  });
  const { data: ensName } = useEnsName({ address: account?.address });

  const [{ connect: connect }] = useConnect({
    connector: new InjectedConnector(),
    onError(error) {
      toast(error.message);
      console.log(error);
    },
  });

so this is the code I have.

Here are the erorrs

Uncaught TypeError: Object(...) is not a function points to the connect hook

index.js:1 The above error occurred in the <App> component:

    at App (http://localhost:3000/static/js/main.chunk.js:425:64)
    at QueryClientProvider (http://localhost:3000/static/js/vendors~main.chunk.js:123283:5)
    at WagmiConfig (http://localhost:3000/static/js/vendors~main.chunk.js:149618:5)

and then a few others which I think is mainly from these two.

All of this code is pretty much straight from the example

[dobbobalina2]

I think it was just due to the library soup I had. I transferred the project over to a new folder with no node_modules and minimal package.json and it worked.