From 5d7a1cce2da8c80829f52cbbb35c49f58e22d4d1 Mon Sep 17 00:00:00 2001
From: Oliver Gwyther <oliver@og.codes>
Date: Fri, 15 Aug 2025 23:46:28 +0100
Subject: [PATCH] Refactor theme handling in ScriptDetail and SubmitScript
 components to use resolvedTheme instead of theme for improved consistency in
 dark mode styling.

---
 src/pages/ScriptDetail.tsx | 8 ++++----
 src/pages/SubmitScript.tsx | 8 ++++----
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/src/pages/ScriptDetail.tsx b/src/pages/ScriptDetail.tsx
index b019187..6aa51e7 100644
--- a/src/pages/ScriptDetail.tsx
+++ b/src/pages/ScriptDetail.tsx
@@ -138,7 +138,7 @@ echo "Setting up Docker environment for $PROJECT_NAME..."
 export default function ScriptDetail() {
   const { scriptId } = useParams();
   const { user } = useAuth();
-  const { theme } = useTheme();
+  const { resolvedTheme } = useTheme();
   
   // API hooks
   const { data: script } = useScript(scriptId || '');
@@ -360,7 +360,7 @@ export default function ScriptDetail() {
                   <div className="rounded-lg overflow-hidden border">
                     <SyntaxHighlighter
                       language="bash"
-                      style={theme === 'dark' ? vscDarkPlus : vs}
+                      style={resolvedTheme === 'dark' ? vscDarkPlus : vs}
                       customStyle={{
                         margin: 0,
                         borderRadius: 0,
@@ -404,7 +404,7 @@ export default function ScriptDetail() {
                     <div className="rounded-lg overflow-hidden border">
                       <SyntaxHighlighter
                         language="bash"
-                        style={theme === 'dark' ? vscDarkPlus : vs}
+                        style={resolvedTheme === 'dark' ? vscDarkPlus : vs}
                         customStyle={{
                           margin: 0,
                           borderRadius: 0,
@@ -423,7 +423,7 @@ export default function ScriptDetail() {
                     <div className="rounded-lg overflow-hidden border">
                       <SyntaxHighlighter
                         language="bash"
-                        style={theme === 'dark' ? vscDarkPlus : vs}
+                        style={resolvedTheme === 'dark' ? vscDarkPlus : vs}
                         customStyle={{
                           margin: 0,
                           borderRadius: 0,
diff --git a/src/pages/SubmitScript.tsx b/src/pages/SubmitScript.tsx
index 3c561b7..a5f6581 100644
--- a/src/pages/SubmitScript.tsx
+++ b/src/pages/SubmitScript.tsx
@@ -29,7 +29,7 @@ import {
 export default function SubmitScript() {
   const { user } = useAuth();
   const navigate = useNavigate();
-  const { theme } = useTheme();
+  const { resolvedTheme } = useTheme();
   const [isLoading, setIsLoading] = useState(false);
   const [showPreview, setShowPreview] = useState(false);
   const [formData, setFormData] = useState({
@@ -336,7 +336,7 @@ export default function SubmitScript() {
                       <div className="rounded-lg overflow-hidden border">
                         <SyntaxHighlighter
                           language="bash"
-                          style={theme === 'dark' ? vscDarkPlus : vs}
+                          style={resolvedTheme === 'dark' ? vscDarkPlus : vs}
                           customStyle={{
                             margin: 0,
                             borderRadius: 0,
@@ -484,7 +484,7 @@ export default function SubmitScript() {
                         <div className="rounded-lg overflow-hidden border">
                           <SyntaxHighlighter
                             language="bash"
-                            style={theme === 'dark' ? vscDarkPlus : vs}
+                            style={resolvedTheme === 'dark' ? vscDarkPlus : vs}
                             customStyle={{
                               margin: 0,
                               borderRadius: 0,
@@ -525,7 +525,7 @@ export default function SubmitScript() {
                         <div className="rounded-lg overflow-hidden border">
                           <SyntaxHighlighter
                             language="bash"
-                            style={theme === 'dark' ? vscDarkPlus : vs}
+                            style={resolvedTheme === 'dark' ? vscDarkPlus : vs}
                             customStyle={{
                               margin: 0,
                               borderRadius: 0,