Custom source for ROSM component

[itsdapi]

Vanilla ol has a feature that can load different source of osm map by giving url.

export const geovisBaseLayer = new TileLayer({
  source: new OSM({
    url: `https://tiles1.geovisearth.com/base/v1/vec/{z}/{x}/{y}?format=webp&tmsIds=w&token=${config.mapToken}`,
  }),
});

Here if can provide a props to access the source would be an lazy option not to new a custom layer lol😆

export default class ROSM extends LayerRaster<ROSMProps> {
    source: OSM;

    constructor(props: Readonly<ROSMProps>, context?: React.Context<RContextType>) {
        super(props, context);
        this.source = new OSM();
        this.ol = new LayerTile({source: this.source});
        this.eventSources = [this.ol, this.source];
    }

    protected refresh(prevProps?: ROSMProps): void {
        super.refresh(prevProps);
        this.ol.setProperties({label: 'OpenStreetMap'});
    }
}

[itsdapi]

never mind it was pretty simple

export default function GeoVisBaseLayer() {
  return (
    <RLayerTile url={`https://tiles1.geovisearth.com/base/v1/vec/{z}/{x}/{y}?format=webp&tmsIds=w&token=${config.mapToken}`} />
  );
}