aidenybai / react-scan

Scan for React performance issues and eliminate slow renders in your app
https://react-scan.million.dev
MIT License
5.88k stars 64 forks source link

Error: No QueryClient set, use QueryClientProvider to set one #7

Open jhanstra opened 1 week ago

jhanstra commented 1 week ago

No idea why this happens, but when I tried to implement react-scan in my React Native / Expo project, I get this error in reference to @tanstack/react-query set-up. When I remove the scan() method from the _layout file, the error goes away. Strange. Appreciate your work on this and excited to use it in the future!

Error: No QueryClient set, use QueryClientProvider to set one

My _layout file looks like this:

import { scan } from "react-scan";
import React, { useEffect, useState } from "react";

scan({
  enabled: process.env.NODE_ENV === "development",
  log: true, // logs render info to console (default: false)
  clearLog: false, // clears the console per group of renders (default: false)
});

export const Providers = () => {
  const [queryClient] = useState(
    () => new QueryClient(DEFAULT_QUERY_CLIENT_OPTIONS),
  );

  return (
    <ConfigProvider config={{ ...config, supabase, nanoid }}>
      <StatusBar style="dark" />
      <QueryClientProvider client={queryClient}>
        {...more providers and the main UI layout}
      </QueryClientProvider>
    </ConfigProvider>
  );
};

export default Sentry.wrap(Providers);
aidenybai commented 1 week ago

@jhanstra we don't support RN yet!

0xFA11 commented 5 days ago

@aidenybai are you planning to support React Native some time in the future?

also, if you attempted to support, what were main issues/blockers? it'd be good to know if somebody were to consider contributing towards React Native support :)