Files
outline/app/index.tsx
忽如寄 9f400af73b refactor: ♻️ refactor isHosted && type clean up (#3290)
* refactor: ♻️ refactor isHosted && type clean up

Change-Id: I4dfbad8a07607432801de78920ce42bf81e46498

* refactor: ♻️ code clean up

Change-Id: I8f487a33d332a2acaff84397a97371b56ace28a1

* feat: 💄 lint

Change-Id: I776b1a5e249bdb542f8e6da7cb2277821cf91094

* feat:  ci type

Change-Id: I486dde7bf60321238e9a394c40ad8cdb8bfc54c8

* feat: some code sugession

Change-Id: I4761d057344b95a98e99068d312a42292977875b
2022-03-27 15:18:37 -07:00

113 lines
3.2 KiB
TypeScript

import "focus-visible";
import { LazyMotion } from "framer-motion";
import { KBarProvider } from "kbar";
import { Provider } from "mobx-react";
import * as React from "react";
import { render } from "react-dom";
import { Router } from "react-router-dom";
import { initI18n } from "@shared/i18n";
import stores from "~/stores";
import Analytics from "~/components/Analytics";
import Dialogs from "~/components/Dialogs";
import ErrorBoundary from "~/components/ErrorBoundary";
import PageTheme from "~/components/PageTheme";
import ScrollToTop from "~/components/ScrollToTop";
import Theme from "~/components/Theme";
import Toasts from "~/components/Toasts";
import env from "~/env";
import Routes from "./routes";
import history from "./utils/history";
import { initSentry } from "./utils/sentry";
initI18n();
const element = window.document.getElementById("root");
if (env.SENTRY_DSN) {
initSentry(history);
}
if ("serviceWorker" in window.navigator) {
window.addEventListener("load", () => {
// see: https://bugs.chromium.org/p/chromium/issues/detail?id=1097616
// In some rare (<0.1% of cases) this call can return `undefined`
const maybePromise = window.navigator.serviceWorker.register(
"/static/service-worker.js",
{
scope: "/",
}
);
if (maybePromise?.then) {
maybePromise
.then((registration) => {
console.log("SW registered: ", registration);
})
.catch((registrationError) => {
console.log("SW registration failed: ", registrationError);
});
}
});
}
// Make sure to return the specific export containing the feature bundle.
const loadFeatures = () => import("./utils/motion").then((res) => res.default);
const commandBarOptions = {
animations: {
enterMs: 250,
exitMs: 200,
},
callbacks: {
onClose: () => stores.ui.commandBarClosed(),
},
};
if (element) {
const App = () => (
<React.StrictMode>
<Provider {...stores}>
<Analytics>
<Theme>
<ErrorBoundary>
<KBarProvider actions={[]} options={commandBarOptions}>
<LazyMotion features={loadFeatures}>
<Router history={history}>
<>
<PageTheme />
<ScrollToTop>
<Routes />
</ScrollToTop>
<Toasts />
<Dialogs />
</>
</Router>
</LazyMotion>
</KBarProvider>
</ErrorBoundary>
</Theme>
</Analytics>
</Provider>
</React.StrictMode>
);
render(<App />, element);
}
window.addEventListener("load", async () => {
// installation does not use Google Analytics, or tracking is blocked on client
// no point loading the rest of the analytics bundles
if (!env.GOOGLE_ANALYTICS_ID || !window.ga) {
return;
}
// https://github.com/googleanalytics/autotrack/issues/137#issuecomment-305890099
await import(
/* webpackChunkName: "autotrack" */
"autotrack/autotrack.js"
);
window.ga("require", "outboundLinkTracker");
window.ga("require", "urlChangeTracker");
window.ga("require", "eventTracker", {
attributePrefix: "data-",
});
});