diff --git a/wax-prosemirror-services/src/FindAndReplaceService/components/FindAndReplaceTool.js b/wax-prosemirror-services/src/FindAndReplaceService/components/FindAndReplaceTool.js
index b8a8603c5c1b88d683ca8eba1393765fcdebf8f9..69db7b806cde61c1316dcc6a212ef28034f3b2a0 100644
--- a/wax-prosemirror-services/src/FindAndReplaceService/components/FindAndReplaceTool.js
+++ b/wax-prosemirror-services/src/FindAndReplaceService/components/FindAndReplaceTool.js
@@ -38,11 +38,9 @@ const FindAndReplaceTool = ({ item }) => {
   let styles = { right: '-190px' };
   const [style, setStyle] = useState(styles);
 
-  let isDisabled = false;
   const isEditable = main.props.editable(editable => {
     return editable;
   });
-  if (!isEditable) isDisabled = true;
 
   const triggerFind = e => {
     if ((e.key === 70 || e.keyCode === 70) && (e.metaKey || e.ctrlKey)) {
@@ -75,7 +73,7 @@ const FindAndReplaceTool = ({ item }) => {
       <Wrapper>
         <MenuButton
           active={isOpen}
-          disabled={isDisabled}
+          // disabled={!isEditable}
           iconName={icon}
           onMouseDown={() => {
             setIsOpen(!isOpen);
@@ -94,7 +92,7 @@ const FindAndReplaceTool = ({ item }) => {
         )}
       </Wrapper>
     ),
-    [isOpen, style, isDisabled],
+    [isOpen, style, isEditable],
   );
 
   return MemorizedDropdown;
diff --git a/wax-prosemirror-services/src/FindAndReplaceService/components/FindComponent.js b/wax-prosemirror-services/src/FindAndReplaceService/components/FindComponent.js
index 6bb6347a1affe67224f057c77104bf638540b09e..eb468b51393bcbdb6d85d238088b7018660e6e7a 100644
--- a/wax-prosemirror-services/src/FindAndReplaceService/components/FindComponent.js
+++ b/wax-prosemirror-services/src/FindAndReplaceService/components/FindComponent.js
@@ -77,7 +77,16 @@ const IconWrapper = styled.span`
   }
 `;
 
-const ExpandedWrapper = styled.div``;
+const ExpandedWrapper = styled.div`
+  pointer-events: ${props => (props.isDisabled ? 'none' : '')};
+`;
+
+const StyledIconMore = styled(Icon)`
+  cursor: ${props => (props.isDisabled ? 'not-allowed' : 'pointer')};
+  height: 24px;
+  opacity: ${props => (props.isDisabled ? '0.4' : '1')};
+  width: 24px;
+`;
 
 const Svg = styled.svg.attrs(() => ({
   version: '1.1',
@@ -101,9 +110,18 @@ const FindComponent = ({
   findNextMatch,
   findPreviousMatch,
 }) => {
-  const { app, pmViews, activeViewId } = useContext(WaxContext);
+  const {
+    app,
+    pmViews,
+    activeViewId,
+    pmViews: { main },
+  } = useContext(WaxContext);
   const searchRef = useRef(null);
 
+  const isEditable = main.props.editable(editable => {
+    return editable;
+  });
+
   const [searchValue, setSearchValue] = useState('');
   const [counterText, setCounterText] = useState('0 of 0');
   const [matchCaseSearch, setMatchCaseSearch] = useState(false);
@@ -114,7 +132,7 @@ const FindComponent = ({
 
   const debouncedSearchTerm = useDebounce(searchValue, 300);
 
-  each(pmViews, (singleView, viewId) => {
+  each(pmViews, singleView => {
     allStates.push(singleView.state);
   });
 
@@ -250,8 +268,8 @@ const FindComponent = ({
             <StyledIcon name="navigateNext" />
           </IconWrapper>
 
-          <ExpandedWrapper onClick={showExpanded}>
-            <StyledIcon name="more" />
+          <ExpandedWrapper isDisabled={!isEditable} onClick={showExpanded}>
+            <StyledIconMore isDisabled={!isEditable} name="more" />
           </ExpandedWrapper>
 
           <CloseWrapper onClick={closeFind}>