diff --git a/lib/screens/home_page/editor_pane/details_card/code_pane.dart b/lib/screens/home_page/editor_pane/details_card/code_pane.dart
new file mode 100644
index 00000000..bbd42a6e
--- /dev/null
+++ b/lib/screens/home_page/editor_pane/details_card/code_pane.dart
@@ -0,0 +1,36 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_riverpod/flutter_riverpod.dart';
+import 'package:apidash/providers/providers.dart';
+import 'package:apidash/widgets/widgets.dart';
+import 'package:apidash/codegen/codegen.dart';
+import 'package:apidash/consts.dart';
+
+class CodePane extends ConsumerStatefulWidget {
+  const CodePane({super.key});
+
+  @override
+  ConsumerState<CodePane> createState() => _CodePaneState();
+}
+
+class _CodePaneState extends ConsumerState<CodePane> {
+  final DartHttpCodeGen dartHttpCodeGen = DartHttpCodeGen();
+
+  @override
+  void initState() {
+    super.initState();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final activeRequestModel = ref.watch(activeRequestModelProvider);
+    final code = dartHttpCodeGen.getCode(activeRequestModel!);
+    if (code == null) {
+      return const ErrorMessage(
+        message: "An error was encountered while generating code. $kRaiseIssue",
+      );
+    }
+    return ViewCodePane(
+      code: code,
+    );
+  }
+}
diff --git a/lib/screens/home_page/editor_pane/details_card/code_pane/code_pane.dart b/lib/screens/home_page/editor_pane/details_card/code_pane/code_pane.dart
deleted file mode 100644
index 3ad825c7..00000000
--- a/lib/screens/home_page/editor_pane/details_card/code_pane/code_pane.dart
+++ /dev/null
@@ -1,83 +0,0 @@
-import 'package:flutter/material.dart';
-import 'package:flutter_riverpod/flutter_riverpod.dart';
-import 'package:apidash/providers/providers.dart';
-import 'package:apidash/widgets/widgets.dart';
-import 'package:apidash/codegen/codegen.dart';
-import 'package:apidash/consts.dart';
-
-class CodePane extends ConsumerStatefulWidget {
-  const CodePane({super.key});
-
-  @override
-  ConsumerState<CodePane> createState() => _CodePaneState();
-}
-
-class _CodePaneState extends ConsumerState<CodePane> {
-  final DartHttpCodeGen dartHttpCodeGen = DartHttpCodeGen();
-
-  @override
-  void initState() {
-    super.initState();
-  }
-
-  @override
-  Widget build(BuildContext context) {
-    final activeRequestModel = ref.watch(activeRequestModelProvider);
-    var codeTheme = Theme.of(context).brightness == Brightness.light
-        ? kLightCodeTheme
-        : kDarkCodeTheme;
-    final textContainerdecoration = BoxDecoration(
-      color: Color.alphaBlend(
-          (Theme.of(context).brightness == Brightness.dark
-                  ? Theme.of(context).colorScheme.onPrimaryContainer
-                  : Theme.of(context).colorScheme.primaryContainer)
-              .withOpacity(kForegroundOpacity),
-          Theme.of(context).colorScheme.surface),
-      border: Border.all(color: Theme.of(context).colorScheme.surfaceVariant),
-      borderRadius: kBorderRadius8,
-    );
-
-    final code = dartHttpCodeGen.getCode(activeRequestModel!);
-    if (code == null) {
-      return const ErrorMessage(
-        message: "An error was encountered while generating code. $kRaiseIssue",
-      );
-    } else {
-      return Padding(
-        padding: kP10,
-        child: Column(
-          children: [
-            SizedBox(
-              height: kHeaderHeight,
-              child: Row(
-                children: [
-                  Expanded(
-                    child: Text(
-                      "Code",
-                      style: Theme.of(context).textTheme.titleMedium,
-                    ),
-                  ),
-                  CopyButton(toCopy: code),
-                ],
-              ),
-            ),
-            kVSpacer10,
-            Expanded(
-              child: Container(
-                width: double.maxFinite,
-                padding: kP8,
-                decoration: textContainerdecoration,
-                child: CodeGenPreviewer(
-                  code: code,
-                  theme: codeTheme,
-                  language: 'dart',
-                  textStyle: kCodeStyle,
-                ),
-              ),
-            ),
-          ],
-        ),
-      );
-    }
-  }
-}
diff --git a/lib/widgets/codegen_previewer.dart b/lib/widgets/codegen_previewer.dart
index 489f60fe..fa19d253 100644
--- a/lib/widgets/codegen_previewer.dart
+++ b/lib/widgets/codegen_previewer.dart
@@ -1,6 +1,8 @@
 import 'package:flutter/material.dart';
 import 'package:highlighter/highlighter.dart' show highlight;
+import 'package:apidash/consts.dart';
 import 'code_previewer.dart' show convert;
+import 'buttons.dart' show CopyButton;
 
 class CodeGenPreviewer extends StatefulWidget {
   const CodeGenPreviewer({
@@ -97,3 +99,70 @@ List<TextSpan> generateSpans(
   var spans = convert(parsed.nodes!, theme);
   return spans;
 }
+
+class ViewCodePane extends StatefulWidget {
+  const ViewCodePane({
+    super.key,
+    required this.code,
+  });
+
+  final String code;
+
+  @override
+  State<ViewCodePane> createState() => _ViewCodePaneState();
+}
+
+class _ViewCodePaneState extends State<ViewCodePane> {
+  @override
+  Widget build(BuildContext context) {
+    var codeTheme = Theme.of(context).brightness == Brightness.light
+        ? kLightCodeTheme
+        : kDarkCodeTheme;
+    final textContainerdecoration = BoxDecoration(
+      color: Color.alphaBlend(
+          (Theme.of(context).brightness == Brightness.dark
+                  ? Theme.of(context).colorScheme.onPrimaryContainer
+                  : Theme.of(context).colorScheme.primaryContainer)
+              .withOpacity(kForegroundOpacity),
+          Theme.of(context).colorScheme.surface),
+      border: Border.all(color: Theme.of(context).colorScheme.surfaceVariant),
+      borderRadius: kBorderRadius8,
+    );
+
+    return Padding(
+      padding: kP10,
+      child: Column(
+        children: [
+          SizedBox(
+            height: kHeaderHeight,
+            child: Row(
+              children: [
+                Expanded(
+                  child: Text(
+                    "Code",
+                    style: Theme.of(context).textTheme.titleMedium,
+                  ),
+                ),
+                CopyButton(toCopy: widget.code),
+              ],
+            ),
+          ),
+          kVSpacer10,
+          Expanded(
+            child: Container(
+              width: double.maxFinite,
+              padding: kP8,
+              decoration: textContainerdecoration,
+              child: CodeGenPreviewer(
+                code: widget.code,
+                theme: codeTheme,
+                language: 'dart',
+                textStyle: kCodeStyle,
+              ),
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+}