mirror of
https://github.com/overleaf/overleaf.git
synced 2024-09-16 02:52:31 -04:00
67 lines
2.5 KiB
TypeScript
67 lines
2.5 KiB
TypeScript
import { useConnectionContext } from '@/features/ide-react/context/connection-context'
|
|
import useEventListener from '@/shared/hooks/use-event-listener'
|
|
import { useCallback, useEffect, useState } from 'react'
|
|
import { Alerts } from '@/features/ide-react/components/alerts/alerts'
|
|
import { useLayoutContext } from '@/shared/context/layout-context'
|
|
import PlaceholderChat from '@/features/ide-react/components/layout/placeholder/placeholder-chat'
|
|
import PlaceholderHistory from '@/features/ide-react/components/layout/placeholder/placeholder-history'
|
|
import MainLayout from '@/features/ide-react/components/layout/main-layout'
|
|
import { EditorAndSidebar } from '@/features/ide-react/components/editor-and-sidebar'
|
|
import EditorLeftMenu from '@/features/editor-left-menu/components/editor-left-menu'
|
|
import EditorNavigationToolbar from '@/features/ide-react/components/editor-navigation-toolbar'
|
|
import { useLayoutEventTracking } from '@/features/ide-react/hooks/use-layout-event-tracking'
|
|
import useSocketListeners from '@/features/ide-react/hooks/use-socket-listeners'
|
|
|
|
// This is filled with placeholder content while the real content is migrated
|
|
// away from Angular
|
|
export default function IdePage() {
|
|
useLayoutEventTracking()
|
|
useSocketListeners()
|
|
|
|
const [leftColumnDefaultSize, setLeftColumnDefaultSize] = useState(20)
|
|
const { registerUserActivity } = useConnectionContext()
|
|
|
|
// Inform the connection manager when the user is active
|
|
const listener = useCallback(
|
|
() => registerUserActivity(),
|
|
[registerUserActivity]
|
|
)
|
|
|
|
useEventListener('cursor:editor:update', listener)
|
|
|
|
useEffect(() => {
|
|
document.body.addEventListener('click', listener)
|
|
return () => document.body.removeEventListener('click', listener)
|
|
}, [listener])
|
|
|
|
const { chatIsOpen, view } = useLayoutContext()
|
|
const historyIsOpen = view === 'history'
|
|
|
|
const mainContent = historyIsOpen ? (
|
|
<PlaceholderHistory
|
|
shouldPersistLayout
|
|
leftColumnDefaultSize={leftColumnDefaultSize}
|
|
setLeftColumnDefaultSize={setLeftColumnDefaultSize}
|
|
/>
|
|
) : (
|
|
<EditorAndSidebar
|
|
leftColumnDefaultSize={leftColumnDefaultSize}
|
|
setLeftColumnDefaultSize={setLeftColumnDefaultSize}
|
|
shouldPersistLayout
|
|
/>
|
|
)
|
|
|
|
return (
|
|
<>
|
|
<Alerts />
|
|
<EditorLeftMenu />
|
|
<MainLayout
|
|
headerContent={<EditorNavigationToolbar />}
|
|
chatContent={<PlaceholderChat />}
|
|
mainContent={mainContent}
|
|
chatIsOpen={chatIsOpen}
|
|
shouldPersistLayout
|
|
/>
|
|
</>
|
|
)
|
|
}
|