import { create } from 'zustand'

export type ActivityView = 'explorer' | 'search' | 'extensions' | 'settings'

interface LayoutState {
  activeView: ActivityView | null
  sidePanelVisible: boolean
  sidePanelWidth: number
  setActiveView: (view: ActivityView | null) => void
  toggleSidePanel: () => void
  showSidePanel: () => void
  hideSidePanel: () => void
  setSidePanelWidth: (width: number) => void
}

const SIDEPANEL_MIN = 180
const SIDEPANEL_MAX = 500
const SIDEPANEL_DEFAULT = 240

export const useLayoutStore = create<LayoutState>((set, get) => ({
  activeView: 'explorer',
  sidePanelVisible: true,
  sidePanelWidth: SIDEPANEL_DEFAULT,

  setActiveView: (view: ActivityView | null) => {
    const { activeView, hideSidePanel, showSidePanel } = get()
    if (activeView === view) {
      hideSidePanel()
      set({ activeView: null })
    } else {
      set({ activeView: view })
      showSidePanel()
    }
  },

  toggleSidePanel: () => {
    set((s) => ({ sidePanelVisible: !s.sidePanelVisible }))
  },

  showSidePanel: () => {
    set({ sidePanelVisible: true })
  },

  hideSidePanel: () => {
    set({ sidePanelVisible: false })
  },

  setSidePanelWidth: (width: number) => {
    set({ sidePanelWidth: Math.max(SIDEPANEL_MIN, Math.min(SIDEPANEL_MAX, width)) })
  },
}))