Adding deep linking into case details tab (#344)

HISTORY.rst

@@ -95,6 +95,7 @@ Full Change List
 - Adding more postgres versions to CI (#337)
 - Make migrations compatible with Postgres 14 (#338)
 - DgvSvs and DgvGoldStandardSvs are two different data sources now
+- Adding deep linking into case details tab (#344)
 
 -------
 v0.23.9

variants/templates/variants/case_detail.html

@@ -133,6 +133,32 @@ <h2 class="sodar-pr-content-title">
 {% block javascript %}
   {{ block.super }}
   <script type="text/javascript">
+
+    // Properly open tabs.
+    $(document).ready(() => {
+      let url = location.href.replace(/\/$/, "");
+
+      if (location.hash) {
+        const hash = url.split("#");
+        $('#case-tab a[href="#'+hash[1]+'"]').tab("show");
+        history.replaceState(null, null, url);
+        setTimeout(() => {
+          $(window).scrollTop(0);
+        }, 400);
+      }
+
+      $('a[data-toggle="tab"]').on("click", function() {
+        let newUrl;
+        const hash = $(this).attr("href");
+        if(hash == "#home") {
+          newUrl = url.split("#")[0];
+        } else {
+          newUrl = url.split("#")[0] + hash;
+        }
+        history.replaceState(null, null, newUrl);
+      });
+    });
+
     // Load data after the page has loaded
     $(function() {
       axios.get("/variants/{{ object.project.sodar_uuid }}/case/api-qc/{{ object.sodar_uuid }}/")