Merge branch 'main' into implement-workflows

1 files changed, 12 insertions, 50 deletions

diff --git a/apps/web/src/stores/panel-store.ts b/apps/web/src/stores/panel-store.ts
index ea2dacb9..7706417a 100644
--- a/apps/web/src/stores/panel-store.ts
+++ b/apps/web/src/stores/panel-store.ts
@@ -2,78 +2,40 @@ import { create } from "zustand";
 import { persist } from "zustand/middleware";

 

 interface PanelState {

-  // Horizontal panel sizes

+  // Panel sizes as percentages

   toolsPanel: number;

   previewPanel: number;

   propertiesPanel: number;

-

-  // Vertical panel sizes

   mainContent: number;

   timeline: number;

 

-  // Flag to prevent initial overwrites

-  isInitialized: boolean;

-

   // Actions

   setToolsPanel: (size: number) => void;

   setPreviewPanel: (size: number) => void;

   setPropertiesPanel: (size: number) => void;

   setMainContent: (size: number) => void;

   setTimeline: (size: number) => void;

-  setInitialized: () => void;

 }

 

 export const usePanelStore = create<PanelState>()(

   persist(

-    (set, get) => ({

-      // Default sizes

-      toolsPanel: 20,

-      previewPanel: 60,

+    (set) => ({

+      // Default sizes - optimized for responsiveness

+      toolsPanel: 25,

+      previewPanel: 75,

       propertiesPanel: 20,

-      mainContent: 50,

-      timeline: 50,

-      isInitialized: false,

+      mainContent: 70,

+      timeline: 30,

 

       // Actions

-      setToolsPanel: (size) => {

-        const state = get();

-        if (!state.isInitialized) return;

-        set({ toolsPanel: size });

-      },

-      setPreviewPanel: (size) => {

-        const state = get();

-        if (!state.isInitialized) return;

-        set({ previewPanel: size });

-      },

-      setPropertiesPanel: (size) => {

-        const state = get();

-        if (!state.isInitialized) return;

-        set({ propertiesPanel: size });

-      },

-      setMainContent: (size) => {

-        const state = get();

-        if (!state.isInitialized) return;

-        set({ mainContent: size });

-      },

-      setTimeline: (size) => {

-        const state = get();

-        if (!state.isInitialized) return;

-        set({ timeline: size });

-      },

-      setInitialized: () => {

-        console.log("Panel store initialized for resize events");

-        set({ isInitialized: true });

-      },

+      setToolsPanel: (size) => set({ toolsPanel: size }),

+      setPreviewPanel: (size) => set({ previewPanel: size }),

+      setPropertiesPanel: (size) => set({ propertiesPanel: size }),

+      setMainContent: (size) => set({ mainContent: size }),

+      setTimeline: (size) => set({ timeline: size }),

     }),

     {

       name: "panel-sizes",

-      partialize: (state) => ({

-        toolsPanel: state.toolsPanel,

-        previewPanel: state.previewPanel,

-        propertiesPanel: state.propertiesPanel,

-        mainContent: state.mainContent,

-        timeline: state.timeline,

-      }),

     }

   )

 );