Merge branch 'main' into Adjust-Adobe-Air-SDK-v5

.github/scripts/fix_i18n.py

@@ -4,17 +4,12 @@
 
 # Define MDX tags and locales
 MDX_TAGS = [
-    "Abbr",
     "Accordion",
-    "ApiVersion",
-    "SdkVersion",
     "Callout",
     "CodeBlock",
     "MinorVersion",
-    "Table",
     "Tabs",
     "Tab",
-    "Tile",
     "ListColumns",
 ]
 locales = ["ja", "ko", "zh"]

.lycheeignore

@@ -1,9 +1,10 @@
-^https?://api\.adjust\.com(?:/.*)?$
-^https?://example\.go\.link(?:/.*)?$
-^https?://dash\.adjust\.com/control-center(?:/.*)?$
-^https?://segment\.com(?:/.*)?$
-^https?://admin\.shopify\.com(?:/.*)?$
-^https?://launch\.adobe\.com(?:/.*)?$
-^https?://app\.adjust.com(?:/.*)?$
-^https?://mydomain\.com(?:/.*)?$
+^https?:\/\/(www.)?api\.adjust\.com(?:\/.*)?$
+^https?:\/\/(www.)?example\.go\.link(?:\/.*)?$
+^https?:\/\/(www.)?dash\.adjust\.com\/control-center(?:\/.*)?$
+^https?:\/\/(www.)?segment\.com(?:\/.*)?$
+^https?:\/\/(www.)?admin\.shopify\.com(?:\/.*)?$
+^https?:\/\/(www.)?launch\.adobe\.com(?:\/.*)?$
+^https?:\/\/(www.)?app\.adjust.com(?:\/.*)?$
+^https?:\/\/(www.)?mydomain\.com(?:\/.*)?$
 @images*
+^file:\/\/\/.*?$

package.json

@@ -51,7 +51,8 @@
     "tailwindcss": "^3.4.15",
     "typesense-instantsearch-adapter": "^2.8.0",
     "unified": "^11.0.5",
