diff --git a/apps/web/src/app/editor/[project_id]/page.tsx b/apps/web/src/app/editor/[project_id]/page.tsx
index f5e64a93..9e3d1b9e 100644
--- a/apps/web/src/app/editor/[project_id]/page.tsx
+++ b/apps/web/src/app/editor/[project_id]/page.tsx
@@ -155,7 +155,6 @@ export default function Editor() {
-
{activePreset === "media" ? (
@@ -429,7 +428,7 @@ export default function Editor() {
minSize={15}
maxSize={40}
onResize={setPropertiesPanel}
- className="min-w-0"
+ className="min-w-0 rounded-sm"
>
diff --git a/apps/web/src/stores/panel-store.ts b/apps/web/src/stores/panel-store.ts
index 0feda0d9..20342fe3 100644
--- a/apps/web/src/stores/panel-store.ts
+++ b/apps/web/src/stores/panel-store.ts
@@ -1,7 +1,11 @@
import { create } from "zustand";
import { persist } from "zustand/middleware";
-export type PanelPreset = "default" | "media" | "inspector" | "vertical-preview";
+export type PanelPreset =
+ | "default"
+ | "media"
+ | "inspector"
+ | "vertical-preview";
interface PanelSizes {
toolsPanel: number;
@@ -56,7 +60,7 @@ interface PanelState extends PanelSizes {
setMainContent: (size: number) => void;
setTimeline: (size: number) => void;
setMediaViewMode: (mode: "grid" | "list") => void;
-
+
// Preset actions
setActivePreset: (preset: PanelPreset) => void;
resetPreset: (preset: PanelPreset) => void;
@@ -80,7 +84,7 @@ export const usePanelStore = create()(
setToolsPanel: (size) => {
const { activePreset, presetCustomSizes } = get();
- set({
+ set({
toolsPanel: size,
presetCustomSizes: {
...presetCustomSizes,
@@ -93,7 +97,7 @@ export const usePanelStore = create()(
},
setPreviewPanel: (size) => {
const { activePreset, presetCustomSizes } = get();
- set({
+ set({
previewPanel: size,
presetCustomSizes: {
...presetCustomSizes,
@@ -106,7 +110,7 @@ export const usePanelStore = create()(
},
setPropertiesPanel: (size) => {
const { activePreset, presetCustomSizes } = get();
- set({
+ set({
propertiesPanel: size,
presetCustomSizes: {
...presetCustomSizes,
@@ -119,7 +123,7 @@ export const usePanelStore = create()(
},
setMainContent: (size) => {
const { activePreset, presetCustomSizes } = get();
- set({
+ set({
mainContent: size,
presetCustomSizes: {
...presetCustomSizes,
@@ -132,7 +136,7 @@ export const usePanelStore = create()(
},
setTimeline: (size) => {
const { activePreset, presetCustomSizes } = get();
- set({
+ set({
timeline: size,
presetCustomSizes: {
...presetCustomSizes,
@@ -144,18 +148,18 @@ export const usePanelStore = create()(
});
},
setMediaViewMode: (mode) => set({ mediaViewMode: mode }),
-
+
setActivePreset: (preset) => {
- const {
- activePreset: currentPreset,
- presetCustomSizes,
- toolsPanel,
- previewPanel,
- propertiesPanel,
- mainContent,
- timeline
+ const {
+ activePreset: currentPreset,
+ presetCustomSizes,
+ toolsPanel,
+ previewPanel,
+ propertiesPanel,
+ mainContent,
+ timeline,
} = get();
-
+
const updatedPresetCustomSizes = {
...presetCustomSizes,
[currentPreset]: {
@@ -166,42 +170,54 @@ export const usePanelStore = create()(
timeline,
},
};
-
+
const defaultSizes = PRESET_CONFIGS[preset];
const customSizes = updatedPresetCustomSizes[preset] || {};
const finalSizes = { ...defaultSizes, ...customSizes };
-
+
set({
activePreset: preset,
presetCustomSizes: updatedPresetCustomSizes,
...finalSizes,
});
},
-
+
resetPreset: (preset) => {
const { presetCustomSizes, activePreset, resetCounter } = get();
const defaultSizes = PRESET_CONFIGS[preset];
-
+
const newPresetCustomSizes = {
...presetCustomSizes,
[preset]: {},
};
-
+
const updates: Partial = {
presetCustomSizes: newPresetCustomSizes,
resetCounter: resetCounter + 1,
};
-
+
if (preset === activePreset) {
Object.assign(updates, defaultSizes);
}
-
+
set(updates);
},
-
+
getCurrentPresetSizes: () => {
- const { toolsPanel, previewPanel, propertiesPanel, mainContent, timeline } = get();
- return { toolsPanel, previewPanel, propertiesPanel, mainContent, timeline };
+ const {
+ toolsPanel,
+ previewPanel,
+ propertiesPanel,
+ mainContent,
+ timeline,
+ } = get();
+ return {
+ toolsPanel,
+ previewPanel,
+ propertiesPanel,
+ mainContent,
+ timeline,
+ };
},
}),
{