diff --git a/src/app/(app)/playground/@problem/@submission/page.tsx b/src/app/(app)/playground/@problem/@submission/page.tsx
new file mode 100644
index 0000000..80808e5
--- /dev/null
+++ b/src/app/(app)/playground/@problem/@submission/page.tsx
@@ -0,0 +1,15 @@
+"use client";
+
+import { useMemo } from 'react';
+import MdxPreview from "@/components/mdx-preview";
+import { useCodeEditorState } from "@/store/useCodeEditor";
+
+export default function ProblemSubmissionPage() {
+  const { result } = useCodeEditorState();
+
+  const template = useMemo(() => {
+    return `\`\`\`bash\n${result || ""}\`\`\``;
+  }, [result]);
+
+  return <MdxPreview source={template} />;
+}