how to hide toolbar?

[kobe651jp]

It's possible to hide toolbar?I can handle disable/enable ondemand. But toolbar couldn't.

I try to change react-summmernote/src/Summernote.jsx.Attempt to rebuild summernote in componentWillReceiveProps(nextProps) .It's no working.

The next source code is the code.

Any advice are welcome.

function RichTextEditor() {
  const ref = useRef();
  const [disable,setDisable] = useState(false);
  const onChange=(content)=> {
  }

  const handleClick = () =>{
    setDisable(!disable);
    if (disable) {
      ref.current.disable();
    }
    else {
      ref.current.enable();
    }
  }
  const handleInsert = () =>{
    ref.current.insertText('<h3>I like summernote</h3>');
  }
  return (
    <Layout>
      <button onClick={handleClick}>ReadOnly</button>
      <button onClick={handleInsert}>Insert</button>
      <ReactSummernote
        value=""
        options={{
          height: 200,
          tabsize: 2,
          placeholder: 'Type here...',
          dialogsFade: false,
          dialogsInBody: true,
          toolbar: disable?[]:[
            ['style', ['style']],
            ['font', ['strikethrough', 'superscript', 'subscript']],
            ['font', ['bold', 'italic', 'underline', 'clear']],
            ['fontsize', ['fontsize']],
            ['fontname', ['fontname']],
            ['color', ['color']],
            ['para', ['ul', 'ol', 'paragraph']],
            ['height', ['height']],
            ['table', ['table']],
            ['insert', ['link', 'picture', 'video']],
            ['view', ['fullscreen', 'codeview']]
          ],
          blockquoteBreakLevel:1,
          spellCheck:true,
          lang: 'ja-JP',
        }}
        onChange={onChange}
        onInit={editor => {
          console.log('onInit:', editor);
          ref.current = editor;
        }}
      />
    </Layout>
  );
}

componentWillReceiveProps(nextProps) {
    const { props } = this;

    const codeview = nextProps.codeview;
    const codeviewCommand = codeview ? 'codeview.activate' : 'codeview.deactivate';

    if (typeof nextProps.value === 'string' && props.value !== nextProps.value) {
      this.replace(nextProps.value);
    }
    if (nextProps.options !== this.state.options) {
      this.setState({
        options:nextProps.options
      })
      this.editor.summernote(nextProps.options);
    }
    if (typeof nextProps.disabled === 'boolean' && props.disabled !== nextProps.disabled) {
      this.toggleState(nextProps.disabled);
    }
    if (codeview !== props.codeview) {
      this.editor.summernote(codeviewCommand);
    }
  }