fix: update svgr webpack config to use svg dimensions

[eschutho]

SUMMARY

This fix from a breaking change/regression after bumping the svgr/webpack package enables us to continue to use the width/height dimensions from the svg image itself. Ref: https://react-svgr.com/docs/options/#icon

Changes: https://github.com/apache/superset/pull/24648/files#diff-3834c36280e1af5685801f3357578aaec5a110699a2b8eb97844c56b4400c091

BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF

Before:

After:

TESTING INSTRUCTIONS

Load a chart with icons. There may be other places in the application that were affected that haven't yet been identified, but by doing a code search for svg images with width and height we should be able to find others.

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

[eschutho]

/testenv up

[github-actions]

@eschutho Container image not yet published for this PR. Please try again when build is complete.

[github-actions]

@eschutho Ephemeral environment creation failed. Please check the Actions logs for details.

[eschutho]

/testenv up

[github-actions]

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

[codecov]

Codecov Report

Merging #24747 (09a1982) into master (5878c11) will decrease coverage by 1.66%.
The diff coverage is 68.84%.

❗ Current head 09a1982 differs from pull request most recent head a80b38c. Consider uploading reports for the commit a80b38c to get more accurate results

@@            Coverage Diff             @@
##           master   #24747      +/-   ##
==========================================
- Coverage   68.89%   67.23%   -1.66%     
==========================================
  Files        1901     1902       +1     
  Lines       73925    73939      +14     
  Branches     8183     8176       -7     
==========================================
- Hits        50931    49716    -1215     
- Misses      20873    22110    +1237     
+ Partials     2121     2113       -8     

Flag	Coverage Δ
javascript	55.76% <59.25%> (+0.04%)	⬆️
unit	?

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

Impacted Files	Coverage Δ
...src/components/ColumnTypeLabel/ColumnTypeLabel.tsx	100.00% <ø> (ø)
...d/packages/superset-ui-chart-controls/src/index.ts	100.00% <ø> (ø)
...-chart-controls/src/sections/advancedAnalytics.tsx	14.28% <ø> (ø)
...rset-ui-chart-controls/src/sections/chartTitle.tsx	100.00% <ø> (ø)
...legacy-plugin-chart-partition/src/controlPanel.tsx	25.00% <ø> (ø)
...gins/legacy-plugin-chart-rose/src/controlPanel.tsx	50.00% <ø> (ø)
...gins/legacy-preset-chart-nvd3/src/NVD3Controls.tsx	100.00% <ø> (ø)
.../BigNumber/BigNumberWithTrendline/controlPanel.tsx	16.66% <ø> (ø)
...s/plugin-chart-echarts/src/Funnel/controlPanel.tsx	66.66% <ø> (ø)
...ns/plugin-chart-echarts/src/Gauge/controlPanel.tsx	66.66% <ø> (ø)
... and 43 more

... and 97 files with indirect coverage changes

📣 We’re building smart automated test selection to slash your CI/CD build times. Learn more

[john-bodley]

@eschutho do you see #24740? It seems @mistercrunch had an alternative formulation.

[mistercrunch]

are the defaults good? do we want to be explicit as in

options: {
  // making sure that svgo isn't setting width:1em
  icon: false,
  // don't allow svgo to alter/opitmize the svg 
  svgo: false,
},

[eschutho]

Yeah, good idea. The default for svgo is actually true and I don't think it will break anything in this use case if changed to false, but I'll add in the default for icon with a comment.

[eschutho]

@eschutho do you see #24740? It seems @mistercrunch had an alternative formulation.

Thanks @john-bodley, yeah I saw @mistercrunch's PR as well. This PR just reverts the functionality back to the original behavior where it does not override the width/height if it's in the svg file. @mistercrunch, @rusackas and I talked a bit offline about what the long-term behavior should be and agreed that we'll merge both PRs with the idea that if you wanted to use height/width in the svg that it should render in the html, or if you want to override the values with css, you can do that as well.

[rusackas]

LGTM!

[github-actions]

Ephemeral environment shutdown and build artifacts deleted.