Fix: fix inspector

src/UI/History/History.svelte

@@ -30,10 +30,11 @@
           return true
         }
         console.log(
-          "Checking if ",
+          "Checking if",
           step.tags["_last_edit:contributor"],
           "is contained in",
-          onlyShowChangesBy
+          onlyShowChangesBy,
+          usernames.has(step.tags["_last_edit:contributor"])
         )
         return usernames.has(step.tags["_last_edit:contributor"])
       })
@@ -49,7 +50,7 @@
    * These layers are only shown if there are tag changes as well
    */
   const ignoreLayersIfNoChanges: ReadonlySet<string> = new Set(["walls_and_buildings"])
-  const t = Translations.t.inspector.previousContributors
+  const t = Translations.t.inspector
 </script>
 
 {#if !$allGeometry || !ignoreLayersIfNoChanges.has($lastStep?.layer?.id)}

src/UI/History/PreviouslySpiedUsers.svelte

@@ -5,7 +5,8 @@
   import { createEventDispatcher } from "svelte"
   import { XCircleIcon } from "@babeard/svelte-heroicons/solid"
   import AccordionSingle from "../Flowbite/AccordionSingle.svelte"
-  import Dropdown from "../Base/Dropdown.svelte"
+  import Translations from "../i18n/Translations"
+  import Tr from "../Base/Tr.svelte"
 
   export let osmConnection: OsmConnection
   export let inspectedContributors: UIEventSource<
@@ -41,23 +42,32 @@
     inspectedContributors.data.sort((a, b) => (a[key] ?? "").localeCompare(b[key] ?? ""))
     inspectedContributors.ping()
   }
+
+  const t = Translations.t.inspector.previouslySpied
 </script>
 
 <LoginToggle ignoreLoading state={{ osmConnection }}>
   <table class="w-full">
     <tr>
       <td>
-        <button class="as-link cursor-pointer" on:click={() => sort("name")}>Contributor</button>
-      </td>
-      <td>
-        <button class="as-link cursor-pointer" on:click={() => sort("visitedTime")}>
-          Visited time
+        <button class="as-link cursor-pointer" on:click={() => sort("name")}>
+          <Tr t={t.username} />
         </button>
       </td>
       <td>
-        <button class="as-link cursor-pointer" on:click={() => sort("label")}>Label</button>
+        <button class="as-link cursor-pointer" on:click={() => sort("visitedTime")}>
+          <Tr t={t.time} />
+
+        </button>
+      </td>
+      <td>
+        <button class="as-link cursor-pointer" on:click={() => sort("label")}>
+          <Tr t={t.label} />
+        </button>
+      </td>
+      <td>
+        <Tr t={t.remove} />
       </td>
-      <td>Remove</td>
     </tr>
     {#each $inspectedContributors as c}
       <tr>
@@ -85,7 +95,8 @@
   <AccordionSingle>
     <div slot="header">Labels</div>
     {#if $labels.length === 0}
-      No labels
+      <Tr t={t.noLabels} />
+
     {:else}
       {#each $labels as label}
         <div class="mx-2">
@@ -102,7 +113,8 @@
               )
             }}
           >
-            See all changes for these users
+            <Tr t={t.allChanges} />
+
           </button>
         </div>
       {/each}
@@ -115,7 +127,7 @@
         class:disabled={!(labelField?.length > 0)}
         class="disabled shrink-0"
       >
-        Add label
+        <Tr t={t.addLabel} />
       </button>
     </div>
   </AccordionSingle>

src/UI/InspectorGUI.svelte

@@ -28,6 +28,7 @@
   import Translations from "./i18n/Translations"
   import Tr from "./Base/Tr.svelte"
 
+  console.log("Loading inspector GUI")
   let username = QueryParameters.GetQueryParameter("user", undefined, "Inspect this user")
   let step = new UIEventSource<"waiting" | "loading" | "done">("waiting")
   let map = new UIEventSource<MlMap>(undefined)
@@ -121,7 +122,7 @@
   const t = Translations.t.inspector
 </script>
 
-<div class="flex h-full w-full flex-col">
+<div class="flex h-screen w-full flex-col">
   <div class="low-interaction flex items-center gap-x-2 p-2">
     <MagnifyingGlassCircle class="h-12 w-12" />
     <h1 class="m-0 mx-2 flex-shrink-0">
@@ -192,7 +193,7 @@
             <XCircleIcon class="h-6 w-6" on:click={() => selectedElement.set(undefined)} />
           </div>
 
-          <History onlyShowChangesBy={$username} id={$selectedElement.properties.id} />
+          <History onlyShowChangesBy={$username.split(";")} id={$selectedElement.properties.id} />
         </TitledPanel>
       </Drawer>
     {/if}
@@ -218,7 +219,9 @@
 </div>
 
 <Page shown={showPreviouslyVisited}>
-  <div slot="header">Earlier inspected constributors</div>
+  <div slot="header">
+    <Tr t={t.previouslySpied.title} />
+  </div>
   <PreviouslySpiedUsers
     {osmConnection}
     {inspectedContributors}

src/UI/InspectorGUI.ts

@@ -1,5 +1,7 @@
 import InspectorGUI from "./InspectorGUI.svelte"
 
+const target = document.getElementById("main")
+target.innerHTML = ""
 new InspectorGUI({
-    target: document.getElementById("main"),
+    target
 })