Try to fix documentation links

docs/src/.vitepress/theme/VersionPicker.vue

@@ -1,141 +1,63 @@
 <!-- Adapted from https://github.com/MakieOrg/Makie.jl/blob/master/docs/src/.vitepress/theme/VersionPicker.vue -->
 
 <script setup lang="ts">
-import { ref, onMounted, computed } from 'vue'
-import { useData } from 'vitepress'
+import { computed, ref, onMounted } from 'vue'
+import { useRoute } from 'vitepress'
 import VPNavBarMenuGroup from 'vitepress/dist/client/theme-default/components/VPNavBarMenuGroup.vue'
 import VPNavScreenMenuGroup from 'vitepress/dist/client/theme-default/components/VPNavScreenMenuGroup.vue'
 
-// Extend the global Window interface to include DOC_VERSIONS and DOCUMENTER_CURRENT_VERSION
-declare global {
-  interface Window {
-    DOC_VERSIONS?: string[];
-    DOCUMENTER_CURRENT_VERSION?: string;
-  }
-}
-
 const props = defineProps<{
   screenMenu?: boolean
 }>()
 
-const versions = ref<Array<{ text: string, link: string }>>([]);
-const currentVersion = ref('Versions');
-const isClient = ref(false);
-const { site } = useData()
-
-const isLocalBuild = () => {
-  return typeof window !== 'undefined' && (window.location.hostname === 'localhost' || window.location.hostname === '127.0.0.1');
-}
+const route = useRoute()
 
-const getBaseRepository = () => {
-  if (typeof window === 'undefined') return ''; // Handle server-side rendering (SSR)
-  const { origin, pathname } = window.location;
-  // Check if it's a GitHub Pages (or similar) setup
-  if ((origin.includes('qutip.org')) || (origin.includes('github.io'))) {
-    // Extract the first part of the path as the repository name
-    const pathParts = pathname.split('/').filter(Boolean);
-    const baseRepo = pathParts.length > 0 ? `/${pathParts[0]}` : '';
-    return `${origin}${baseRepo}`;
-  } else {
-    // For custom domains, use just the origin (e.g., https://docs.makie.org)
-    return origin;
-  }
-};
+const versions = ref([]);
+const currentVersion = ref('Versions');
 
-const waitForScriptsToLoad = () => {
-  return new Promise<boolean>((resolve) => {
-    if (isLocalBuild()) {
-      resolve(false);
-      return;
-    }
+const waitForGlobalDocumenterVars = () => {
+    return new Promise((resolve) => {
     const checkInterval = setInterval(() => {
-      if (window.DOC_VERSIONS && window.DOCUMENTER_CURRENT_VERSION) {
+        if (window.DOC_VERSIONS && window.DOCUMENTER_CURRENT_VERSION) {
         clearInterval(checkInterval);
-        resolve(true);
-      }
-    }, 100);
-    // Timeout after 5 seconds
-    setTimeout(() => {
-      clearInterval(checkInterval);
-      resolve(false);
-    }, 5000);
-  });
+        resolve({
+            versions: window.DOC_VERSIONS,
+            currentVersion: window.DOCUMENTER_CURRENT_VERSION
+        });
+        }
+    }, 100); // Check every 100ms
+    });
 };
 
-const loadVersions = async () => {
-  if (typeof window === 'undefined') return; // Guard for SSR
-
-  try {
-    if (isLocalBuild()) {
-      // Handle the local build scenario directly
-      const fallbackVersions = ['dev'];
-      versions.value = fallbackVersions.map(v => ({
-        text: v,
-        link: '/'
-      }));
-      currentVersion.value = 'dev';
-    } else {
-      // For non-local builds, wait for scripts to load
-      const scriptsLoaded = await waitForScriptsToLoad();
-      const getBaseRepositoryPath = computed(() => {
-        return getBaseRepository();
-      });
+onMounted(async () => {
+    const globalvars = await waitForGlobalDocumenterVars();
+    versions.value = globalvars.versions.map((v) => {
+        return {text: v, link: `${window.location.origin}/QuantumToolbox.jl/${v}/`}
+    });
+    currentVersion.value = globalvars.currentVersion;
+});
 
-      if (scriptsLoaded && window.DOC_VERSIONS && window.DOCUMENTER_CURRENT_VERSION) {
-        versions.value = window.DOC_VERSIONS.map((v: string) => ({
-          text: v,
-          link: `${getBaseRepositoryPath.value}/${v}/`
-        }));
-        currentVersion.value = window.DOCUMENTER_CURRENT_VERSION;
-      } else {
-        // Fallback logic if scripts fail to load or are not available
-        const fallbackVersions = ['dev'];
-        versions.value = fallbackVersions.map(v => ({
-          text: v,
-          link: `${getBaseRepositoryPath.value}/${v}/`
-        }));
-        currentVersion.value = 'dev';
-      }
-    }
-  } catch (error) {
-    console.warn('Error loading versions:', error);
-    // Use fallback logic in case of an error
-    const fallbackVersions = ['dev'];
-    const getBaseRepositoryPath = computed(() => {
-        return getBaseRepository();
-      });
-    versions.value = fallbackVersions.map(v => ({
-      text: v,
-      link: `${getBaseRepositoryPath.value}/${v}/`
-    }));
-    currentVersion.value = 'dev';
-  }
-  isClient.value = true;
-};
-
-onMounted(loadVersions);
 </script>
 
 <template>
