Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(deckgl): deckgl unable to load map #17851

Merged
merged 2 commits into from
Dec 23, 2021

Conversation

zhaoyongjie
Copy link
Member

@zhaoyongjie zhaoyongjie commented Dec 22, 2021

SUMMARY

Deck.gl unable to load map after migrating to the main repo.

This is due to a conflict between the react-map-gl on which legacy-preset-chart-deckgl and legacy-plugin-chart-map-box depend.

This PR is an emergency fix, and we have to upgrade react-map-gl in the future

Current dependency tree for those modules

├─┬ @superset-ui/legacy-plugin-chart-map-box@0.18.25 -> ./plugins/legacy-plugin-chart-map-box
│ ├── @superset-ui/chart-controls@0.18.25 deduped -> ./packages/superset-ui-chart-controls
│ ├── @superset-ui/core@0.18.25 deduped -> ./packages/superset-ui-core
│ ├── mapbox-gl@0.53.1 invalid: "^2.4.0" from plugins/legacy-preset-chart-deckgl
│ ├── prop-types@15.7.2 deduped
│ ├── react-map-gl@4.1.16 invalid: "^6.1.16" from plugins/legacy-preset-chart-deckgl
│ ├── react@16.14.0 deduped
│ ├── supercluster@4.1.1
│ └── viewport-mercator-project@6.2.3

├─┬ @superset-ui/legacy-preset-chart-deckgl@0.4.13 -> ./plugins/legacy-preset-chart-deckgl
│ ├── @math.gl/web-mercator@3.5.6
│ ├── @superset-ui/chart-controls@0.18.25 deduped -> ./packages/superset-ui-chart-controls
│ ├── @superset-ui/core@0.18.25 deduped -> ./packages/superset-ui-core
│ ├── @types/d3-array@2.9.0
│ ├── bootstrap-slider@10.4.0 deduped
│ ├── d3-array@1.2.4 deduped
│ ├── d3-color@1.4.1 deduped
│ ├── d3-scale@3.3.0
│ ├── deck.gl@8.5.2
│ ├── jquery@3.6.0 deduped
│ ├── lodash@4.17.21 deduped
│ ├── mapbox-gl@0.53.1 deduped invalid: "^2.4.0" from plugins/legacy-preset-chart-deckgl
│ ├── moment@2.29.1 deduped
│ ├── mousetrap@1.6.2 deduped
│ ├── prop-types@15.7.2 deduped
│ ├── react-bootstrap-slider@2.1.5
│ ├── react-dom@16.14.0 deduped
│ ├── react-map-gl@4.1.16 deduped invalid: "^6.1.16" from plugins/legacy-preset-chart-deckgl
│ ├── react@16.14.0 deduped
│ ├── underscore@1.12.0
│ ├── urijs@1.19.6 deduped
│ └── xss@1.0.8

BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF

After

image

Before

image

TESTING INSTRUCTIONS

  • CI
  • Storybook
  • Local testing

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

