All files / client/src index.tsx

67.74% Statements 21/31
43.75% Branches 7/16
66.66% Functions 4/6
66.66% Lines 20/30

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127                                            360x 360x 360x           360x     360x   360x   360x                     360x             360x 360x           360x               360x                                           1x         360x 360x   360x         360x   360x                               360x 360x    
import { createRoot } from "react-dom/client";
// eslint-disable-next-line @typescript-eslint/no-restricted-imports
import React, { Suspense } from "react";
import ReactDOM from "react-dom";
import { Provider } from "react-redux";
import { ThemeProvider, StyleSheetManager } from "styled-components";
import { init, browserTracingIntegration } from "@sentry/react";
import loaderImage from "assets/loading.gif";
import { config } from "shared/config";
import { getLocalStorageLocale } from "client/utils/localStorage";
import { theme } from "client/theme";
import { GlobalStyle } from "client/globalStyle";
import { setLocale } from "shared/utils/setLocale";
import { ApiEndpoint } from "shared/constants/apiEndpoints";
import { store } from "client/utils/store";
 
// Initialized i18next instance
import "client/utils/i18n";
import { initializeDayjs } from "shared/utils/initializeDayjs";
import { lazyWithRetry } from "client/utils/lazyWithRetry";
import { resetStaleEventStorage } from "client/utils/resetStaleEventStorage";
 
resetStaleEventStorage();
initializeDayjs();
setLocale(getLocalStorageLocale());
 
// The app manages scroll itself on navigation (views reset to the top on
// mount, the program list restores its own saved position), so disable the
// browser's history scroll restoration — WebKit applies it asynchronously on
// back navigation and overrides the app's restore with a stale offset
history.scrollRestoration = "manual";
 
// Root component
const App = lazyWithRetry(async () => await import("client/app/App"));
 
const { enableAxe, enableWhyDidYouRender } = config.client();
 
Iif (enableWhyDidYouRender && process.env.NODE_ENV === "development") {
  void (async () => {
    const { default: whyDidYouRender } =
      await import("@welldone-software/why-did-you-render");
    whyDidYouRender(React, {
      include: [/(.*?)/],
      exclude: [/^FontAwesomeIcon$/, /^Link$/, /^Button$/],
    });
  })();
}
 
Iif (enableAxe && process.env.NODE_ENV === "development") {
  void (async () => {
    const { default: axe } = await import("@axe-core/react");
    await axe(React, ReactDOM, 1000);
  })();
}
 
const getDsn = (): string | undefined => {
  switch (process.env.SETTINGS) {
    case "production":
      return "https://5b75f3722ea14d6d9307f4c736b3b58a@o1321706.ingest.sentry.io/6579203";
    case "staging":
      return "https://446b1c1e5b3048c4bb00b19b74aa55e6@o1321706.ingest.sentry.io/6578391";
    case "development":
      return config.sentry().enableSentryInDev
        ? "https://1fb97a74de6a44e3b16e8d29aeec3363@o1321706.ingest.sentry.io/6579491"
        : undefined;
    default:
      return undefined;
  }
};
 
init({
  dsn: getDsn(),
  integrations: [
    // Use reactRouterV6BrowserTracingIntegration to enable performance monitoring
    // https://docs.sentry.io/platforms/javascript/guides/react/features/react-router/
    browserTracingIntegration(),
  ],
  tracePropagationTargets: ["localhost", "dev.ropekonsti.fi", "ropekonsti.fi"],
  tracesSampleRate: config.sentry().tracesSampleRate,
  normalizeDepth: 10,
  environment: process.env.SETTINGS,
  tunnel: ApiEndpoint.SENTRY_TUNNEL,
  ignoreErrors: [
    // Error when Outlook scans a link
    // https://github.com/getsentry/sentry-javascript/issues/3440
    "Non-Error promise rejection captured with value: Object Not Found Matching Id:",
  ],
  maxValueLength: config.sentry().maxValueLength,
});
 
// Suspend fallback element
const loader = (
  <div style={{ textAlign: "center" }}>
    <img alt="Loading..." src={loaderImage} width="40" />
  </div>
);
 
const render = (): void => {
  const container = document.querySelector("#main");
 
  Iif (!container) {
    // eslint-disable-next-line no-restricted-syntax -- We want to throw here
    throw new Error("Unable to find React root element 'main'");
  }
 
  const root = createRoot(container);
 
  root.render(
    // <React.StrictMode>
    <Provider store={store}>
      <StyleSheetManager enableVendorPrefixes={true}>
        <ThemeProvider theme={theme}>
          <Suspense fallback={loader}>
            <GlobalStyle />
            <App />
          </Suspense>
        </ThemeProvider>
      </StyleSheetManager>
    </Provider>,
    // </React.StrictMode>
  );
};
 
addEventListener("load", () => {
  render();
});