From 7c6224fd3edf4cd833b62ac7ee70b5477ac456e7 Mon Sep 17 00:00:00 2001
From: Pieter Vander Vennet <pietervdvn@posteo.net>
Date: Tue, 3 Dec 2024 19:26:29 +0100
Subject: [PATCH] Feature(inspector): add link in menu, add icon

---
 langs/en.json                          | 3 +++
 src/UI/BigComponents/MenuDrawer.svelte | 6 ++++++
 src/UI/InspectorGUI.svelte             | 4 +++-
 3 files changed, 12 insertions(+), 1 deletion(-)

diff --git a/langs/en.json b/langs/en.json
index bad4e5e3d0..256c49b5a9 100644
--- a/langs/en.json
+++ b/langs/en.json
@@ -669,6 +669,9 @@
         "pickTheme": "Pick a theme below to get started.",
         "title": "MapComplete"
     },
+    "inspector": {
+        "menu": "Inspect a contributor"
+    },
     "move": {
         "cancel": "Select a different reason",
         "cannotBeMoved": "This feature cannot be moved.",
diff --git a/src/UI/BigComponents/MenuDrawer.svelte b/src/UI/BigComponents/MenuDrawer.svelte
index b11cd12895..cb2031d231 100644
--- a/src/UI/BigComponents/MenuDrawer.svelte
+++ b/src/UI/BigComponents/MenuDrawer.svelte
@@ -50,6 +50,7 @@
   import Squares2x2 from "@babeard/svelte-heroicons/mini/Squares2x2"
   import EnvelopeOpen from "@babeard/svelte-heroicons/mini/EnvelopeOpen"
   import PanoramaxLink from "./PanoramaxLink.svelte"
+  import MagnifyingGlassCircle from "@babeard/svelte-heroicons/outline/MagnifyingGlassCircle"
 
   export let state: ThemeViewState
   let userdetails = state.osmConnection.userDetails
@@ -262,6 +263,11 @@
       </Page>
     </div>
 
+    <a class="flex" href={window.location.protocol + "//" + window.location.host + "/inspector.html"}>
+      <MagnifyingGlassCircle class="mr-2 h-6 w-6" />
+      <Tr t={Translations.t.inspector.menu} />
+    </a>
+
     <a class="flex" href="https://github.com/pietervdvn/MapComplete/" target="_blank">
       <Github class="h-6 w-6" />
       <Tr t={Translations.t.general.attribution.gotoSourceCode} />
diff --git a/src/UI/InspectorGUI.svelte b/src/UI/InspectorGUI.svelte
index 1afa7ba5bb..1a27816657 100644
--- a/src/UI/InspectorGUI.svelte
+++ b/src/UI/InspectorGUI.svelte
@@ -26,6 +26,7 @@
   import Page from "./Base/Page.svelte"
   import PreviouslySpiedUsers from "./History/PreviouslySpiedUsers.svelte"
   import { OsmConnection } from "../Logic/Osm/OsmConnection"
+  import MagnifyingGlassCircle from "@babeard/svelte-heroicons/outline/MagnifyingGlassCircle"
 
   let username = QueryParameters.GetQueryParameter("user", undefined, "Inspect this user")
   let step = new UIEventSource<"waiting" | "loading" | "done">("waiting")
@@ -123,7 +124,8 @@
 <div class="flex flex-col w-full h-full">
 
   <div class="flex gap-x-2 items-center low-interaction p-2">
-    <h1 class="flex-shrink-0">Inspect contributor</h1>
+    <MagnifyingGlassCircle class="w-12 h-12"/>
+    <h1 class="flex-shrink-0 m-0 mx-2">Inspect contributor</h1>
     <ValidatedInput type="string" value={username} on:submit={() => load()} />
     {#if loadingData}
       <Loading />