mirror of
https://github.com/overleaf/overleaf.git
synced 2024-10-17 21:05:04 -04:00
c39a566fe3
FileTree for history React IDE page GitOrigin-RevId: 56fadced9f507297ba16dc54715811f36dcfd5b5
48 lines
1.5 KiB
TypeScript
48 lines
1.5 KiB
TypeScript
import React from 'react'
|
|
import { Panel, PanelGroup } from 'react-resizable-panels'
|
|
import { VerticalResizeHandle } from '@/features/ide-react/components/resize/vertical-resize-handle'
|
|
import { FileTree } from '@/features/ide-react/components/file-tree'
|
|
import { useLayoutContext } from '@/shared/context/layout-context'
|
|
import classnames from 'classnames'
|
|
import { FileTreeSelectHandler } from '@/features/ide-react/types/file-tree'
|
|
|
|
type EditorSidebarProps = {
|
|
shouldPersistLayout: boolean
|
|
onFileTreeInit: () => void
|
|
onFileTreeSelect: FileTreeSelectHandler
|
|
}
|
|
|
|
export default function EditorSidebar({
|
|
shouldPersistLayout,
|
|
onFileTreeInit,
|
|
onFileTreeSelect,
|
|
}: EditorSidebarProps) {
|
|
const { view } = useLayoutContext()
|
|
const historyIsOpen = view === 'history'
|
|
|
|
return (
|
|
<>
|
|
<aside
|
|
className={classnames('ide-react-placeholder-editor-sidebar', {
|
|
hide: historyIsOpen,
|
|
})}
|
|
>
|
|
<PanelGroup
|
|
autoSaveId={
|
|
shouldPersistLayout ? 'ide-react-editor-sidebar-layout' : undefined
|
|
}
|
|
direction="vertical"
|
|
>
|
|
<Panel defaultSize={75} className="ide-react-file-tree-panel">
|
|
<FileTree onInit={onFileTreeInit} onSelect={onFileTreeSelect} />
|
|
</Panel>
|
|
<VerticalResizeHandle />
|
|
<Panel defaultSize={25}>
|
|
<div className="outline-container" />
|
|
</Panel>
|
|
</PanelGroup>
|
|
</aside>
|
|
<aside className="ide-react-placeholder-editor-sidebar history-file-tree" />
|
|
</>
|
|
)
|
|
}
|