🐛(frontend) fix toolbar not activated when reader

When user was a reader of the document, the toolbar
of the BlockNote editor was not activated,
making it impossible to download resources like images.
We add the toolbar even in viewer mode.
We block as well automatic document mutation
from custom blocks when the editor is in viewer mode
to avoid unwanted modifications.

src/frontend/apps/impress/src/features/docs/doc-editor/components/BlockNoteEditor.tsx

@@ -289,11 +289,13 @@ export const BlockNoteReader = ({
         editor={editor}
         editable={false}
         theme="light"
-        aria-label={t('Document version viewer')}
+        aria-label={t('Document viewer')}
         formattingToolbar={false}
         slashMenu={false}
         comments={false}
-      />
+      >
+        <BlockNoteToolbar />
+      </BlockNoteView>
     </Box>
   );
 };

src/frontend/apps/impress/src/features/docs/doc-editor/components/custom-blocks/UploadLoaderBlock.tsx

@@ -59,9 +59,15 @@ const UploadLoaderBlockComponent = ({
   editor,
 }: UploadLoaderBlockComponentProps) => {
   const mediaUrl = useMediaUrl();
+  const isEditable = editor.isEditable;
 
   useEffect(() => {
-    if (!block.props.blockUploadUrl || block.props.type !== 'loading') {
+    const shouldCheckStatus =
+      block.props.blockUploadUrl &&
+      block.props.type === 'loading' &&
+      isEditable;
+
+    if (!shouldCheckStatus) {
       return;
     }
 
@@ -108,7 +114,7 @@ const UploadLoaderBlockComponent = ({
           /* During collaboration, another user might have updated the block */
         }
       });
-  }, [block, editor, mediaUrl]);
+  }, [block, editor, mediaUrl, isEditable]);
 
   return (
     <Box className="bn-visual-media-wrapper" $direction="row" $gap="0.5rem">

src/frontend/apps/impress/src/features/docs/doc-editor/components/custom-inline-content/Interlinking/InterlinkingLinkInlineContent.tsx

@@ -26,14 +26,19 @@ export const InterlinkingLinkInlineContent = createReactInlineContentSpec(
     content: 'none',
   },
   {
-    render: ({ inlineContent, updateInlineContent }) => {
+    render: ({ editor, inlineContent, updateInlineContent }) => {
       const { data: doc } = useDoc({ id: inlineContent.props.docId });
+      const isEditable = editor.isEditable;
 
       /**
        * Update the content title if the referenced doc title changes
        */
       useEffect(() => {
-        if (doc?.title && doc.title !== inlineContent.props.title) {
+        if (
+          isEditable &&
+          doc?.title &&
+          doc.title !== inlineContent.props.title
+        ) {
           updateInlineContent({
             type: 'interlinkingLinkInline',
             props: {
@@ -50,7 +55,7 @@ export const InterlinkingLinkInlineContent = createReactInlineContentSpec(
          * not when inlineContent.props.title changes.
          */
         // eslint-disable-next-line react-hooks/exhaustive-deps
-      }, [doc?.title]);
+      }, [doc?.title, isEditable]);
 
       return <LinkSelected {...inlineContent.props} />;
     },

src/frontend/apps/impress/src/features/docs/doc-editor/components/custom-inline-content/Interlinking/SearchPage.tsx

@@ -86,6 +86,7 @@ export const SearchPage = ({
   const [search, setSearch] = useState('');
   const { isDesktop } = useResponsiveStore();
   const { untitledDocument } = useTrans();
+  const isEditable = editor.isEditable;
 
   /**
    * createReactInlineContentSpec add automatically the focus after
@@ -101,6 +102,10 @@ export const SearchPage = ({
   }, [inputRef]);
 
   const closeSearch = (insertContent: string) => {
+    if (!isEditable) {
+      return;
+    }
+
     updateInlineContent({
       type: 'interlinkingSearchInline',
       props: {
@@ -223,6 +228,10 @@ export const SearchPage = ({
               search={search}
               filters={{ target: DocSearchTarget.CURRENT }}
               onSelect={(doc) => {
+                if (!isEditable) {
+                  return;
+                }
+
                 updateInlineContent({
                   type: 'interlinkingSearchInline',
                   props: {