Unable to call JSX from custom function in react-quill

Question

I am using react-quill to build a text-editor. I saw that we can use a custom component for images instead of using their default 64 based encoded images.

            const modules = useMemo(() => ({
                toolbar: {
                  container: `#toolbar`,
                  handlers: {
                    image: () => imageHandler()
                  }
                }
              }), []);

This is simply saying to use the imageHandler function when the user clicks the image option from toolbar. However if I return a component from that function, nothing changes.

              const imageHandler = () => {
                 console.log('inside function'); //this prints
                 return <ImageUploader />; // nothing happens here
                };  

Even if I return a simple tag such as <h1>Test</h1> nothing happens. What is it that I am missing here? Is this not the correct way or react-quill does not support it? TIA