@@ -30,7 +30,6 @@
"dependencies": {
"@superset-ui/chart-controls": "0.18.25",
"@superset-ui/core": "0.18.25",
"mapbox-gl": "^0.53.0",
Copy link
Member Author

@zhaoyongjie zhaoyongjie Dec 22, 2021

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

from root src/node_module get this module

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Could we move these to peerDependencies to make sure users of the plugin pull in the relevant deps?

Copy link
Member Author

@zhaoyongjie zhaoyongjie Dec 23, 2021

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

mapbox-gl is a dependency from the react-map-gl. The root cause for this issue is that mapbox-gl version is incompatible between legacy-plugin-chart-map-box and legacy-preset-chart-deckgl.

When we removed mapbox-gl in both packages, npm will auto-resolve the conflict. If the user installs those packages as standalone, mapbox-gl will install by default.

legacy-plugin-chart-map-box dependencies tree

(superset) yongjie.zhao@:superset-frontend$ npm ls --depth 1 | grep -A 30 'map-box'
....
....
├─┬ @superset-ui/legacy-plugin-chart-map-box@0.18.25 -> ./plugins/legacy-plugin-chart-map-box
│ ├── @superset-ui/chart-controls@0.18.25 deduped -> ./packages/superset-ui-chart-controls
│ ├── @superset-ui/core@0.18.25 deduped -> ./packages/superset-ui-core
│ ├── prop-types@15.7.2 deduped
│ ├─┬ react-map-gl@4.1.16
│ │ ├── @babel/runtime@7.15.4 deduped
│ │ ├── mapbox-gl@0.54.1
│ │ ├── mjolnir.js@2.5.0
│ │ ├── prop-types@15.7.2 deduped
│ │ ├── react-virtualized-auto-sizer@1.0.2 deduped
│ │ ├── react@16.14.0 deduped invalid: "^15.5.4" from node_modules/omnibar
│ │ └── viewport-mercator-project@6.2.3 deduped
│ ├── react@16.14.0 deduped
│ ├─┬ supercluster@4.1.1
│ │ └── kdbush@2.0.1
│ └─┬ viewport-mercator-project@6.2.3
│   ├── @babel/runtime@7.15.4 deduped
│   └── gl-matrix@3.3.0
....

@@ -32,12 +32,10 @@
"deck.gl": "8.5.2",
"jquery": "^3.4.1",
"lodash": "^4.17.15",
"mapbox-gl": "^2.4.0",
Copy link
Member Author

@zhaoyongjie zhaoyongjie Dec 22, 2021

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

from root src/node_module get this module

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Echoing @villebro's comment, we may need this to be a peer dependency so that the plugin continues to work in contexts outside of Superset.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

the mapbox-gl come from react-map-gl, so we didn't need to add this.

"moment": "^2.20.1",
"mousetrap": "^1.6.1",
"prop-types": "^15.6.0",
"react-bootstrap-slider": "2.1.5",
"react-map-gl": "^6.1.16",
Copy link
Member Author

@zhaoyongjie zhaoyongjie Dec 22, 2021

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

from root src/node_module get this module

@codecov
Copy link

codecov bot commented Dec 22, 2021

Codecov Report

Merging #17851 (e91f70b) into master (9840fbf) will decrease coverage by 0.00%.
The diff coverage is n/a.

Impacted file tree graph

@@            Coverage Diff             @@
##           master   #17851      +/-   ##
==========================================
- Coverage   66.98%   66.98%   -0.01%     
==========================================
  Files        1609     1609              
  Lines       64865    64879      +14     
  Branches     6863     6866       +3     
==========================================
+ Hits        43448    43457       +9     
- Misses      19553    19556       +3     
- Partials     1864     1866       +2     
Flag Coverage Δ
javascript 53.77% <ø> (+<0.01%) ⬆️

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

Impacted Files Coverage Δ
...legacy-preset-chart-deckgl/src/DeckGLContainer.jsx 0.00% <ø> (ø)
...et-frontend/src/components/EditableTitle/index.tsx 71.79% <0.00%> (-1.29%) ⬇️
...end/src/components/Datasource/DatasourceEditor.jsx 68.93% <0.00%> (-0.17%) ⬇️
superset-frontend/src/chart/Chart.jsx 29.62% <0.00%> (ø)
superset-frontend/src/views/CRUD/alert/types.ts 100.00% <0.00%> (ø)
...rset-frontend/src/components/ReportModal/index.tsx 82.55% <0.00%> (ø)
...t-frontend/src/explore/reducers/getInitialState.ts 33.33% <0.00%> (ø)
...ntend/src/explore/components/ExploreChartPanel.jsx 14.66% <0.00%> (ø)
...nd/src/explore/components/ExploreViewContainer.jsx 2.32% <0.00%> (ø)
...frontend/src/views/CRUD/alert/AlertReportModal.tsx 53.96% <0.00%> (+0.42%) ⬆️
... and 1 more

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 9840fbf...e91f70b. Read the comment docs.

Copy link
Member

@villebro villebro left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ok makes sense, thanks for the detailed explanation!

@zhaoyongjie zhaoyongjie merged commit 52f5dcb into apache:master Dec 23, 2021
shcoderAlex pushed a commit to casual-precision/superset that referenced this pull request Feb 7, 2022
* fix(deckgl): deckgl unable to load map

* add react-map-gl in peerDependencies
bwang221 pushed a commit to casual-precision/superset that referenced this pull request Feb 10, 2022
* fix(deckgl): deckgl unable to load map

* add react-map-gl in peerDependencies
@mistercrunch mistercrunch added 🏷️ bot A label used by `supersetbot` to keep track of which PR where auto-tagged with release labels 🚢 1.5.0 labels Mar 13, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
🏷️ bot A label used by `supersetbot` to keep track of which PR where auto-tagged with release labels size/XS 🚢 1.5.0
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants