44 lines
1.2 KiB
TypeScript
44 lines
1.2 KiB
TypeScript
import { CacheProvider } from "@emotion/react";
|
|
import { ClientStyleContext } from "./context.js";
|
|
import createEmotionCache from "./createEmotionCache.js";
|
|
import { hydrateRoot } from "react-dom/client";
|
|
import { Integrations } from "@sentry/tracing";
|
|
import { RemixBrowser } from "@remix-run/react";
|
|
import * as Sentry from "@sentry/react";
|
|
import { type ReactNode, StrictMode, useState } from "react";
|
|
|
|
Sentry.init({
|
|
dsn:
|
|
document.querySelector("meta[name='dsn']")?.getAttribute("content") ??
|
|
undefined,
|
|
integrations: [new Integrations.BrowserTracing()],
|
|
tracesSampleRate: 0.1,
|
|
});
|
|
|
|
function ClientCacheProvider({ children }: { children: ReactNode }) {
|
|
const nonce =
|
|
document
|
|
.querySelector("meta[name='style-nonce']")
|
|
?.getAttribute("content") || undefined;
|
|
const [cache, setCache] = useState(createEmotionCache(nonce));
|
|
|
|
function reset() {
|
|
setCache(createEmotionCache(nonce));
|
|
}
|
|
|
|
return (
|
|
<ClientStyleContext.Provider value={{ reset }}>
|
|
<CacheProvider value={cache}>{children}</CacheProvider>
|
|
</ClientStyleContext.Provider>
|
|
);
|
|
}
|
|
|
|
hydrateRoot(
|
|
document,
|
|
<StrictMode>
|
|
<ClientCacheProvider>
|
|
<RemixBrowser />
|
|
</ClientCacheProvider>
|
|
</StrictMode>
|
|
);
|