From d29df7ef9a3fabdeecb8ad972c2af6a729514b34 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tom=C3=A1=C5=A1=20Ml=C3=A1dek?= <t@mldk.cz>
Date: Sat, 27 Jul 2024 19:28:38 +0200
Subject: [PATCH] feat(webui): all column sections can now be hidden

---
 webui/src/lib/components/EntitySetEditor.svelte   | 4 ++--
 webui/src/lib/components/EntryView.svelte         | 2 +-
 webui/src/lib/components/InspectGroups.svelte     | 2 +-
 webui/src/lib/components/display/UpLink.svelte    | 2 ++
 webui/src/lib/components/utils/IconButton.svelte  | 2 +-
 webui/src/lib/components/utils/LabelBorder.svelte | 4 ++--
 webui/src/lib/components/utils/NotesEditor.svelte | 2 +-
 7 files changed, 10 insertions(+), 8 deletions(-)

diff --git a/webui/src/lib/components/EntitySetEditor.svelte b/webui/src/lib/components/EntitySetEditor.svelte
index 8ebd27d..7803e83 100644
--- a/webui/src/lib/components/EntitySetEditor.svelte
+++ b/webui/src/lib/components/EntitySetEditor.svelte
@@ -14,7 +14,7 @@
 	}>();
 
 	export let entities: string[];
-	export let hide = false;
+	export let hidden = false;
 
 	export let header = '';
 	export let icon: string | null = null;
@@ -40,7 +40,7 @@
 	}
 </script>
 
-<LabelBorder {hide}>
+<LabelBorder {hidden}>
 	<span slot="header"
 		>{#if icon}<Icon plain name={icon} />
 		{/if}{header}</span
diff --git a/webui/src/lib/components/EntryView.svelte b/webui/src/lib/components/EntryView.svelte
index ec7f930..1585055 100644
--- a/webui/src/lib/components/EntryView.svelte
+++ b/webui/src/lib/components/EntryView.svelte
@@ -84,7 +84,7 @@
 	}
 </script>
 
-<LabelBorder hide={entries.length === 0 && entities.length === 0}>
+<LabelBorder hidden={entries.length === 0 && entities.length === 0}>
 	<svelte:fragment slot="header-full">
 		<h3 class:highlighted>
 			{#if group}
diff --git a/webui/src/lib/components/InspectGroups.svelte b/webui/src/lib/components/InspectGroups.svelte
index cdb2830..9cae757 100644
--- a/webui/src/lib/components/InspectGroups.svelte
+++ b/webui/src/lib/components/InspectGroups.svelte
@@ -40,7 +40,7 @@
 	entities={Object.keys(groups)}
 	header={$i18n.t('Groups') || ''}
 	icon="link-alt"
-	hide={Object.keys(groups).length === 0}
+	hidden={Object.keys(groups).length === 0}
 	on:add={(e) => addGroup(e.detail)}
 	on:remove={(e) => removeGroup(e.detail)}
 	on:highlighted
diff --git a/webui/src/lib/components/display/UpLink.svelte b/webui/src/lib/components/display/UpLink.svelte
index 3e7c538..f8483d8 100644
--- a/webui/src/lib/components/display/UpLink.svelte
+++ b/webui/src/lib/components/display/UpLink.svelte
@@ -35,6 +35,8 @@
 	const addresses = context ? context.addresses : readable([]);
 
 	function onClick(ev: MouseEvent) {
+		ev.preventDefault();
+		ev.stopPropagation();
 		if (window.location.pathname.startsWith('/browse')) {
 			let newAddresses = $addresses.concat();
 
diff --git a/webui/src/lib/components/utils/IconButton.svelte b/webui/src/lib/components/utils/IconButton.svelte
index 4818758..9860630 100644
--- a/webui/src/lib/components/utils/IconButton.svelte
+++ b/webui/src/lib/components/utils/IconButton.svelte
@@ -13,7 +13,7 @@
 </script>
 
 <button
-	on:click
+	on:click|preventDefault|stopPropagation
 	class:active
 	class:outline
 	class:subdued
diff --git a/webui/src/lib/components/utils/LabelBorder.svelte b/webui/src/lib/components/utils/LabelBorder.svelte
index f84656c..3d30456 100644
--- a/webui/src/lib/components/utils/LabelBorder.svelte
+++ b/webui/src/lib/components/utils/LabelBorder.svelte
@@ -1,8 +1,8 @@
 <script lang="ts">
 	import { slide } from 'svelte/transition';
 
-	export let hide = false;
-	let hidden = true;
+	export let hide = true;
+	export let hidden = true;
 </script>
 
 <section class="labelborder" class:hide class:hidden>
diff --git a/webui/src/lib/components/utils/NotesEditor.svelte b/webui/src/lib/components/utils/NotesEditor.svelte
index e535675..7fde3ba 100644
--- a/webui/src/lib/components/utils/NotesEditor.svelte
+++ b/webui/src/lib/components/utils/NotesEditor.svelte
@@ -34,7 +34,7 @@
 	}
 </script>
 
-<LabelBorder hide={!notes?.length}>
+<LabelBorder hidden={!notes?.length}>
 	<span slot="header"><Icon plain name="note" /> {$i18n.t('Notes')}</span>
 	<div class="notes" contenteditable on:input={onInput} bind:this={contentEl}>
 		{#each (notes || '\n').split('\n') as line, idx}