fix(widget-string): fix cursor jumping to end of line

[iansinnott]

Closes #3578
Closes #4539

The approach taken here seems suboptimal since it's generally not necessary when writing React components to manually update cursor location. Please let me know if anyone has a better solution.

I did do some debugging to try to identify the root issue, but did not find the root cause.

The summary of what I found is this: It seems that nested widgets undergo additional rendering because they trigger a state update for their parent component as well as themself. For example, when editing the alt text of an image using the built-in image block element the updating markdown string causes the parent markdown widget to update.

Summary

This PR fixes the cursor problem described in detail in the linked issues. To summarize: Nested inputs within any collection would consistently force the cursor to the end of the line. Making nested inputs unusable for content editing.

"Nested" refers to text inputs within another widget—the alt text input element on the image widget for example.

Test plan

No automated tests have been created. I tested this by first running yarn start and then inserting an image into the markdown widget. I inserted an image into a post in the "Posts" collection of the test server, then typed in the "Alt text" field. The cursor remained where you would expect it to remain.

Although the URL may change, it looks something like: http://localhost:8080/#/collections/posts/entries/2020-11-20-post-number-19

[erezrokah]

Thanks @iansinnott, while not the optimal solution - it does work very well.
An alternative is to have widgets manage their own state which is a bigger undertaking.
I pushed an additional commit to fix linting

[iansinnott]

Thanks @erezrokah!