format

1 files changed, 111 insertions, 111 deletions

diff --git a/apps/web/src/app/editor/[project_id]/page.tsx b/apps/web/src/app/editor/[project_id]/page.tsx
index aa5b7315..6c7186bc 100644
--- a/apps/web/src/app/editor/[project_id]/page.tsx
+++ b/apps/web/src/app/editor/[project_id]/page.tsx
@@ -3,9 +3,9 @@
 import { useEffect, useRef, useState } from "react";
 import { useParams, useRouter } from "next/navigation";
 import {
-  ResizablePanelGroup,
-  ResizablePanel,
-  ResizableHandle,
+	ResizablePanelGroup,
+	ResizablePanel,
+	ResizableHandle,
 } from "../../../components/ui/resizable";
 import { MediaPanel } from "../../../components/editor/media-panel";
 import { PropertiesPanel } from "../../../components/editor/properties-panel";
@@ -19,127 +19,127 @@ import { usePlaybackControls } from "@/hooks/use-playback-controls";
 import { Onboarding } from "@/components/onboarding";
 
 export default function Editor() {
-  const {
-    toolsPanel,
-    previewPanel,
-    mainContent,
-    timeline,
-    setToolsPanel,
-    setPreviewPanel,
-    setMainContent,
-    setTimeline,
-    propertiesPanel,
-    setPropertiesPanel,
-  } = usePanelStore();
+	const {
+		toolsPanel,
+		previewPanel,
+		mainContent,
+		timeline,
+		setToolsPanel,
+		setPreviewPanel,
+		setMainContent,
+		setTimeline,
+		propertiesPanel,
+		setPropertiesPanel,
+	} = usePanelStore();
 
-  const { activeProject, loadProject, createNewProject } = useProjectStore();
-  const params = useParams();
-  const router = useRouter();
-  const projectId = params.project_id as string;
-  const handledProjectIds = useRef<Set<string>>(new Set());
-  const [isOnboardingOpen, setIsOnboardingOpen] = useState(true);
+	const { activeProject, loadProject, createNewProject } = useProjectStore();
+	const params = useParams();
+	const router = useRouter();
+	const projectId = params.project_id as string;
+	const handledProjectIds = useRef<Set<string>>(new Set());
+	const [isOnboardingOpen, setIsOnboardingOpen] = useState(true);
 
-  usePlaybackControls();
+	usePlaybackControls();
 
-  useEffect(() => {
-    const initProject = async () => {
-      if (!projectId) return;
+	useEffect(() => {
+		const initProject = async () => {
+			if (!projectId) return;
 
-      if (activeProject?.id === projectId) {
-        return;
-      }
+			if (activeProject?.id === projectId) {
+				return;
+			}
 
-      if (handledProjectIds.current.has(projectId)) {
-        return;
-      }
+			if (handledProjectIds.current.has(projectId)) {
+				return;
+			}
 
-      try {
-        await loadProject(projectId);
-      } catch (error) {
-        handledProjectIds.current.add(projectId);
+			try {
+				await loadProject(projectId);
+			} catch (error) {
+				handledProjectIds.current.add(projectId);
 
-        const newProjectId = await createNewProject("Untitled Project");
-        router.replace(`/editor/${newProjectId}`);
-        return;
-      }
-    };
+				const newProjectId = await createNewProject("Untitled Project");
+				router.replace(`/editor/${newProjectId}`);
+				return;
+			}
+		};
 
-    initProject();
-  }, [projectId, activeProject?.id, loadProject, createNewProject, router]);
+		initProject();
+	}, [projectId, activeProject?.id, loadProject, createNewProject, router]);
 
-  return (
-    <EditorProvider>
-      <div className="h-screen w-screen flex flex-col bg-background overflow-hidden">
-        <EditorHeader />
-        <div className="flex-1 min-h-0 min-w-0">
-          <ResizablePanelGroup
-            direction="vertical"
-            className="h-full w-full gap-[0.18rem]"
-          >
-            <ResizablePanel
-              defaultSize={mainContent}
-              minSize={30}
-              maxSize={85}
-              onResize={setMainContent}
-              className="min-h-0"
-            >
-              {/* Main content area */}
-              <ResizablePanelGroup
-                direction="horizontal"
-                className="h-full w-full gap-[0.19rem] px-2"
-              >
-                {/* Tools Panel */}
-                <ResizablePanel
-                  defaultSize={toolsPanel}
-                  minSize={15}
-                  maxSize={40}
-                  onResize={setToolsPanel}
-                  className="min-w-0"
-                >
-                  <MediaPanel />
-                </ResizablePanel>
+	return (
+		<EditorProvider>
+			<div className="h-screen w-screen flex flex-col bg-background overflow-hidden">
+				<EditorHeader />
+				<div className="flex-1 min-h-0 min-w-0">
+					<ResizablePanelGroup
+						direction="vertical"
+						className="h-full w-full gap-[0.18rem]"
+					>
+						<ResizablePanel
+							defaultSize={mainContent}
+							minSize={30}
+							maxSize={85}
+							onResize={setMainContent}
+							className="min-h-0"
+						>
+							{/* Main content area */}
+							<ResizablePanelGroup
+								direction="horizontal"
+								className="h-full w-full gap-[0.19rem] px-2"
+							>
+								{/* Tools Panel */}
+								<ResizablePanel
+									defaultSize={toolsPanel}
+									minSize={15}
+									maxSize={40}
+									onResize={setToolsPanel}
+									className="min-w-0"
+								>
+									<MediaPanel />
+								</ResizablePanel>
 
-                <ResizableHandle withHandle />
+								<ResizableHandle withHandle />
 
-                {/* Preview Area */}
-                <ResizablePanel
-                  defaultSize={previewPanel}
-                  minSize={30}
-                  onResize={setPreviewPanel}
-                  className="min-w-0 min-h-0 flex-1"
-                >
-                  <PreviewPanel />
-                </ResizablePanel>
+								{/* Preview Area */}
+								<ResizablePanel
+									defaultSize={previewPanel}
+									minSize={30}
+									onResize={setPreviewPanel}
+									className="min-w-0 min-h-0 flex-1"
+								>
+									<PreviewPanel />
+								</ResizablePanel>
 
-                <ResizableHandle withHandle />
+								<ResizableHandle withHandle />
 
-                <ResizablePanel
-                  defaultSize={propertiesPanel}
-                  minSize={15}
-                  maxSize={40}
-                  onResize={setPropertiesPanel}
-                  className="min-w-0"
-                >
-                  <PropertiesPanel />
-                </ResizablePanel>
-              </ResizablePanelGroup>
-            </ResizablePanel>
+								<ResizablePanel
+									defaultSize={propertiesPanel}
+									minSize={15}
+									maxSize={40}
+									onResize={setPropertiesPanel}
+									className="min-w-0"
+								>
+									<PropertiesPanel />
+								</ResizablePanel>
+							</ResizablePanelGroup>
+						</ResizablePanel>
 
-            <ResizableHandle withHandle />
+						<ResizableHandle withHandle />
 
-            {/* Timeline */}
-            <ResizablePanel
-              defaultSize={timeline}
-              minSize={15}
-              maxSize={70}
-              onResize={setTimeline}
-              className="min-h-0 px-2 pb-2"
-            >
-              <Timeline />
-            </ResizablePanel>
-          </ResizablePanelGroup>
-        </div>
-      </div>
-    </EditorProvider>
-  );
+						{/* Timeline */}
+						<ResizablePanel
+							defaultSize={timeline}
+							minSize={15}
+							maxSize={70}
+							onResize={setTimeline}
+							className="min-h-0 px-2 pb-2"
+						>
+							<Timeline />
+						</ResizablePanel>
+					</ResizablePanelGroup>
+				</div>
+			</div>
+		</EditorProvider>
+	);
 }