fix(docs): add versions (#45)

fix(docs): add versioning

Author: JacobCoffee

docs/_static/versioning.js

@@ -0,0 +1,104 @@
+const loadVersions = async () => {
+  const res = await fetch(
+    DOCUMENTATION_OPTIONS.URL_ROOT + "_static/versions.json",
+  );
+  if (res.status !== 200) {
+    return null;
+  }
+  return await res.json();
+};
+
+const addVersionWarning = (currentVersion, latestVersion) => {
+  if (currentVersion === latestVersion) {
+    return;
+  }
+
+  const header = document.querySelector(".bd-header__inner")?.parentElement;
+  if (!header) {
+    return;
+  }
+
+  const container = document.createElement("div");
+  container.id = "version-warning";
+
+  const warningText = document.createElement("span");
+  warningText.textContent = `You are viewing the documentation for ${
+    currentVersion === "dev" ||
+    parseInt(currentVersion) > parseInt(latestVersion)
+      ? "a preview"
+      : "an outdated"
+  } version of Litestar.`;
+  container.appendChild(warningText);
+
+  const latestLink = document.createElement("a");
+  latestLink.textContent = "Click here to go to the latest version";
+  latestLink.href = DOCUMENTATION_OPTIONS.URL_ROOT + "../latest";
+  container.appendChild(latestLink);
+
+  header.before(container);
+};
+
+const formatVersionName = (version, isLatest) =>
+  version + (isLatest ? " (latest)" : "");
+
+const addVersionSelect = (currentVersion, versionSpec) => {
+  const navEnd = document.querySelector(".navbar-header-items__end");
+
+  if (!navEnd) {
+    return;
+  }
+
+  const container = document.createElement("div");
+  container.classList.add("navbar-nav");
+
+  const dropdown = document.createElement("div");
+  dropdown.classList.add("dropdown");
+  container.appendChild(dropdown);
+
+  const dropdownToggle = document.createElement("button");
+  dropdownToggle.classList.add("btn", "dropdown-toggle", "nav-item");
+  dropdownToggle.setAttribute("data-bs-toggle", "dropdown");
+  dropdownToggle.setAttribute("type", "button");
+  dropdownToggle.textContent = `Version: ${formatVersionName(
+    currentVersion,
+    currentVersion === versionSpec.latest,
+  )}`;
+  dropdown.appendChild(dropdownToggle);
+
+  const dropdownContent = document.createElement("div");
+  dropdownContent.classList.add("dropdown-menu");
+  dropdown.appendChild(dropdownContent);
+
+  for (const version of versionSpec.versions) {
+    const navItem = document.createElement("li");
+    navItem.classList.add("nav-item");
+
+    const navLink = document.createElement("a");
+    navLink.classList.add("nav-link", "nav-internal");
+    navLink.href = DOCUMENTATION_OPTIONS.URL_ROOT + `../${version}`;
+    navLink.textContent = formatVersionName(
+      version,
+      version === versionSpec.latest,
+    );
+    navItem.appendChild(navLink);
+
+    dropdownContent.appendChild(navItem);
+  }
+
+  navEnd.prepend(container);
+};
+
+const setupVersioning = (versions) => {
+  if (versions === null) {
+    return;
+  }
+
+  const currentVersion = DOCUMENTATION_OPTIONS.VERSION;
+
+  addVersionWarning(currentVersion, versions.latest);
+  addVersionSelect(currentVersion, versions);
+};
+
+window.addEventListener("DOMContentLoaded", () => {
+  loadVersions().then(setupVersioning);
+});

docs/_static/versions.json

@@ -0,0 +1 @@
+{ "versions": ["0", "main"], "latest": "0" }

docs/conf.py

@@ -81,7 +81,7 @@
 
 # -- Style configuration -----------------------------------------------------
 html_theme = "litestar_sphinx_theme"
-html_title = "Litestar Framework"
+html_title = "Type Lens"
 pygments_style = "lightbulb"
 todo_include_todos = True