From e71c48ec3d5b2229538d7f1f285190496da78f07 Mon Sep 17 00:00:00 2001
From: Marco Beretta <81851188+berry-13@users.noreply.github.com>
Date: Fri, 14 Nov 2025 18:27:51 +0100
Subject: [PATCH] =?UTF-8?q?=F0=9F=8E=A8=20fix:=20Correct=20Read-Only=20Sta?=
 =?UTF-8?q?te=20Logic=20in=20Code=20Editor=20(#10508)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* ✨ style: Update ThinkingButton container background color for improved visibility

* ✨ style: Refactor Clipboard icon rendering for improved readability

* ✨ style: Simplify readOnly state initialization and update logic in ArtifactCodeEditor

* ✨ style: Update Thinking component background color for improved aesthetics

* Update client/src/components/Chat/Messages/MinimalHoverButtons.tsx

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

---------

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
---
 client/src/components/Artifacts/ArtifactCodeEditor.tsx      | 5 +++--
 .../components/Chat/Messages/Content/Parts/Reasoning.tsx    | 2 +-
 .../src/components/Chat/Messages/Content/Parts/Thinking.tsx | 2 +-
 client/src/components/Chat/Messages/MinimalHoverButtons.tsx | 6 +++++-
 4 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/client/src/components/Artifacts/ArtifactCodeEditor.tsx b/client/src/components/Artifacts/ArtifactCodeEditor.tsx
index 82ed3d9da4..4ab2b182b8 100644
--- a/client/src/components/Artifacts/ArtifactCodeEditor.tsx
+++ b/client/src/components/Artifacts/ArtifactCodeEditor.tsx
@@ -179,9 +179,10 @@ export const ArtifactCodeEditor = function ({
       bundlerURL: template === 'static' ? config.staticBundlerURL : config.bundlerURL,
     };
   }, [config, template, fileKey]);
-  const [readOnly, setReadOnly] = useState(externalReadOnly ?? isSubmitting ?? false);
+  const initialReadOnly = (externalReadOnly ?? false) || (isSubmitting ?? false);
+  const [readOnly, setReadOnly] = useState(initialReadOnly);
   useEffect(() => {
-    setReadOnly(externalReadOnly ?? isSubmitting ?? false);
+    setReadOnly((externalReadOnly ?? false) || (isSubmitting ?? false));
   }, [isSubmitting, externalReadOnly]);
 
   if (Object.keys(files).length === 0) {
diff --git a/client/src/components/Chat/Messages/Content/Parts/Reasoning.tsx b/client/src/components/Chat/Messages/Content/Parts/Reasoning.tsx
index f512f2dcbd..29f2e7187a 100644
--- a/client/src/components/Chat/Messages/Content/Parts/Reasoning.tsx
+++ b/client/src/components/Chat/Messages/Content/Parts/Reasoning.tsx
@@ -69,7 +69,7 @@ const Reasoning = memo(({ reasoning, isLast }: ReasoningProps) => {
   return (
     <div className="group/reasoning">
       <div className="group/thinking-container">
-        <div className="sticky top-0 z-10 mb-2 pb-2 pt-2">
+        <div className="sticky top-0 z-10 mb-2 bg-presentation pb-2 pt-2">
           <ThinkingButton
             isExpanded={isExpanded}
             onClick={handleClick}
diff --git a/client/src/components/Chat/Messages/Content/Parts/Thinking.tsx b/client/src/components/Chat/Messages/Content/Parts/Thinking.tsx
index 17d9eac752..9a7618ef3f 100644
--- a/client/src/components/Chat/Messages/Content/Parts/Thinking.tsx
+++ b/client/src/components/Chat/Messages/Content/Parts/Thinking.tsx
@@ -148,7 +148,7 @@ const Thinking: React.ElementType = memo(({ children }: { children: React.ReactN
 
   return (
     <div className="group/thinking-container">
-      <div className="sticky top-0 z-10 mb-4 bg-surface-primary pb-2 pt-2">
+      <div className="sticky top-0 z-10 mb-4 bg-presentation pb-2 pt-2">
         <ThinkingButton
           isExpanded={isExpanded}
           onClick={handleClick}
diff --git a/client/src/components/Chat/Messages/MinimalHoverButtons.tsx b/client/src/components/Chat/Messages/MinimalHoverButtons.tsx
index 00bca638b7..b10e38d031 100644
--- a/client/src/components/Chat/Messages/MinimalHoverButtons.tsx
+++ b/client/src/components/Chat/Messages/MinimalHoverButtons.tsx
@@ -27,7 +27,11 @@ export default function MinimalHoverButtons({ message, searchResults }: THoverBu
           isCopied ? localize('com_ui_copied_to_clipboard') : localize('com_ui_copy_to_clipboard')
         }
       >
-        {isCopied ? <CheckMark className="h-[18px] w-[18px]" /> : <Clipboard size="19" />}
+        {isCopied ? (
+          <CheckMark className="h-[19px] w-[19px]" />
+        ) : (
+          <Clipboard className="h-[19px] w-[19px]" />
+        )}
       </button>
     </div>
   );