[Basemap-switcher] Use a image based basemap switcher

[artmarks]

See #361. Here is an example to show a image basemap switcher. I adjusted the test-basemap-switcher app to show the difference. Feedback and adjustments are welcome :)

[changeset-bot[bot]]

🦋 Changeset detected

Latest commit: 7268658311e2972933c099120acdbea4334e422a

The changes in this PR will be included in the next version bump.

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[arnevogt]

@artmarks

Thanks for creating this PR.

I just had a look on your updates. Generally, I think this is quite nice and should be part of the base packages. In my opinion there are a few points that can be improved before we merge it:

• it would be cleaner to have two separate components (BasemapSwitcher and ImageBasemapSwitcher)
  • solves the issue that some of the comp. property only apply to either default or image mode
  • both should be in the same package
  • the hooks (like useBasemap) and the actual logic can be refactored and moved to a new, separate file
• the actual code to switch the basemap should remain part of the component (and not in the properties)
  • currently you call map?.layers.activateBaseLayer(layer.id) and save the current selection in AppUI.tsx
  • configuration of thumbnails and labels
  • this could be a simple mapping from basemap id to image in the properties
  • ideally the thumbnail could be part of the layer itself
    • this is how it is done for the legend
    • each layer can provide a legend image or custom component in the layer attributes
    • see [0] and [1]
  • added/removed basemaps should be reflected in the UI
  • the behavior is better aligned with the current default basemap switcher
  • it is sufficient to display the label or a default thumbnail if nothing else is provided in the properties
    • if you really do not want to update the UI when the map model changes a flag syncWithMapModel could be introduced in the properties

[0] https://github.com/open-pioneer/trails-openlayers-base-packages/blob/main/src/samples/showcase/showcase-app/MapConfigProviderImpl.ts#L110
[1] https://github.com/open-pioneer/trails-openlayers-base-packages/blob/main/src/samples/showcase/showcase-app/CustomLegendItems.tsx