fix: clear 'delete' confirmation

[betodealmeida]

SUMMARY

Currently <DeleteModal/> does not clear the "delete" confirmation after a deletion. This means that:

1. User selects charts using "bulk select"
2. User clicks "DELETE"
3. User types "delete" to confirm
4. Charts are deleted
5. User selects more charts using "bulk select"
6. User clicks "DELETE"
7. The modal shows up with the "delete" confirmation is already populated!

I changed the component so that the text in the <Input/> component is managed, clearing it when the modal is hidden or after a delete.

I also changed it so that users can press "return" to delete, once they've confirmed, instead of forcing users to click the button.

BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF

Before:

bulk_delete_before.mov

After:

bulk_delete_after.mov

TESTING INSTRUCTIONS

Adding tests.

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

[codecov]

Codecov Report

Merging #17345 (17d6aab) into master (1fbce88) will increase coverage by 0.00%.
The diff coverage is 85.71%.

@@           Coverage Diff           @@
##           master   #17345   +/-   ##
=======================================
  Coverage   77.13%   77.14%           
=======================================
  Files        1036     1036           
  Lines       55729    55740   +11     
  Branches     7627     7628    +1     
=======================================
+ Hits        42989    42998    +9     
- Misses      12484    12486    +2     
  Partials      256      256           

Flag	Coverage Δ
javascript	71.42% <85.71%> (+<0.01%)	⬆️

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

Impacted Files	Coverage Δ
...rset-frontend/src/components/DeleteModal/index.tsx	92.00% <85.71%> (-8.00%)	⬇️

---

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 1fbce88...17d6aab. Read the comment docs.

[eschutho]

this is a tricky thing.. so we would need to have a translation for the capitalized text and the lowercase?
I wonder if t('delete').toUpperCase() would work. (I see that this isn't new code, so it's prob fine to leave as is. It just got me thinking.)

[betodealmeida]

@eschutho this used to be much worse... before it didn't have the t() call, so we'd ask people in a different language, Por favor digite "apagar" para confirmar, but expected "delete" to unblock the dialog...

[eschutho]

Ha, yeah I remember when you noticed that. :)