mirror of
https://github.com/yu-i-i/overleaf-cep.git
synced 2026-05-23 17:19:37 +02:00
1b4cbd4efb
* Improve landmarks for the Project Dasbhboard * Improve landmarks for the IDE page * Improve landmarks for the new redesigned IDE page * Sort locales * Fix typo OlButtonToolbar -> OLButtonToolbar * Update project navbar translation * Update labels * Redundant main landmark * Fix failing test * Descriptive name for the rails tab * Header should not be in a button * Update translation to Account and help * Update translation to Project categories and tags * Add explanations GitOrigin-RevId: 96712b37bb1306b552de510d9fd8ae890f24309f
61 lines
1.9 KiB
TypeScript
61 lines
1.9 KiB
TypeScript
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 classNames from 'classnames'
|
|
import { useLayoutContext } from '@/shared/context/layout-context'
|
|
import { OutlineContainer } from '@/features/outline/components/outline-container'
|
|
import { useOutlinePane } from '@/features/ide-react/hooks/use-outline-pane'
|
|
import React, { ElementType } from 'react'
|
|
import importOverleafModules from '../../../../macros/import-overleaf-module.macro'
|
|
import { t } from 'i18next'
|
|
|
|
const editorSidebarComponents = importOverleafModules(
|
|
'editorSidebarComponents'
|
|
) as { import: { default: ElementType }; path: string }[]
|
|
|
|
export default function EditorSidebar() {
|
|
const { view } = useLayoutContext()
|
|
|
|
const { outlineEnabled, outlinePanelRef } = useOutlinePane()
|
|
|
|
return (
|
|
<nav
|
|
className={classNames('ide-react-editor-sidebar', {
|
|
hidden: view === 'history',
|
|
})}
|
|
aria-label={t('project_files_outline')}
|
|
>
|
|
{editorSidebarComponents.map(
|
|
({ import: { default: Component }, path }) => (
|
|
<Component key={path} />
|
|
)
|
|
)}
|
|
<PanelGroup autoSaveId="ide-editor-sidebar-layout" direction="vertical">
|
|
<Panel
|
|
defaultSize={50}
|
|
minSize={25}
|
|
className="ide-react-file-tree-panel"
|
|
id="panel-file-tree"
|
|
order={1}
|
|
>
|
|
<FileTree />
|
|
</Panel>
|
|
|
|
<VerticalResizeHandle disabled={!outlineEnabled} />
|
|
|
|
<Panel
|
|
defaultSize={50}
|
|
maxSize={75}
|
|
id="panel-outline"
|
|
order={2}
|
|
collapsible
|
|
ref={outlinePanelRef}
|
|
style={{ minHeight: 32 }} // keep the header visible
|
|
>
|
|
<OutlineContainer />
|
|
</Panel>
|
|
</PanelGroup>
|
|
</nav>
|
|
)
|
|
}
|