* 🐛fix: default show 3 dots * ✨enhancement: enable resizable left panel (#5713) * ✨enhancement: enable resizable left panel * Update web-app/src/hooks/useLeftPanel.ts Co-authored-by: ellipsis-dev[bot] <65095814+ellipsis-dev[bot]@users.noreply.github.com> --------- Co-authored-by: ellipsis-dev[bot] <65095814+ellipsis-dev[bot]@users.noreply.github.com> --------- Co-authored-by: ellipsis-dev[bot] <65095814+ellipsis-dev[bot]@users.noreply.github.com>
26 lines
677 B
TypeScript
26 lines
677 B
TypeScript
import { create } from 'zustand'
|
|
import { persist, createJSONStorage } from 'zustand/middleware'
|
|
import { localStorageKey } from '@/constants/localStorage'
|
|
|
|
type LeftPanelStoreState = {
|
|
open: boolean
|
|
size: number
|
|
setLeftPanel: (value: boolean) => void
|
|
setLeftPanelSize: (value: number) => void
|
|
}
|
|
|
|
export const useLeftPanel = create<LeftPanelStoreState>()(
|
|
persist(
|
|
(set) => ({
|
|
open: true,
|
|
size: 20, // Default size of 20%
|
|
setLeftPanel: (value) => set({ open: value }),
|
|
setLeftPanelSize: (value) => set({ size: value }),
|
|
}),
|
|
{
|
|
name: localStorageKey.LeftPanel,
|
|
storage: createJSONStorage(() => localStorage),
|
|
}
|
|
)
|
|
)
|