diff --git a/templates/index.html b/templates/index.html
index 8d39067c8..ff8407ad0 100755
--- a/templates/index.html
+++ b/templates/index.html
@@ -383,6 +383,40 @@
                     $("title").html("{{white_label_company_name}} | " + secondsToDuration(at_work_seconds));
                 }
             }, 1000);
+
+            function switchTab(e) {
+                let parentContainerEl = e.target.closest(".oh-tabs");
+                let tabElement = e.target.closest(".oh-tabs__tab");
+
+
+                let targetSelector = e.target.dataset.target;
+                let targetEl = parentContainerEl
+                    ? parentContainerEl.querySelector(targetSelector)
+                    : null;
+
+                // Highlight active tabs
+                if (tabElement && !tabElement.classList.contains("oh-tabs__tab--active")) {
+                    parentContainerEl
+                        .querySelectorAll(".oh-tabs__tab--active")
+                        .forEach(function (item) {
+                            item.classList.remove("oh-tabs__tab--active");
+                        });
+
+                    if (!tabElement.classList.contains("oh-tabs__new-tab")) {
+                        tabElement.classList.add("oh-tabs__tab--active");
+                    }
+                }
+
+                // Switch tabs
+                if (targetEl && !targetEl.classList.contains("oh-tabs__content--active")) {
+                    parentContainerEl
+                        .querySelectorAll(".oh-tabs__content--active")
+                        .forEach(function (item) {
+                            item.classList.remove("oh-tabs__content--active");
+                        });
+                    targetEl.classList.add("oh-tabs__content--active");
+                }
+            }
         </script>
     {% endif %}
 </body>