title: Is there a way to upload a file in react exactly where the the pointer is focused on?
body: <p>I am learning MERN stack by building a blog application. Everything has gone well so far. I would like to add a feature that allow users to upload a file such as video but they should be able to decide where that file should appear in their blog post using the pointer focus. For instance, if a user has written a blog post and in the middle of the post, the user wants to upload a file like an image, the user should be able to upload the file and the file would display in the middle of the blog post. If the user wants the image to display at the beginning, the user simply needs to focus the pointer at the beginning of the post. Currently, user can upload image but it will strictly appear at the top of the post because that is where I placed the <code>input file</code> html code.</p>
  <p>I don't know if this explains what I'm looking for. I tried searching online but couldn't find anything related. Maybe I do not know the exact words to use for the search.
  You can help me with link or search terms or explanation on how I can get this done. Thank you so much.</p>