main.tsx 2.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566
  1. import {Router, RouterContext} from 'react-router';
  2. import {createBrowserRouter, RouterProvider} from 'react-router-dom';
  3. import {wrapCreateBrowserRouter} from '@sentry/react';
  4. import {ReactQueryDevtools} from '@tanstack/react-query-devtools';
  5. import DemoHeader from 'sentry/components/demo/demoHeader';
  6. import {OnboardingContextProvider} from 'sentry/components/onboarding/onboardingContext';
  7. import {ThemeAndStyleProvider} from 'sentry/components/themeAndStyleProvider';
  8. import {USE_REACT_QUERY_DEVTOOL} from 'sentry/constants';
  9. import {routes, routes6} from 'sentry/routes';
  10. import ConfigStore from 'sentry/stores/configStore';
  11. import {
  12. browserHistory,
  13. DANGEROUS_SET_REACT_ROUTER_6_HISTORY,
  14. } from 'sentry/utils/browserHistory';
  15. import {
  16. DEFAULT_QUERY_CLIENT_CONFIG,
  17. QueryClient,
  18. QueryClientProvider,
  19. } from 'sentry/utils/queryClient';
  20. import {RouteContext} from 'sentry/views/routeContext';
  21. /**
  22. * Renders our compatibility RouteContext.Provider. This will go away with
  23. * react-router v6.
  24. */
  25. function renderRouter(props: any) {
  26. return (
  27. <RouteContext.Provider value={props}>
  28. <RouterContext {...props} />
  29. </RouteContext.Provider>
  30. );
  31. }
  32. const queryClient = new QueryClient(DEFAULT_QUERY_CLIENT_CONFIG);
  33. const sentryCreateBrowserRouter = wrapCreateBrowserRouter(createBrowserRouter);
  34. const router = sentryCreateBrowserRouter(routes6);
  35. if (window.__SENTRY_USING_REACT_ROUTER_SIX) {
  36. DANGEROUS_SET_REACT_ROUTER_6_HISTORY(router);
  37. }
  38. function Main() {
  39. return (
  40. <ThemeAndStyleProvider>
  41. <QueryClientProvider client={queryClient}>
  42. <OnboardingContextProvider>
  43. {ConfigStore.get('demoMode') && <DemoHeader />}
  44. {window.__SENTRY_USING_REACT_ROUTER_SIX ? (
  45. <RouterProvider router={router} />
  46. ) : (
  47. <Router history={browserHistory} render={renderRouter}>
  48. {routes()}
  49. </Router>
  50. )}
  51. </OnboardingContextProvider>
  52. {USE_REACT_QUERY_DEVTOOL && (
  53. <ReactQueryDevtools initialIsOpen={false} position="bottom-left" />
  54. )}
  55. </QueryClientProvider>
  56. </ThemeAndStyleProvider>
  57. );
  58. }
  59. export default Main;