From 0a88502e597d0e6ea1738dba66450709c759f072 Mon Sep 17 00:00:00 2001
From: Abdullah Atta <abdullahatta@streetwriters.co>
Date: Thu, 1 Jun 2023 21:10:16 +0500
Subject: [PATCH] editor: hide replace button in readonly mode

---
 .../src/toolbar/popups/search-replace.tsx     | 20 ++++++++++---------
 1 file changed, 11 insertions(+), 9 deletions(-)

diff --git a/packages/editor/src/toolbar/popups/search-replace.tsx b/packages/editor/src/toolbar/popups/search-replace.tsx
index 4d86c7efd..fc479ec57 100644
--- a/packages/editor/src/toolbar/popups/search-replace.tsx
+++ b/packages/editor/src/toolbar/popups/search-replace.tsx
@@ -203,15 +203,17 @@ export function SearchReplacePopup(props: SearchReplacePopupProps) {
         </Flex>
         <Flex sx={{ flexDirection: "column" }}>
           <Flex sx={{ alignItems: "center", height: "33.2px" }}>
-            <ToolButton
-              toggled={isReplacing}
-              title="Toggle replace"
-              id="toggleReplace"
-              icon="replace"
-              onClick={() => setIsReplacing((s) => !s)}
-              sx={{ mr: 0 }}
-              iconSize={"big"}
-            />
+            {editor.isEditable && (
+              <ToolButton
+                toggled={isReplacing}
+                title="Toggle replace"
+                id="toggleReplace"
+                icon="replace"
+                onClick={() => setIsReplacing((s) => !s)}
+                sx={{ mr: 0 }}
+                iconSize={"big"}
+              />
+            )}
             <ToolButton
               toggled={false}
               title="Previous match"