From f6dca4c51ba2d0484eeb56d0b31468cb732991c9 Mon Sep 17 00:00:00 2001
From: Danny Koppenhagen <Danny.Koppenhagen@deutschebahn.com>
Date: Wed, 7 Jun 2023 10:33:14 +0200
Subject: [PATCH] refactor: make heatmapLayer and vectorLayer not a ref

BREAKING CHANGE:
potentially exposed `layer`, `heatmapLayer` and `vectorLayer` are not refs anymore.
They can now be used without the need of `.value`
---
 src/components/layers/OlAnimatedClusterLayer.vue    |  4 ++--
 src/components/layers/OlVectorLayer.vue             | 10 +++++-----
 src/components/map/OlFeature.vue                    |  2 +-
 src/components/mapControls/OlAttributionControl.vue |  2 +-
 src/components/sources/OlSourceVector.vue           | 10 +++++-----
 src/composables/usePropsAsObjectProperties.ts       |  2 +-
 src/demos/ImageWMSDemo.vue                          |  2 +-
 src/demos/SnapModifyDemo.vue                        |  1 -
 8 files changed, 16 insertions(+), 17 deletions(-)

diff --git a/src/components/layers/OlAnimatedClusterLayer.vue b/src/components/layers/OlAnimatedClusterLayer.vue
index 32a8a05a..b8072fe3 100644
--- a/src/components/layers/OlAnimatedClusterLayer.vue
+++ b/src/components/layers/OlAnimatedClusterLayer.vue
@@ -61,13 +61,13 @@ watch(properties, () => {
 });
 
 onMounted(() => {
-  map.addLayer(vectorLayer.value);
+  map.addLayer(vectorLayer);
   vectorLayer.value.changed();
   map.changed();
 });
 
 onUnmounted(() => {
-  map.removeLayer(vectorLayer.value);
+  map.removeLayer(vectorLayer);
 });
 
 provide("vectorLayer", source);
diff --git a/src/components/layers/OlVectorLayer.vue b/src/components/layers/OlVectorLayer.vue
index 971e6c7d..dba6539a 100644
--- a/src/components/layers/OlVectorLayer.vue
+++ b/src/components/layers/OlVectorLayer.vue
@@ -5,7 +5,7 @@
 </template>
 
 <script setup>
-import { inject, provide, onUnmounted, onMounted, watch, computed } from "vue";
+import { inject, provide, onUnmounted, onMounted, watch } from "vue";
 
 import VectorLayer from "ol/layer/Vector";
 import usePropsAsObjectProperties from "@/composables/usePropsAsObjectProperties";
@@ -34,18 +34,18 @@ const map = inject("map");
 
 const { properties } = usePropsAsObjectProperties(props);
 
-const vectorLayer = computed(() => new VectorLayer(properties));
+const vectorLayer = new VectorLayer(properties);
 
 watch(properties, () => {
-  vectorLayer.value.setProperties(properties);
+  vectorLayer.setProperties(properties);
 });
 
 onMounted(() => {
-  map.addLayer(vectorLayer.value);
+  map.addLayer(vectorLayer);
 });
 
 onUnmounted(() => {
-  map.removeLayer(vectorLayer.value);
+  map.removeLayer(vectorLayer);
 });
 
 provide("vectorLayer", vectorLayer);
diff --git a/src/components/map/OlFeature.vue b/src/components/map/OlFeature.vue
index 30227401..87ce492a 100644
--- a/src/components/map/OlFeature.vue
+++ b/src/components/map/OlFeature.vue
@@ -41,7 +41,7 @@ watch(vectorSource, (newVal, oldVal) => {
 onMounted(() => {
   vectorSource.value.addFeature(feature.value);
   if (animation != null) {
-    vectorLayer.value.animateFeature(feature.value, animation.value);
+    vectorLayer.animateFeature(feature.value, animation.value);
   }
 });
 
diff --git a/src/components/mapControls/OlAttributionControl.vue b/src/components/mapControls/OlAttributionControl.vue
index 42d78ca2..5ff42485 100644
--- a/src/components/mapControls/OlAttributionControl.vue
+++ b/src/components/mapControls/OlAttributionControl.vue
@@ -5,7 +5,7 @@
 <script setup>
 import { Attribution } from "ol/control";
 import useControl from "@/composables/useControl";
-import { useAttrs, useSlots } from "vue";
+import { useAttrs } from "vue";
 
 const props = defineProps({
   className: {
diff --git a/src/components/sources/OlSourceVector.vue b/src/components/sources/OlSourceVector.vue
index 8c259c1d..19ca6736 100644
--- a/src/components/sources/OlSourceVector.vue
+++ b/src/components/sources/OlSourceVector.vue
@@ -57,9 +57,9 @@ const { properties } = usePropsAsObjectProperties(props);
 const source = computed(() => new VectorSource(properties));
 
 const applySource = () => {
-  layer.value.setSource(null);
-  layer.value.setSource(source.value);
-  layer.value.changed();
+  layer.setSource(null);
+  layer.setSource(source.value);
+  layer.changed();
 };
 watch(properties, () => {
   applySource();
@@ -70,11 +70,11 @@ watch(layer, () => {
 });
 
 onMounted(() => {
-  layer.value.setSource(source.value);
+  layer.setSource(source.value);
 });
 
 onUnmounted(() => {
-  layer.value.setSource(null);
+  layer.setSource(null);
 });
 
 provide("vectorSource", source);
diff --git a/src/composables/usePropsAsObjectProperties.ts b/src/composables/usePropsAsObjectProperties.ts
index fb533164..8fc75ca5 100644
--- a/src/composables/usePropsAsObjectProperties.ts
+++ b/src/composables/usePropsAsObjectProperties.ts
@@ -1,4 +1,4 @@
-import { toRefs, watch, reactive, type ToRefs, ref, type Ref } from "vue";
+import { toRefs, watch, reactive, type ToRefs, ref } from "vue";
 
 /**
  * We can't use 'style' as a component prop since it's a reserved property
diff --git a/src/demos/ImageWMSDemo.vue b/src/demos/ImageWMSDemo.vue
index cb613abc..7148b013 100644
--- a/src/demos/ImageWMSDemo.vue
+++ b/src/demos/ImageWMSDemo.vue
@@ -28,7 +28,7 @@
   </ol-map>
 </template>
 
-<script>
+<script setup>
 import { ref } from "vue";
 
 const zoom = ref(4);
diff --git a/src/demos/SnapModifyDemo.vue b/src/demos/SnapModifyDemo.vue
index 73f711fd..c8e2f2b0 100644
--- a/src/demos/SnapModifyDemo.vue
+++ b/src/demos/SnapModifyDemo.vue
@@ -130,7 +130,6 @@ function vectorStyle() {
   return style;
 }
 
-const geoJsonFormat = new GeoJSON();
 const selectConditions = inject("ol-selectconditions");
 const selectCondition = selectConditions.click;