Map automatic coupled to ui theme

Deltares · Mar 29, 2024 · c612dcd · c612dcd
1 parent 128b6de
commit c612dcd
Showing 1 changed file with 3 additions and 3 deletions.
diff --git a/src/services/useBaseLayers/index.ts b/src/services/useBaseLayers/index.ts
@@ -2,7 +2,7 @@ import type { MaybeRefOrGetter, ShallowRef } from 'vue'
 import { shallowRef, toValue, watchEffect } from 'vue'
 import Basemaps from '@/assets/base-layers.json'
 import { MglDefaults } from 'vue-maplibre-gl'
-import { usePreferredDark } from '@vueuse/core'
+import { useDark } from '@vueuse/core'
 
 export interface UseBaseLayersReturn {
   baseLayerStyle: ShallowRef<string | object>
@@ -15,15 +15,15 @@ export function useBaseLayers(
   const baseLayerStyle = shallowRef<string | object>(MglDefaults.style)
   const baseLayers = shallowRef<(string | object)[]>(Basemaps.baseLayers)
 
-  const prefersDark = usePreferredDark()
+  const isDark = useDark()
 
   watchEffect(() => {
     const _layerId = toValue(layerId)
     const layerDefinition = Basemaps.baseLayers.find(
       (layer: any) => layer.id === _layerId,
     )
     if (layerDefinition?.automatic) {
-      if (prefersDark.value === true) {
+      if (isDark.value === true) {
         const themedLayer = Basemaps.baseLayers.find(
           (layer: any) => layer.id === layerDefinition.automatic.dark,
         )