From 94a1ee00e1677a6e3a0271f3845df8a96e8e0a0f Mon Sep 17 00:00:00 2001
From: Oliver Booth <me@olivr.me>
Date: Thu, 10 Aug 2023 15:30:49 +0100
Subject: [PATCH] refactor: render bootstrap tooltips from UI class

---
 src/ts/UI.ts  | 18 +++++++++++++++++-
 src/ts/app.ts | 11 -----------
 2 files changed, 17 insertions(+), 12 deletions(-)

diff --git a/src/ts/UI.ts b/src/ts/UI.ts
index 707f480..0635596 100644
--- a/src/ts/UI.ts
+++ b/src/ts/UI.ts
@@ -1,4 +1,5 @@
-declare const katex: any;
+declare const bootstrap: any;
+declare const katex: any;
 
 class UI {
     public static get blogPostContainer(): HTMLDivElement {
@@ -14,10 +15,25 @@ class UI {
      */
     public static updateUI() {
         UI.addLineNumbers();
+        UI.addBootstrapTooltips();
         UI.renderTeX();
         UI.unescapeMarkTags();
     }
 
+    /**
+     * Adds Bootstrap tooltips to all elements with a title attribute.
+     */
+    public static addBootstrapTooltips() {
+        document.querySelectorAll("[title]").forEach((el) => {
+            el.setAttribute("data-bs-toggle", "tooltip");
+            el.setAttribute("data-bs-placement", "bottom");
+            el.setAttribute("data-bs-html", "true");
+            el.setAttribute("data-bs-title", el.getAttribute("title"));
+
+            new bootstrap.Tooltip(el);
+        });
+    }
+
     /**
      * Adds line numbers to all <pre> <code> blocks that have more than one line.
      */
diff --git a/src/ts/app.ts b/src/ts/app.ts
index c39bdc4..b6fb676 100644
--- a/src/ts/app.ts
+++ b/src/ts/app.ts
@@ -2,7 +2,6 @@ import API from "./API";
 import TimeUtility from "./TimeUtility";
 import UI from "./UI";
 
-declare const bootstrap: any;
 declare const Handlebars: any;
 
 (() => {
@@ -103,14 +102,4 @@ declare const Handlebars: any;
                 break;
         }
     });
-
-    document.querySelectorAll("[title]").forEach((el) => {
-        el.setAttribute("data-bs-toggle", "tooltip");
-        el.setAttribute("data-bs-placement", "bottom");
-        el.setAttribute("data-bs-html", "true");
-        el.setAttribute("data-bs-title", el.getAttribute("title"));
-    });
-
-    const list = document.querySelectorAll('[data-bs-toggle="tooltip"]');
-    list.forEach((el: Element) => new bootstrap.Tooltip(el));
 })();