Files
Nitro-V3/src/index.tsx
T
simoleo89 a1bee1d825 React 19 modernization: forwardRef removal, Compiler, ErrorBoundary, Suspense, native <script>
Adopt React 19 idioms across the codebase. The runtime was already on
react@19.2.5 but no React 19 APIs were in use.

- forwardRef -> ref-as-prop in 7 layout/component files
  (NitroInput/Button/ItemCountBadge/Card×5/InfiniteGridItem,
  ToolbarItemView, AvatarEditorIcon)
- <Ctx.Provider> -> <Ctx> in 6 contexts (CatalogAdmin, FloorplanEditor,
  UiSettings, GridContext, NitroCardContext, NitroCardAccordionContext)
- Native <script> hoisting for Turnstile, ExternalPluginLoader, GoogleAdsView
  (React 19 dedupes by src; removes manual document.head.appendChild +
  module-level promise caches)
- React Compiler enabled at build time via babel-plugin-react-compiler
  in vite.config.mjs (target: '19'), plus eslint-plugin-react-compiler
  in lint mode
- Global <ErrorBoundary> + <Suspense> in src/index.tsx using
  react-error-boundary, with LoadingView as fallback
- BackgroundsView migrated to use(promise) as a demonstrator pattern
  for Suspense-driven config loading
- ESLint react setting bumped 18.3.1 -> 19.2; legacy
  @typescript-eslint/ban-types replaced with no-restricted-types
  (the old rule was removed in @typescript-eslint v8)
- Refresh public/configuration/{asset-loader,bootstrap}.js to match
  current write-asset-loader.mjs output

Phase 3 (login forms -> useActionState/useFormStatus) deferred:
LoginView is 1623 lines with lockout + Turnstile + heartbeat
interleaving; safer as its own PR.

https://claude.ai/code/session_01GrR87LAqnAEyKG2ZbmQt5Q
2026-05-11 16:31:50 +00:00

59 lines
1.4 KiB
TypeScript

import { Suspense } from 'react';
import { createRoot } from 'react-dom/client';
import { ErrorBoundary } from 'react-error-boundary';
import { App } from './App';
import { LoadingView } from './components/loading/LoadingView';
import './css/index.css';
import './css/backgrounds/BackgroundsView.css';
import './css/chat/Chats.css';
import './css/common/Buttons.css';
import './css/forms/form_select.css';
import './css/friends/FriendsView.css';
import './css/hotelview/HotelView.css';
import './css/login/LoginView.css';
import './css/icons/icons.css';
import './css/layout/LayoutTrophy.css';
import './css/nitrocard/NitroCardView.css';
import './css/notification/NotificationCenterView.css';
import './css/purse/PurseView.css';
import './css/room/InfoStand.css';
import './css/room/NavigatorRoomSettings.css';
import './css/room/RoomWidgets.css';
import './css/slider.css';
import './css/toolbar/ToolBar.css';
import './css/widgets/FurnitureWidgets.css';
createRoot(document.getElementById('root')).render(
<ErrorBoundary
fallbackRender={ ({ error }) => (
<LoadingView
isError={ true }
message={ `Something went wrong.\n${ (error as Error)?.message ?? 'Unknown error' }` }
homeUrl={ window.location.origin + '/' } />
) }>
<Suspense fallback={ <LoadingView message="Loading…" /> }>
<App />
</Suspense>
</ErrorBoundary>
);