refactor: Add AutoSizer to react-virtualized Grid

[hughhhh]

SUMMARY

The react-virtualized.Grid was having rendering issues due to setting an outrageous with on the div. To fix this we've add the AutoSizer component to dynamically set the width based upon the users client size.

BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF

Before

master.mov

After

improv.mov

TESTING INSTRUCTIONS

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 #17606 (b2682ca) into master (95177d7) will increase coverage by 0.04%.
The diff coverage is 100.00%.

@@            Coverage Diff             @@
##           master   #17606      +/-   ##
==========================================
+ Coverage   68.52%   68.57%   +0.04%     
==========================================
  Files        1588     1588              
  Lines       64947    64948       +1     
  Branches     6963     6963              
==========================================
+ Hits        44505    44537      +32     
+ Misses      18552    18525      -27     
+ Partials     1890     1886       -4     

Flag	Coverage Δ
hive	81.61% <ø> (ø)
javascript	57.03% <100.00%> (-0.04%)	⬇️
mysql	82.03% <ø> (ø)
postgres	82.04% <ø> (ø)
presto	81.91% <ø> (?)
python	82.53% <ø> (+0.14%)	⬆️
sqlite	81.72% <ø> (ø)

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

Impacted Files	Coverage Δ
...src/components/FilterableTable/FilterableTable.tsx	66.85% <100.00%> (-7.29%)	⬇️
superset/models/core.py	90.00% <0.00%> (+0.73%)	⬆️
superset/connectors/sqla/models.py	88.42% <0.00%> (+1.34%)	⬆️
superset/db_engine_specs/presto.py	90.39% <0.00%> (+6.05%)	⬆️

---

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 95177d7...b2682ca. Read the comment docs.

[geido]

/testenv up

[github-actions]

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

[geido]

I would like to see how the problem looked like before these changes as I cannot reproduce it. It would be great to add a video or a screenshot here. However, the code looks fine and also manual testing seems ok. Thank you!

[hughhhh]

I would like to see how the problem looked like before these changes as I cannot reproduce it. It would be great to add a video or a screenshot here. However, the code looks fine and also manual testing seems ok. Thank you!

Just added videos, let me know what you think

[AAfghahi]

oh you got rid of the two separate divs (and also got rid of their classnames). Has that affected any of the css for right and left Column?

[hughhhh]

For what I can see the class was mostly around positioning from the react virtualized, but the styling wise doesn't effect the component

[github-actions]

Ephemeral environment shutdown and build artifacts deleted.