fix: Render value immediately on SQL Editor for Calculated Columns in Edit Dataset modal

[geido]

SUMMARY

It renders the typed value immediately to avoid a glitch with the cursor moving backward. It would also avoid delays with rendering the value while typing.

Fixes: #15675
Fixes: #13251

BEFORE

AFTER

DEV.Games.1.mp4

TESTING INSTRUCTIONS

1. Open a chart in Explore and open the Edit Dataset modal
2. Click on 'Calculated Columns'
3. Click on 'Add Item'
4. Expand the dropdown
5. Start typing in 'SQL Expression'
6. Make sure the text is typed immediately and the cursor does not move backward

ADDITIONAL INFORMATION

• Has associated issue: [Explore]Issue with Cursor Position in Edit Dataset's Calculated Column (SQL Expression) #15675 [Explore]severe input delay in Edit dataset modal  #13251
• 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

[geido]

@rosemarie-chiu @jinghua-qa

[codecov]

Codecov Report

Merging #15820 (f8f89e6) into master (6cb91ee) will decrease coverage by 0.00%.
The diff coverage is 83.33%.

@@            Coverage Diff             @@
##           master   #15820      +/-   ##
==========================================
- Coverage   77.05%   77.05%   -0.01%     
==========================================
  Files         984      984              
  Lines       51650    51654       +4     
  Branches     6991     6991              
==========================================
+ Hits        39801    39804       +3     
- Misses      11625    11626       +1     
  Partials      224      224              

Flag	Coverage Δ
javascript	71.81% <83.33%> (+<0.01%)	⬆️

Flags with carried forward coverage won't be shown. Click here to find out more.

Impacted Files	Coverage Δ
...rc/explore/components/controls/TextAreaControl.jsx	82.35% <83.33%> (-0.99%)	⬇️

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 6cb91ee...f8f89e6. Read the comment docs.

[geido]

/testenv up

[github-actions]

@geido Ephemeral environment spinning up at http://34.215.23.49:8080. Credentials are admin/admin. Please allow several minutes for bootstrapping and startup.

[rosemarie-chiu]

QA UI test. Yay! Cursor not moving back anymore.

BEFORE:

AFTER:

[junlincc]

@geido thanks for fixing the issue and spinning up the testenv for the team 🙏

LGTM ✅
After

Screen.Recording.2021-07-21.at.2.34.39.PM.mov

Before

Screen.Recording.2021-07-21.at.2.34.04.PM.mov

[pkdotson]

LGTM!

[github-actions]

Ephemeral environment shutdown and build artifacts deleted.

[rosemarie-chiu]

🏷 2021.29