React IDE page shell (#14988)

* React IDE page shell

* Set the maximum height of the symbol palette to 336px

* Tidy export

* Remove unnecessary destructuring

* Update comment

* Optimize toggle

Co-authored-by: Alf Eaton <alf.eaton@overleaf.com>

* Change snap-to-collapse threshold to 5%

* Synchronize left column width between history and editor views and remove duplication in ide-page

* Replace resizer dots with SVG

* Rermove unnecessary import and comment the remaining ones

* Use block prepend to avoid duplication

* Improve vertical content divider styling

* Implement fixed width during container resize on left column

* Change IDE page file extension

* Refactor fixed-size panel into a hook and use for chat panel

---------

Co-authored-by: Alf Eaton <alf.eaton@overleaf.com>
GitOrigin-RevId: aa881e48a2838a192b6f8f9e16e561f5cd706bd3

services/web/frontend/js/features/ide-react/components/ide-root.tsx

@@ -0,0 +1,22 @@
+import useWaitForI18n from '@/shared/hooks/use-wait-for-i18n'
+import { GenericErrorBoundaryFallback } from '@/shared/components/generic-error-boundary-fallback'
+import withErrorBoundary from '@/infrastructure/error-boundary'
+import IdePage from '@/features/ide-react/components/layout/ide-page'
+
+function IdeRoot() {
+  // Check that we haven't inadvertently loaded Angular
+  // TODO: Remove this before rolling out this component to any users
+  if (typeof window.angular !== 'undefined') {
+    throw new Error('Angular detected. This page must not load Angular.')
+  }
+
+  const { isReady } = useWaitForI18n()
+
+  if (!isReady) {
+    return null
+  }
+
+  return <IdePage />
+}
+
+export default withErrorBoundary(IdeRoot, GenericErrorBoundaryFallback)