refactor(layout): remove Header from AppLayout and add Header to PlaygroundLayout

This commit is contained in:
cfngc4594 2025-03-07 11:45:18 +08:00
parent 0159998234
commit e504d92ad9
2 changed files with 22 additions and 15 deletions

View File

@ -1,5 +1,3 @@
import { Header } from "@/components/header";
interface AppLayoutProps { interface AppLayoutProps {
children: React.ReactNode; children: React.ReactNode;
} }
@ -7,7 +5,6 @@ interface AppLayoutProps {
export default function AppLayout({ children }: AppLayoutProps) { export default function AppLayout({ children }: AppLayoutProps) {
return ( return (
<div className="h-full flex flex-col"> <div className="h-full flex flex-col">
<Header />
<main className="flex-1"> <main className="flex-1">
{children} {children}
</main> </main>

View File

@ -3,6 +3,7 @@ import {
ResizablePanel, ResizablePanel,
ResizablePanelGroup, ResizablePanelGroup,
} from "@/components/ui/resizable"; } from "@/components/ui/resizable";
import { Header } from "@/components/header";
interface PlaygroundLayoutProps { interface PlaygroundLayoutProps {
problem: React.ReactNode; problem: React.ReactNode;
@ -14,17 +15,26 @@ export default function PlaygroundLayout({
workspace, workspace,
}: PlaygroundLayoutProps) { }: PlaygroundLayoutProps) {
return ( return (
<div className="h-full flex flex-col">
<Header />
<ResizablePanelGroup direction="horizontal" className="p-2.5 pt-0"> <ResizablePanelGroup direction="horizontal" className="p-2.5 pt-0">
<ResizablePanel defaultSize={50} className="border border-muted rounded-2xl"> <ResizablePanel
defaultSize={50}
className="border border-muted rounded-2xl"
>
{problem} {problem}
</ResizablePanel> </ResizablePanel>
<ResizableHandle <ResizableHandle
withHandle withHandle
className="w-0.5 bg-transparent hover:bg-blue-500 mx-1" className="w-0.5 bg-transparent hover:bg-blue-500 mx-1"
/> />
<ResizablePanel defaultSize={50} className="border border-muted rounded-2xl"> <ResizablePanel
defaultSize={50}
className="border border-muted rounded-2xl"
>
{workspace} {workspace}
</ResizablePanel> </ResizablePanel>
</ResizablePanelGroup> </ResizablePanelGroup>
</div>
); );
} }