From 5f9439a9e0b528b2eb588057a1f13e3630bc9c73 Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Sat, 23 Nov 2024 00:11:49 +0200
Subject: [PATCH] fix(client): dropdown tooltip placement for horizontal layout

---
 .../app/widgets/buttons/right_dropdown_button.js      | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/src/public/app/widgets/buttons/right_dropdown_button.js b/src/public/app/widgets/buttons/right_dropdown_button.js
index ab6ca0bc2..2894782c8 100644
--- a/src/public/app/widgets/buttons/right_dropdown_button.js
+++ b/src/public/app/widgets/buttons/right_dropdown_button.js
@@ -8,7 +8,7 @@ const TPL = `
     }
     </style>
 
-    <button type="button" data-bs-toggle="dropdown" data-placement="right"
+    <button type="button" data-bs-toggle="dropdown"
             aria-haspopup="true" aria-expanded="false" 
             class="bx right-dropdown-button launcher-button"></button>
     
@@ -25,6 +25,10 @@ export default class RightDropdownButtonWidget extends BasicWidget {
         this.iconClass = iconClass;
         this.title = title;
         this.dropdownTpl = dropdownTpl;
+
+        this.settings = {
+            titlePlacement: "bottom"    
+        };
     }
 
     doRender() {
@@ -33,7 +37,10 @@ export default class RightDropdownButtonWidget extends BasicWidget {
         this.dropdown = bootstrap.Dropdown.getOrCreateInstance(this.$widget.find("[data-bs-toggle='dropdown']"));
 
         this.$tooltip = this.$widget.find(".tooltip-trigger").attr("title", this.title);
-        this.tooltip = new bootstrap.Tooltip(this.$tooltip);
+        this.tooltip = new bootstrap.Tooltip(this.$tooltip, {
+            placement: this.settings.titlePlacement,
+            fallbackPlacements: [ this.settings.titlePlacement ]
+        });
 
         this.$widget.find(".right-dropdown-button")
             .addClass(this.iconClass)