refactor(problem): replace inline dockview options with default config

src/app/(app)/problems/[id]/page.tsx

@@ -10,8 +10,12 @@ import {
   TestResult,
 } from "@/app/(app)/problems/[id]/features";
 import DockView from "@/components/dockview";
+import { useDockviewStore } from "@/stores/dockview";
+import { DefaultDockviewOptions } from "@/config/dockview";
 
 export default function ProblemPage() {
+  const { setApi } = useDockviewStore();
+
   return (
     <DockView
       storageKey="dockview:problem"
@@ -24,77 +28,8 @@ export default function ProblemPage() {
         TestResult: () => <TestResult />,
         Bot: () => <Bot />,
       }}
-      options={[
+      options={DefaultDockviewOptions.filter((panel) => panel.id !== "Bot")}
-        {
+      onApiReady={setApi}
-          id: "Description",
-          component: "Description",
-          title: "Description",
-          params: { icon: "FileTextIcon" },
-        },
-        {
-          id: "Solutions",
-          component: "Solutions",
-          title: "Solutions",
-          params: { icon: "FlaskConicalIcon" },
-          position: {
-            referencePanel: "Description",
-            direction: "within",
-          },
-          inactive: true,
-        },
-        {
-          id: "Submissions",
-          component: "Submissions",
-          title: "Submissions",
-          params: { icon: "CircleCheckBigIcon" },
-          position: {
-            referencePanel: "Solutions",
-            direction: "within",
-          },
-          inactive: true,
-        },
-        {
-          id: "Code",
-          component: "Code",
-          title: "Code",
-          params: { icon: "SquarePenIcon" },
-          position: {
-            referencePanel: "Submissions",
-            direction: "right",
-          },
-        },
-        {
-          id: "Bot",
-          component: "Bot",
-          title: "Bot",
-          params: { icon: "BotIcon" },
-          position: {
-            referencePanel: "Code",
-            direction: "right",
-          },
-        },
-        {
-          id: "Testcase",
-          component: "Testcase",
-          title: "Testcase",
-          params: { icon: "SquareCheckIcon" },
-          position: {
-            referencePanel: "Code",
-            direction: "below",
-          },
-        },
-        {
-          id: "TestResult",
-          component: "TestResult",
-          title: "Test Result",
-          params: { icon: "TerminalIcon" },
-          position: {
-            referencePanel: "Testcase",
-            direction: "within",
-          },
-          inactive: true,
-        },
-      ]}
     />
   );
 }