fix(TextControl/TextAreaControl): Make TextControl/TextAreaControl sync state.value from props.value

[Renderz]

SUMMARY

Make TextAreaControl component to be controlled, the props.value could be injected and be rendered correctly.

TextAreaControl should function the same way as TextControl.

I tested the cases mentioned here, and no interrupted.

BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF

Before:

2022-06-02.16.46.46.mov

After:

2022-06-02.16.47.24.mov

TESTING INSTRUCTIONS

Create a instance of TextAreaControl of which value is controlled, then trigger state changing.

TextAreaControl should render the changed value.

ADDITIONAL INFORMATION

• Has associated issue:
• Required feature flags:
• Changes UI
• Includes DB Migration (follow approval process in SIP-59)
  • Migration is atomic, supports rollback & is backwards-compatible
  • Confirm DB migration upgrade and downgrade tested
  • Runtime estimates and downtime expectations provided
• Introduces new feature or API
• Removes existing feature or API

[Renderz]

I checked that the core problem is that TextControl/TextAreaControl will not sync the state from props, and will cause that the value they display is not same as the value be given.

[rusackas]

@Renderz sorry this is still lingering... but it'll need a rebase to move forward. This should also help it pass CI. I'll move this to draft mode for now, but if it becomes ready for review again, I'll try to find more reviewers.

[rusackas]

This has sat untouched in draft mode for quite a while, so we'll go ahead and close it. We welcome you to reopen it if you want to contribute the change. Thank you for your contribution nonetheless!