83 lines
2.3 KiB
TypeScript
83 lines
2.3 KiB
TypeScript
/* eslint-disable react-refresh/only-export-components */
|
|
|
|
import './index.css';
|
|
|
|
import {StrictMode, Suspense} from 'react';
|
|
import {createRoot} from 'react-dom/client';
|
|
|
|
import {FloatingFeedbackEntry} from './components/common/FloatingFeedbackEntry';
|
|
import {getInitialPlatformDesktopLayout} from './components/platform-entry/platformEntryResponsive';
|
|
import {stabilizeMobileViewportKeyboardFocus} from './mobileViewportKeyboardFocus';
|
|
import {lockMobileViewportZoom} from './mobileViewportZoomLock';
|
|
import {
|
|
resolveAppRoute,
|
|
shouldUseRecommendationRouteLoading,
|
|
} from './routing/appRoutes';
|
|
import {RouteImageReadyGate} from './routing/RouteImageReadyGate';
|
|
import {RouteLoadingScreen} from './routing/RouteLoadingScreen';
|
|
import {
|
|
getHostRuntime,
|
|
refreshNativeAppHostRuntime,
|
|
} from './services/host-bridge/hostBridge';
|
|
|
|
type AppRoot = ReturnType<typeof createRoot>;
|
|
|
|
declare global {
|
|
interface Window {
|
|
__tavernRealmsRoot__?: AppRoot;
|
|
}
|
|
}
|
|
|
|
const route = resolveAppRoute(window.location.pathname);
|
|
const rootElement = document.getElementById('root');
|
|
|
|
if (!rootElement) {
|
|
throw new Error('Missing #root container');
|
|
}
|
|
|
|
function markWechatMiniProgramRuntime() {
|
|
if (getHostRuntime().kind === 'wechat_mini_program') {
|
|
document.documentElement.dataset.wechatMiniProgramRuntime = 'true';
|
|
}
|
|
}
|
|
|
|
const root = window.__tavernRealmsRoot__ ??= createRoot(rootElement);
|
|
const RouteComponent = route.Component;
|
|
const routeElement = <RouteComponent {...(route.componentProps ?? {})} />;
|
|
const shouldGateRouteImages = shouldUseRecommendationRouteLoading(
|
|
window.location.pathname,
|
|
getInitialPlatformDesktopLayout(),
|
|
);
|
|
|
|
lockMobileViewportZoom();
|
|
stabilizeMobileViewportKeyboardFocus();
|
|
markWechatMiniProgramRuntime();
|
|
void refreshNativeAppHostRuntime();
|
|
|
|
root.render(
|
|
<StrictMode>
|
|
<Suspense
|
|
fallback={
|
|
shouldGateRouteImages ? (
|
|
<RouteLoadingScreen
|
|
eyebrow={route.loadingEyebrow}
|
|
text={route.loadingText}
|
|
/>
|
|
) : null
|
|
}
|
|
>
|
|
{shouldGateRouteImages ? (
|
|
<RouteImageReadyGate
|
|
eyebrow={route.loadingEyebrow}
|
|
text={route.loadingText}
|
|
>
|
|
{routeElement}
|
|
</RouteImageReadyGate>
|
|
) : (
|
|
routeElement
|
|
)}
|
|
</Suspense>
|
|
<FloatingFeedbackEntry />
|
|
</StrictMode>,
|
|
);
|