estel/dify
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

feat: persist debug-and-preview panel width in localstorage (#21434)

Browse Source
This commit is contained in:
Minamiyama
2025-06-24 20:34:11 +08:00
committed by GitHub
parent c8ebad055c
commit 8ea27bc341
2 changed files with 7 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
web/app/components/workflow/panel/debug-and-preview/index.tsx
View File

@@ -51,8 +51,10 @@ const DebugAndPreview = () => {
const workflowCanvasWidth = useStore(s => s.workflowCanvasWidth) const workflowCanvasWidth = useStore(s => s.workflowCanvasWidth)
const nodePanelWidth = useStore(s => s.nodePanelWidth) const nodePanelWidth = useStore(s => s.nodePanelWidth)
const [panelWidth, setPanelWidth] = useState(400) const panelWidth = useStore(s => s.previewPanelWidth)
const setPanelWidth = useStore(s => s.setPreviewPanelWidth)
const handleResize = useCallback((width: number) => { const handleResize = useCallback((width: number) => {
localStorage.setItem('debug-and-preview-panel-width', `${width}`)
setPanelWidth(width) setPanelWidth(width)
}, [setPanelWidth]) }, [setPanelWidth])
const maxPanelWidth = useMemo(() => { const maxPanelWidth = useMemo(() => {

4
web/app/components/workflow/store/workflow/layout-slice.ts
View File

@@ -10,6 +10,8 @@ export type LayoutSliceShape = {
setRightPanelWidth: (width: number) => void setRightPanelWidth: (width: number) => void
nodePanelWidth: number nodePanelWidth: number
setNodePanelWidth: (width: number) => void setNodePanelWidth: (width: number) => void
previewPanelWidth: number
setPreviewPanelWidth: (width: number) => void
otherPanelWidth: number otherPanelWidth: number
setOtherPanelWidth: (width: number) => void setOtherPanelWidth: (width: number) => void
bottomPanelWidth: number // min-width = 400px; default-width = auto || 480px; bottomPanelWidth: number // min-width = 400px; default-width = auto || 480px;
@@ -31,6 +33,8 @@ export const createLayoutSlice: StateCreator<LayoutSliceShape> = set => ({
setRightPanelWidth: width => set(() => ({ rightPanelWidth: width })), setRightPanelWidth: width => set(() => ({ rightPanelWidth: width })),
nodePanelWidth: localStorage.getItem('workflow-node-panel-width') ? Number.parseFloat(localStorage.getItem('workflow-node-panel-width')!) : 400, nodePanelWidth: localStorage.getItem('workflow-node-panel-width') ? Number.parseFloat(localStorage.getItem('workflow-node-panel-width')!) : 400,
setNodePanelWidth: width => set(() => ({ nodePanelWidth: width })), setNodePanelWidth: width => set(() => ({ nodePanelWidth: width })),
previewPanelWidth: localStorage.getItem('debug-and-preview-panel-width') ? Number.parseFloat(localStorage.getItem('debug-and-preview-panel-width')!) : 400,
setPreviewPanelWidth: width => set(() => ({ previewPanelWidth: width })),
otherPanelWidth: 400, otherPanelWidth: 400,
setOtherPanelWidth: width => set(() => ({ otherPanelWidth: width })), setOtherPanelWidth: width => set(() => ({ otherPanelWidth: width })),
bottomPanelWidth: 480, bottomPanelWidth: 480,