How can I improve this code (efficiency, readability)?

/**

• • loops through sources and layers, saves added ones that are not mapbox styles
• • resets mapbox style to provided string https://docs.mapbox.com/api/maps/styles
• • adds back saved sources and layers */ function useChangeMapType(mapRef: mapboxgl.Map) { if (!mapRef) return;

return (mapboxStyleName: string) => { const savedSources = {}; const savedLayers = [];

// filter out mapbox styles leaving only added sources
const addedSourcesNames = Object.keys(mapRef.getStyle().sources).filter(
  sourceKey => !/mapbox:\/\/|composite/.test(sourceKey)
);

// check each layer to see if it's in addedSourcesNames
mapRef.getStyle().layers.forEach((layer: Layer) => {
  if (!addedSourcesNames.includes(layer.source)) return;

  const sourceName = layer.source;

  savedSources[sourceName] = (
    mapRef.getSource(sourceName) as Source
  ).serialize();

  savedLayers.push(layer);
});

// inside function in order to be able to remove event listener
function restoreSourcesAndLayers() {
  Object.entries(savedSources).forEach(([id, source]: SavedSources) => {
    mapRef.addSource(id, source);
  });

  savedLayers.forEach(layer => {
    mapRef.addLayer(layer);
  });

  mapRef.off('style.load', restoreSourcesAndLayers);
}

mapRef.on('style.load', restoreSourcesAndLayers);

mapRef.setStyle(`mapbox://styles/mapbox/${mapboxStyleName}`);

}; }

export default useChangeMapType;