From 5db8f11fd6c76d166f7a90a8d8e7c329fef4e4d9 Mon Sep 17 00:00:00 2001
From: "SPRINX0\\prochazka" <jan.prochazka@sprinx.com>
Date: Wed, 20 Nov 2024 08:16:13 +0100
Subject: [PATCH] dbappobj highlight

---
 packages/web/src/appobj/AppObjectCore.svelte      | 12 ++++++++++++
 .../web/src/appobj/DatabaseObjectAppObject.svelte |  2 +-
 .../web/src/widgets/AppObjectListHandler.svelte   | 15 ++++++++++++++-
 3 files changed, 27 insertions(+), 2 deletions(-)

diff --git a/packages/web/src/appobj/AppObjectCore.svelte b/packages/web/src/appobj/AppObjectCore.svelte
index c008f0e20..de91a73e2 100644
--- a/packages/web/src/appobj/AppObjectCore.svelte
+++ b/packages/web/src/appobj/AppObjectCore.svelte
@@ -14,6 +14,7 @@
   export let module = null;
 
   export let isBold = false;
+  export let isChoosed = false;
   export let isBusy = false;
   export let statusIcon = undefined;
   export let statusIconBefore = undefined;
@@ -71,11 +72,16 @@
   $: if (isBold && domDiv) {
     domDiv.scrollIntoView({ block: 'nearest', inline: 'nearest' });
   }
+
+  $: if (isChoosed && domDiv) {
+    domDiv.scrollIntoView({ block: 'nearest', inline: 'nearest' });
+  }
 </script>
 
 <div
   class="main"
   class:isBold
+  class:isChoosed
   draggable={true}
   on:click={handleClick}
   on:mouseup={handleMouseUp}
@@ -186,6 +192,12 @@
   .isBold {
     font-weight: bold;
   }
+  .isChoosed {
+    background-color: var(--theme-bg-3);
+  }
+  :global(.app-object-list-focused) .isChoosed {
+    background-color: var(--theme-bg-selected);
+  }
   .status {
     margin-left: 5px;
   }
diff --git a/packages/web/src/appobj/DatabaseObjectAppObject.svelte b/packages/web/src/appobj/DatabaseObjectAppObject.svelte
index 59d287a13..bb1e9c65f 100644
--- a/packages/web/src/appobj/DatabaseObjectAppObject.svelte
+++ b/packages/web/src/appobj/DatabaseObjectAppObject.svelte
@@ -921,7 +921,7 @@
   onPin={isPinned ? null : () => pinnedTables.update(list => [...list, data])}
   onUnpin={isPinned ? () => pinnedTables.update(list => list.filter(x => !testEqual(x, data))) : null}
   extInfo={getExtInfo(data)}
-  isBold={matchDatabaseObjectAppObject($selectedDatabaseObjectAppObject, data)}
+  isChoosed={matchDatabaseObjectAppObject($selectedDatabaseObjectAppObject, data)}
   on:click={() => handleClick()}
   on:middleclick={() => handleClick(true)}
   on:dblclick={() => handleClick(false, true)}
diff --git a/packages/web/src/widgets/AppObjectListHandler.svelte b/packages/web/src/widgets/AppObjectListHandler.svelte
index 555f5679b..398940997 100644
--- a/packages/web/src/widgets/AppObjectListHandler.svelte
+++ b/packages/web/src/widgets/AppObjectListHandler.svelte
@@ -7,6 +7,8 @@
   export let getSelectedObject;
   export let selectedObjectMatcher;
 
+  let isListFocused = false;
+
   function handleKeyDown(ev) {
     function selectByDiff(diff) {
       const selected = getSelectedObject();
@@ -26,7 +28,18 @@
   }
 </script>
 
-<div tabindex="0" on:keydown={handleKeyDown} class="wrapper">
+<div
+  tabindex="0"
+  on:keydown={handleKeyDown}
+  class="wrapper"
+  class:app-object-list-focused={isListFocused}
+  on:focus={() => {
+    isListFocused = true;
+  }}
+  on:blur={() => {
+    isListFocused = false;
+  }}
+>
   <slot />
 </div>