Feature: first working version of inspecting 360° images

src/UI/Image/LinkableImage.svelte

@@ -1,5 +1,6 @@
 <script lang="ts">
   import { UIEventSource } from "../../Logic/UIEventSource"
+  import type { Store } from "../../Logic/UIEventSource"
   import type { OsmTags } from "../../Models/OsmFeature"
   import type { SpecialVisualizationState } from "../SpecialVisualization"
   import type { P4CPicture } from "../../Logic/Web/NearbyImagesSearch"
@@ -16,7 +17,6 @@
   import LoginToggle from "../Base/LoginToggle.svelte"
   import { onDestroy } from "svelte"
   import { Utils } from "../../Utils"
-
   export let tags: UIEventSource<OsmTags>
   export let state: SpecialVisualizationState
   export let image: P4CPicture
@@ -24,7 +24,7 @@
   export let layer: LayerConfig
 
   export let highlighted: UIEventSource<string> = undefined
-
+  export let nearbyFeatures: Feature[] | Store<Feature[]> = []
   export let linkable = true
   let targetValue = Object.values(image.osmTags)[0]
   let isLinked = new UIEventSource(Object.values(tags.data).some((v) => targetValue === v))
@@ -36,8 +36,8 @@
     provider: AllImageProviders.byName(image.provider),
     date: new Date(image.date),
     id: Object.values(image.osmTags)[0],
+    isSpherical: image.details.isSpherical
   }
-
   async function applyLink(isLinked: boolean) {
     console.log("Applying linked image", isLinked, targetValue)
     const currentTags = tags.data
@@ -86,6 +86,7 @@
   <AttributedImage
     {state}
     image={providedImage}
+    {nearbyFeatures}
     imgClass="max-h-64 w-auto sm:h-32 md:h-64"
     attributionFormat="minimal"
   />