-  <template v-if="isClient">
-    <VPNavBarMenuGroup
-      v-if="!screenMenu && versions.length > 0"
-      :item="{ text: currentVersion, items: versions }"
-      class="VPVersionPicker"
-    />
-    <VPNavScreenMenuGroup
-      v-else-if="screenMenu && versions.length > 0"
-      :text="currentVersion"
-      :items="versions"
-      class="VPVersionPicker"
-    />
-  </template>
+  <VPNavBarMenuGroup
+    v-if="!screenMenu"
+    :item="{ text: currentVersion, items: versions }"
+    class="VPVersionPicker"
+  />
+  <VPNavScreenMenuGroup
+    v-else
+    :text="currentVersion"
+    :items="versions"
+    class="VPVersionPicker"
+  />
 </template>
 
 <style scoped>
 .VPVersionPicker :deep(button .text) {
   color: var(--vp-c-text-1) !important;
 }
+
 .VPVersionPicker:hover :deep(button .text) {
   color: var(--vp-c-text-2) !important;
 }

docs/src/.vitepress/theme/index.ts

@@ -1,5 +1,5 @@
 // .vitepress/theme/index.ts
-import { h } from 'vue'
+import { h, watch } from "vue";
 import type { Theme } from 'vitepress'
 import DefaultTheme from 'vitepress/theme'
 import VersionPicker from "./VersionPicker.vue"
@@ -17,5 +17,47 @@ export default {
     enhanceApp({ app, router, siteData }) {
         enhanceAppWithTabs(app);
         app.component('VersionPicker', VersionPicker);
-    }
-} satisfies Theme
+        // Only run this on the client. Not during build.
+        // this function replaces the version in the URL with the stable prefix whenever a
+        // new route is navigated to. VitePress does not support relative links all over the site,
+        // so urls will go to vX.Y even if we start at stable. This solution is not ideal as
+        // there is a noticeable delay between navigating to a new page and editing the url, but it's
+        // currently better than nothing, as users are bound to copy versioned links to the docs otherwise
+        // will lead users to outdated docs in the future.
+        if (typeof window !== "undefined") {
+            function rewriteURL() {
+                // DOCUMENTER_NEWEST and DOCUMENTER_STABLE is defined in versions.js
+                // DOCUMENTER_CURRENT_VERSION is defined in siteinfo.js.
+                if (
+                    window.DOCUMENTER_NEWEST === undefined ||
+                    window.DOCUMENTER_CURRENT_VERSION === undefined ||
+                    window.DOCUMENTER_STABLE === undefined
+                ) {
+                    return;
+                }
+
+                // Current version is newest version, so we can rewrite the url
+                if (window.DOCUMENTER_NEWEST === window.DOCUMENTER_CURRENT_VERSION) {
+                    const rewritten_url = window.location.href.replace(
+                        window.DOCUMENTER_CURRENT_VERSION,
+                        window.DOCUMENTER_STABLE
+                    );
+                    window.history.replaceState(
+                        { additionalInformation: "URL rewritten to stable" },
+                        "QuantumToolbox",
+                        rewritten_url
+                    );
+                    return;
+                }
+            }
+
+            // rewrite on router changes through vitepress
+            watch(() => router.route.data.relativePath, rewriteURL, {
+                immediate: true,
+            });
+
+            // also rewrite at initial load
+            document.addEventListener("DOMContentLoaded", rewriteURL);
+        }
+    },
+} satisfies Theme;