xstefen/OpenCut
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

rename app provider to editor provider and add it to the editor instead

Browse Source
This commit is contained in:
Maze Winther
2025-06-22 13:08:37 +02:00
parent be97024868
commit 6b77e83ca0
4 changed files with 59 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files

99
apps/web/src/app/editor/page.tsx
View File

@ -13,6 +13,7 @@ import { PreviewPanel } from "../../components/editor/preview-panel";
import { EditorHeader } from "@/components/editor-header"; import { EditorHeader } from "@/components/editor-header";
import { usePanelStore } from "@/stores/panel-store"; import { usePanelStore } from "@/stores/panel-store";
import { useProjectStore } from "@/stores/project-store"; import { useProjectStore } from "@/stores/project-store";
import { EditorProvider } from "@/components/editor-provider";
export default function Editor() { export default function Editor() {
const { const {
@ -38,59 +39,61 @@ export default function Editor() {
}, [activeProject, createNewProject]); }, [activeProject, createNewProject]);
return ( return (
<div className="h-screen w-screen flex flex-col bg-background"> <EditorProvider>
<EditorHeader /> <div className="h-screen w-screen flex flex-col bg-background">
<ResizablePanelGroup direction="vertical"> <EditorHeader />
<ResizablePanel <ResizablePanelGroup direction="vertical">
defaultSize={mainContent} <ResizablePanel
minSize={30} defaultSize={mainContent}
onResize={setMainContent} minSize={30}
> onResize={setMainContent}
{/* Main content area */} >
<ResizablePanelGroup direction="horizontal"> {/* Main content area */}
{/* Tools Panel */} <ResizablePanelGroup direction="horizontal">
<ResizablePanel {/* Tools Panel */}
defaultSize={toolsPanel} <ResizablePanel
minSize={15} defaultSize={toolsPanel}
onResize={setToolsPanel} minSize={15}
> onResize={setToolsPanel}
<MediaPanel /> >
</ResizablePanel> <MediaPanel />
</ResizablePanel>
<ResizableHandle withHandle /> <ResizableHandle withHandle />
{/* Preview Area */} {/* Preview Area */}
<ResizablePanel <ResizablePanel
defaultSize={previewPanel} defaultSize={previewPanel}
onResize={setPreviewPanel} onResize={setPreviewPanel}
> >
<PreviewPanel /> <PreviewPanel />
</ResizablePanel> </ResizablePanel>
<ResizableHandle withHandle /> <ResizableHandle withHandle />
{/* Properties Panel */} {/* Properties Panel */}
<ResizablePanel <ResizablePanel
defaultSize={propertiesPanel} defaultSize={propertiesPanel}
minSize={15} minSize={15}
onResize={setPropertiesPanel} onResize={setPropertiesPanel}
> >
<PropertiesPanel /> <PropertiesPanel />
</ResizablePanel> </ResizablePanel>
</ResizablePanelGroup> </ResizablePanelGroup>
</ResizablePanel> </ResizablePanel>
<ResizableHandle withHandle /> <ResizableHandle withHandle />
{/* Timeline */} {/* Timeline */}
<ResizablePanel <ResizablePanel
defaultSize={timeline} defaultSize={timeline}
minSize={15} minSize={15}
onResize={setTimeline} onResize={setTimeline}
> >
<Timeline /> <Timeline />
</ResizablePanel> </ResizablePanel>
</ResizablePanelGroup> </ResizablePanelGroup>
</div> </div>
</EditorProvider>
); );
} }

13
apps/web/src/app/layout.tsx
View File

@ -5,7 +5,6 @@ import { Analytics } from "@vercel/analytics/react";
import "./globals.css"; import "./globals.css";
import { Toaster } from "../components/ui/sonner"; import { Toaster } from "../components/ui/sonner";
import { TooltipProvider } from "../components/ui/tooltip"; import { TooltipProvider } from "../components/ui/tooltip";
import { AppProvider } from "@/components/app-provider";
const inter = Inter({ const inter = Inter({
subsets: ["latin"], subsets: ["latin"],
@ -26,13 +25,11 @@ export default function RootLayout({
<html lang="en" suppressHydrationWarning> <html lang="en" suppressHydrationWarning>
<body className={`${inter.variable} font-sans antialiased`}> <body className={`${inter.variable} font-sans antialiased`}>
<ThemeProvider attribute="class" forcedTheme="dark" enableSystem> <ThemeProvider attribute="class" forcedTheme="dark" enableSystem>
<AppProvider> <TooltipProvider>
<TooltipProvider> {children}
{children} <Analytics />
<Analytics /> <Toaster />
<Toaster /> </TooltipProvider>
</TooltipProvider>
</AppProvider>
</ThemeProvider> </ThemeProvider>
</body> </body>
</html> </html>

6
apps/web/src/components/app-provider.tsx → apps/web/src/components/editor-provider.tsx
View File

@ -2,14 +2,14 @@
import { useEffect } from "react"; import { useEffect } from "react";
import { Loader2 } from "lucide-react"; import { Loader2 } from "lucide-react";
import { useAppStore } from "@/stores/app-store"; import { useAppStore } from "@/stores/editor-store";
import { usePanelStore } from "@/stores/panel-store"; import { usePanelStore } from "@/stores/panel-store";
interface AppProviderProps { interface EditorProviderProps {
children: React.ReactNode; children: React.ReactNode;
} }
export function AppProvider({ children }: AppProviderProps) { export function EditorProvider({ children }: EditorProviderProps) {
const { isInitializing, isPanelsReady, initializeApp } = useAppStore(); const { isInitializing, isPanelsReady, initializeApp } = useAppStore();
const { setInitialized } = usePanelStore(); const { setInitialized } = usePanelStore();

0
apps/web/src/stores/app-store.ts → apps/web/src/stores/editor-store.ts
View File