diff --git a/frontend/src/components/production/ocp/OcpPage.tsx b/frontend/src/components/production/ocp/OcpPage.tsx
index 48ce501..baa81bd 100644
--- a/frontend/src/components/production/ocp/OcpPage.tsx
+++ b/frontend/src/components/production/ocp/OcpPage.tsx
@@ -4,56 +4,117 @@ import Lots from "./Lots";
 import OcpLogs from "./OcpLogs";
 import PrinterStatus from "./PrinterStatus";
 import { useSettingStore } from "@/lib/store/useSettings";
-import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
+
 import LabelLog from "./LabelLog";
+import {
+    ResizableHandle,
+    ResizablePanel,
+    ResizablePanelGroup,
+} from "@/components/ui/resizable-panels";
 
 export default function OCPPage() {
     const { settings } = useSettingStore();
 
     let server = settings.filter((n) => n.name === "server");
-    return (
-        <div className="h-screen w-full ">
-            <div className="flex flex-row gap-2">
-                <div className="flex flex-col w-4/5 h-dvh">
-                    <div className="">
-                        <Lots />
-                    </div>
 
-                    <div className="w-5/6 h-1/2">
-                        <Tabs defaultValue="ocplogs" className="w-full">
-                            <TabsList className="grid w-full grid-cols-2">
-                                <TabsTrigger value="ocplogs">
-                                    OcpLogs
-                                </TabsTrigger>
-                                <TabsTrigger value="labels">Labels</TabsTrigger>
-                            </TabsList>
-                            <TabsContent value="ocplogs">
-                                <div className="w-full">
-                                    <OcpLogs />
-                                </div>
-                            </TabsContent>
-                            <TabsContent value="labels">
-                                <LabelLog />
-                            </TabsContent>
-                        </Tabs>
-                    </div>
-                </div>
-                <div className="flex flex-col">
-                    {server[0].value === "usday1vms006" && (
-                        <div>
-                            <WrapperManualTrigger />
-                        </div>
-                    )}
-                    {server[0].value === "localhost" && (
-                        <div>
-                            <WrapperManualTrigger />
-                        </div>
-                    )}
-                    <div>
-                        <PrinterStatus />
-                    </div>
-                </div>
-            </div>
+    return (
+        <div className="ml-5 w-11/12 h-9/10">
+            <ResizablePanelGroup
+                direction="horizontal"
+                //className="rounded-lg border"
+                autoSaveId="ocpPage"
+            >
+                <ResizablePanel>
+                    <ResizablePanelGroup direction="vertical">
+                        <ResizablePanel>
+                            <div style={{ overflow: "auto" }}>
+                                <Lots />
+                            </div>
+                        </ResizablePanel>
+                        <ResizableHandle />
+                        <ResizablePanel>
+                            <ResizablePanelGroup direction="horizontal">
+                                <ResizablePanel className="overflow: auto">
+                                    <div style={{ overflow: "auto" }}>
+                                        <LabelLog />
+                                    </div>
+                                </ResizablePanel>
+                                <ResizableHandle />
+                                <ResizablePanel>
+                                    <div style={{ overflow: "auto" }}>
+                                        <OcpLogs />
+                                    </div>
+                                </ResizablePanel>
+                            </ResizablePanelGroup>
+                        </ResizablePanel>
+                    </ResizablePanelGroup>
+                </ResizablePanel>
+                <ResizableHandle />
+                <ResizablePanel defaultSize={25}>
+                    <ResizablePanelGroup direction="vertical">
+                        {server[0].value === "usday1vms006" && (
+                            <ResizablePanel className="max-h-[300px]">
+                                <WrapperManualTrigger />
+                            </ResizablePanel>
+                        )}
+                        {server[0].value === "usday1vms006" && (
+                            <ResizablePanel className="max-h-[300px]">
+                                <WrapperManualTrigger />
+                            </ResizablePanel>
+                        )}
+
+                        <ResizableHandle />
+                        <ResizablePanel>
+                            <PrinterStatus />
+                        </ResizablePanel>
+                    </ResizablePanelGroup>
+                </ResizablePanel>
+            </ResizablePanelGroup>
         </div>
     );
+    // return (
+    //     <div className="h-screen w-full ">
+    //         <div className="flex flex-row gap-2">
+    //             <div className="flex flex-col w-4/5 h-dvh">
+    //                 <div className="">
+    //                     <Lots />
+    //                 </div>
+
+    //                 <div className="w-5/6 h-1/2">
+    //                     <Tabs defaultValue="ocplogs" className="w-full">
+    //                         <TabsList className="grid w-full grid-cols-2">
+    //                             <TabsTrigger value="ocplogs">
+    //                                 OcpLogs
+    //                             </TabsTrigger>
+    //                             <TabsTrigger value="labels">Labels</TabsTrigger>
+    //                         </TabsList>
+    //                         <TabsContent value="ocplogs">
+    //                             <div className="w-full">
+    //                                 <OcpLogs />
+    //                             </div>
+    //                         </TabsContent>
+    //                         <TabsContent value="labels">
+    //                             <LabelLog />
+    //                         </TabsContent>
+    //                     </Tabs>
+    //                 </div>
+    //             </div>
+    //             <div className="flex flex-col">
+    //                 {server[0].value === "usday1vms006" && (
+    //                     <div>
+    //                         <WrapperManualTrigger />
+    //                     </div>
+    //                 )}
+    //                 {server[0].value === "localhost" && (
+    //                     <div>
+    //                         <WrapperManualTrigger />
+    //                     </div>
+    //                 )}
+    //                 <div>
+    //                     <PrinterStatus />
+    //                 </div>
+    //             </div>
+    //         </div>
+    //     </div>
+    // );
 }