mirror of
https://github.com/langgenius/dify.git
synced 2026-02-27 03:45:09 +00:00
The sidebar layout was broken when ArtifactsSection expanded - it would squeeze the FileTree and neither area could scroll. This restructures the layout so each section has its own scroll container with proper height constraints.
50 lines
1.4 KiB
TypeScript
50 lines
1.4 KiB
TypeScript
'use client'
|
|
|
|
import type { FC } from 'react'
|
|
import * as React from 'react'
|
|
import { useStore as useAppStore } from '@/app/components/app/store'
|
|
import ContentArea from './content-area'
|
|
import ContentBody from './content-body'
|
|
import FileContentPanel from './file-content-panel'
|
|
import FileTabs from './file-tabs'
|
|
import FileTree from './file-tree'
|
|
import ArtifactsSection from './file-tree/artifacts-section'
|
|
import { useSkillAutoSave } from './hooks/use-skill-auto-save'
|
|
import { SkillSaveProvider } from './hooks/use-skill-save-manager'
|
|
import Sidebar from './sidebar'
|
|
import SidebarSearchAdd from './sidebar-search-add'
|
|
import SkillPageLayout from './skill-page-layout'
|
|
|
|
const SkillAutoSaveManager: FC = () => {
|
|
useSkillAutoSave()
|
|
return null
|
|
}
|
|
|
|
const SkillMain: FC = () => {
|
|
const appDetail = useAppStore(s => s.appDetail)
|
|
const appId = appDetail?.id || ''
|
|
|
|
return (
|
|
<div className="h-full bg-workflow-canvas-workflow-top-bar-1 pl-3 pt-[52px]">
|
|
<SkillSaveProvider appId={appId}>
|
|
<SkillAutoSaveManager />
|
|
<SkillPageLayout>
|
|
<Sidebar>
|
|
<SidebarSearchAdd />
|
|
<FileTree />
|
|
<ArtifactsSection />
|
|
</Sidebar>
|
|
<ContentArea>
|
|
<FileTabs />
|
|
<ContentBody>
|
|
<FileContentPanel />
|
|
</ContentBody>
|
|
</ContentArea>
|
|
</SkillPageLayout>
|
|
</SkillSaveProvider>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default React.memo(SkillMain)
|