-    "unist-util-visit": "^5.0.0"
+    "unist-util-visit": "^5.0.0",
+    "uuid": "^11.0.3"
   },
   "devDependencies": {
     "@stylistic/eslint-plugin": "^2.10.1",

src/components/Accordion.astro

@@ -39,19 +39,35 @@ const { title, badge } = Astro.props;
 </details>
 
 <script>
-  document.addEventListener("DOMContentLoaded", () => {
-    const detailsElements = document.querySelectorAll("details");
+  class AccordionController {
+    private detailsElements: NodeListOf<HTMLDetailsElement>;
+    private toggleListeners: Map<HTMLDetailsElement, EventListener>;
+
+    constructor() {
+      this.detailsElements = document.querySelectorAll("details");
+      this.toggleListeners = new Map();
+    }
+
+    private toggleDetails = (open: boolean, chevron: HTMLElement) => {
+      if (!chevron) return;
+      chevron.style.transform = open ? "rotate(90deg)" : "rotate(0deg)";
+    };
 
-    detailsElements.forEach((details) => {
-      const chevron = details.querySelector(".chevron") as HTMLElement;
+    public initialize = () => {
+      this.detailsElements.forEach((details) => {
+        const chevron = details.querySelector(".chevron") as HTMLElement;
 
-      details.addEventListener("toggle", () => {
-        if (details.open) {
-          chevron!.style.transform = "rotate(90deg)";
-        } else {
-          chevron!.style.transform = "rotate(0deg)";
-        }
+        const toggleHandler = () => this.toggleDetails(details.open, chevron);
+        this.toggleListeners.set(details, toggleHandler);
+
+        details.addEventListener("toggle", toggleHandler);
       });
-    });
+    };
+  }
+
+  document.addEventListener("DOMContentLoaded", () => {
+    const controller = new AccordionController();
+
+    controller.initialize();
   });
 </script>

src/components/AudienceDropdown.astro

@@ -75,24 +75,38 @@ const audiences = [
 </div>
 
 <script>
-  const wrapper = document.getElementById("audience-picker-wrapper");
-  const menu = document.getElementById("audience-picker-menu");
+  class AudienceController {
+    private container: HTMLElement;
+    private menu: HTMLElement;
 
-  const toggleMenu = () => {
-    if (menu) {
-      menu.classList.toggle("hidden");
+    constructor(container: string, menu: string) {
+      this.container = document.getElementById(container)!;
+      this.menu = document.getElementById(menu)!;
     }
-  };
 
-  const closeMenu = (event: any) => {
-    if (menu && wrapper && !wrapper.contains(event.target)) {
-      menu.classList.add("hidden");
-    }
-  };
+    private toggleMenu = (event: MouseEvent): void => {
+      event.stopPropagation();
+      this.menu.classList.toggle("hidden");
+    };
+
+    private closeMenu = (event: MouseEvent): void => {
+      if (!this.container.contains(event.target as Node)) {
+        this.menu.classList.add("hidden");
+      }
+    };
 
-  if (wrapper) {
-    wrapper.addEventListener("click", toggleMenu);
+    public initialize(): void {
+      this.container.addEventListener("click", this.toggleMenu);
+      document.addEventListener("click", this.closeMenu);
+    }
   }
 
-  document.addEventListener("click", closeMenu);
+  document.addEventListener("DOMContentLoaded", () => {
+    const controller = new AudienceController(
+      "audience-picker-wrapper",
+      "audience-picker-menu",
+    );
+
+    controller.initialize();
+  });
 </script>

src/components/Cards/CategoryCard.astro

@@ -1,6 +1,5 @@
 ---
 import type { SidebarItem } from "@utils/helpers/navigation/types";
-import classNames from "classnames";
 
 interface Props {
   child: SidebarItem;
@@ -13,13 +12,7 @@ const categoryClass = `category-${childCategory}-${childVersion}`;
 ---
 
 <div
-  class={classNames(
-    "xs:w-full lg:w-[calc(33.3%-8px)] h-auto min-h-[144px] group",
-    {
-      hidden: !!child.version,
-    },
-    categoryClass,
-  )}
+  class={`xs:w-full lg:w-[calc(33.3%-8px)] h-auto min-h-[144px] group ${categoryClass} ${!!child.version && "hidden"}`}
 >
   <a class="!no-underline !text-black" href={`/${child.slug}`}>
     <div
@@ -38,37 +31,53 @@ const categoryClass = `category-${childCategory}-${childVersion}`;
 <script>
   import { $versions as $sdkVersions } from "@store/sdkVersionsStore";
 
-  document.addEventListener("DOMContentLoaded", () => {
-    const currentSdkVersion = $sdkVersions.get().currentVersion.value || "v5";
-    // Helper function to hide all versioned items initially
-    const hideAllVersionedItems = () => {
+  class CategoryController {
+    private sdkVersionsStore: typeof $sdkVersions;
+
+    constructor(sdkVersionsStore: typeof $sdkVersions) {
+      this.sdkVersionsStore = sdkVersionsStore;
+    }
+
+    // Hide all versioned items
+    private hideAllVersionedItems(): void {
       const versionedItems = document.querySelectorAll(
         "[class*='category-sdk']",
       );
       versionedItems.forEach((item) => {
         if (!item.classList.contains("hidden")) item.classList.add("hidden");
       });
-    };
+    }
 
-    // Helper function to show items for the current versions
-    const showCurrentVersionItems = (sdkVersion: string) => {
-      hideAllVersionedItems();
-      // Select and show items for the current SDK versions
+    // Show items for the current SDK version
+    private showCurrentVersionItems(sdkVersion: string): void {
+      this.hideAllVersionedItems();
       const versionedItems = document.querySelectorAll(
         `.category-sdk-${sdkVersion}, .category-sdk-0`,
       );
       versionedItems.forEach((item) => {
         item.classList.remove("hidden");
         item.classList.add("block");
       });
-    };
+    }
+
+    // Initialize and subscribe to version changes
+    public initialize(): void {
+      const currentSdkVersion =
+        this.sdkVersionsStore.get()?.currentVersion?.value || "v5";
+      this.showCurrentVersionItems(currentSdkVersion);
+
+      this.sdkVersionsStore.subscribe((store) => {
+        const sdkVersion = store.currentVersion?.value;
+        if (sdkVersion) {
+          this.showCurrentVersionItems(sdkVersion);
+        }
+      });
+    }
+  }
+
+  document.addEventListener("DOMContentLoaded", () => {
+    const controller = new CategoryController($sdkVersions);
 
-    // Subscribe to version changes in the Nanostores
-    $sdkVersions.subscribe((store) => {
-      const sdkVersion = store.currentVersion?.value;
-      if (sdkVersion) {
-        showCurrentVersionItems(sdkVersion);
-      }
-    });
+    controller.initialize();
   });
 </script>

src/components/HeadSEO.astro

@@ -4,10 +4,14 @@ import { SITE, OPEN_GRAPH } from "../consts";
 import { useTranslations } from "@i18n/utils";
 import type { Locales } from "@i18n/locales";
 
-type Props = Partial<{ canonicalUrl: URL } & CollectionEntry<"docs">["data"]>;
+type Props = Partial<
+  { canonicalUrl: URL; pageTitle: string } & CollectionEntry<"docs">["data"]
+>;
 
-const { ogLocale, image, title, description, canonicalUrl } = Astro.props;
-const formattedContentTitle = `${title}`;
+const { ogLocale, image, title, description, canonicalUrl, pageTitle } =
+  Astro.props;
+
+const formattedContentTitle = `${title ?? pageTitle}`;
 const imageSrc = image?.src ?? OPEN_GRAPH.image.src;
 const canonicalImageSrc = new URL(imageSrc, Astro.site);
 const imageAlt = image?.alt ?? OPEN_GRAPH.image.alt;