I am composing a document using Editor.js.
https://editorjs.io/
I want the document to be partially read-only. Like some portions of the document, I want the user to be able to edit, and for the other blocks, I want the user to be restricted from editing, by making it read-only.
Here’s my Editor.js configuration:

        this.editor = new EditorJS({

            readOnly: this.userRole ? true: false,

            holder: 'editorjs',
            tools: {
                  
                header: Header,   
                image: {
                    class: ImageTool,
                    config:{
                        uploader:{
                            async uploadByFile(file) {
                                // Create a form data
                                const formData = new FormData();
                                formData.append('image', file);

                                try {
                                    const response = await axios.post('upload_image_file', formData, {
                                        headers: {
                                        'Content-Type': 'multipart/form-data'
                                        }
                                    });
                                    console.log("???? ~ uploadByFile ~ response.data:", response.data)

                                    return {

                                        success: 1,
                                        file: {
                                        url: response.data.file.url
                                        }
                                    };
                                } catch (error) {
                                console.error('Image upload error:', error);
                                    return {
                                        success: 0,
                                        error: 'Image upload failed'
                                    };
                                }
                            },             
                            async uploadByUrl(url) {
                                try {
                                const response = await axios.post('upload_image_url', {
                                    url: url
                                });

                                if (response.data.success && response.data.file && response.data.file.url) {
                                    return {
                                    success: 1,
                                    file: {
                                        url: response.data.file.url
                                    }
                                    };
                                } else {
                                    return {
                                    success: 0,
                                    error: 'Image upload failed'
                                    };
                                }
                                } catch (error) {
                                console.error('Image upload error:', error);
                                return {
                                    success: 0,
                                    error: 'Image upload failed'
                                };
                                }
                            }                                           
                        }
                    }
                },
                textVariant: TextVariantTune,
                checklist: {
                    class: Checklist,
                    inlineToolbar: true,
                },   
                list: {
                    class: NestedList,
                    inlineToolbar: true,
                    config: {
                        defaultStyle: 'unordered'
                    },
                },   
                embed: Embed,    
                Marker: {
                    class: Marker,
                    shortcut: 'CMD+SHIFT+M',
                },
                table: {
                    class: Table,
                    inlineToolbar: true,
                    config: {
                        rows: 2,
                        cols: 3,
                    },
                },   
                warning: {
                    class: Warning,
                    inlineToolbar: true,
                    shortcut: 'CMD+SHIFT+W',
                    config: {
                        titlePlaceholder: 'Title',
                        messagePlaceholder: 'Message',
                    },
                },    
                translator: {
                    class: Translate,
                    config: {
                        endpoint: 'http://localhost:5000/translate?text=',
                    }
                },     
                attaches: {
                    class: AttachesTool,
                    config: {
                        endpoint: 'http://localhost:8008/uploadFile'
                    }
                }                                                                 
            },
            tunes: ['textVariant'],
            data:this.contractData
        });