chore(deps): upgrade to Astro 7 and Starlight 0.41, migrate to starlight-sidebar-topics (#803)

Author: andrii-bodnar

astro.config.mjs

@@ -1,7 +1,7 @@
 import { defineConfig } from 'astro/config';
 import starlight from '@astrojs/starlight';
 import sitemap from '@astrojs/sitemap';
-import starlightUtils from '@lorenzo_lewis/starlight-utils';
+import starlightSidebarTopics from 'starlight-sidebar-topics';
 import starlightLinksValidator from 'starlight-links-validator';
 import starlightHeadingBadges from 'starlight-heading-badges';
 import starlightLlmsTxt from 'starlight-llms-txt';
@@ -36,7 +36,10 @@ if (process.env.VERCEL_ENV === 'production' && process.env.VERCEL_PROJECT_PRODUC
 // https://astro.build/config
 const config = defineConfig({
   site: site,
-  trailingSlash: 'always',
+  // 'ignore' works around an Astro 7 bug where 'always' breaks starlight-llms-txt's
+  // extensioned `/_llms-txt/[slug].txt` route. Output is unchanged: the 'directory' build
+  // format and Vercel (`trailingSlash: true`) keep URLs trailing-slashed regardless.
+  trailingSlash: 'ignore',
   integrations: [
     starlight({
       title: 'Crowdin Docs',
@@ -47,33 +50,6 @@ const config = defineConfig({
         light: './src/assets/logo/dark.svg',
         dark: './src/assets/logo/light.svg',
       },
-      sidebar: [
-        {
-          label: 'Crowdin Help',
-          items: [...crowdinSidebar],
-        },
-        {
-          label: 'Enterprise Help',
-          items: [...enterpriseSidebar],
-        },
-        {
-          label: 'Developer Portal',
-          items: [...developerSidebar],
-        },
-        // Navigation links
-        {
-          label: "leading",
-          items: [
-            { label: "Crowdin Help", slug: "introduction", attrs: { id: "crowdin-nav-button", class: "nav-link" } },
-            { label: "Enterprise Help", slug: "enterprise/introduction", attrs: { id: "enterprise-nav-button", class: "nav-link" } },
-            { label: "Developer Portal", slug: "developer/crowdin-apps-about", attrs: { id: "developer-nav-button", class: "nav-link" } },
-            { label: "Store", link: "https://store.crowdin.com", attrs: { target: "_blank", class: "nav-link" } },
-            { label: "Blog", link: "https://crowdin.com/blog", attrs: { target: "_blank", class: "nav-link" } },
-            { label: "Community", link: "https://community.crowdin.com/", attrs: { target: "_blank", class: "nav-link" } },
-            { label: "Crowdin.com", link: "https://crowdin.com/", attrs: { target: "_blank", class: "nav-link" } },
-          ],
-        }
-      ],
       head: [
         // Custom consent mode https://www.cookieyes.com/documentation/implementing-google-consent-mode-using-cookieyes/
         {
@@ -136,6 +112,8 @@ const config = defineConfig({
         SocialIcons: './src/components/SocialIcons.astro',
         EditLink: './src/components/EditLink.astro',
         FallbackContentNotice: './src/components/FallbackContentNotice.astro',
+        SiteTitle: './src/components/SiteTitle.astro',
+        Sidebar: './src/components/Sidebar.astro',
       },
       customCss: [
         './src/style/global.css',
@@ -148,14 +126,39 @@ const config = defineConfig({
         baseUrl: 'https://github.com/crowdin/docs/edit/main',
       },
       plugins: [
-        starlightUtils({
-          multiSidebar: {
-            switcherStyle: "hidden",
+        starlightSidebarTopics(
+          [
+            {
+              label: 'hero.crowdinHelp',
+              id: 'crowdin',
+              link: '/introduction/',
+              icon: 'open-book',
+              items: [...crowdinSidebar],
+            },
+            {
+              label: 'hero.enterpriseHelp',
+              id: 'enterprise',
+              link: '/enterprise/introduction/',
+              icon: 'information',
+              items: [...enterpriseSidebar],
+            },
+            {
+              label: 'hero.developerPortal',
+              id: 'developer',
+              link: '/developer/crowdin-apps-about/',
+              icon: 'puzzle',
+              items: [...developerSidebar],
+            },
+          ],
+          {
+            exclude: [
+              '/ai-fine-tuning',
+              '/enterprise/ai-fine-tuning',
+              '/*/ai-fine-tuning',
+              '/*/enterprise/ai-fine-tuning',
+            ],
           },
-          navLinks: {
-            leading: { useSidebarLabelled: "leading" },
-          }
-        }),
+        ),
         starlightLinksValidator({
           errorOnFallbackPages: false,
           errorOnInvalidHashes: false,
@@ -286,15 +289,15 @@ const config = defineConfig({
         targets: [
           {
             src: 'src/scripts',
-            dest: 'src'
+            dest: ''
           },
           {
             src: 'node_modules/redoc/bundles/redoc.standalone.js',
-            dest: 'node_modules/redoc/bundles'
+            dest: ''
           },
           {
             src: 'src/assets/api',
-            dest: 'src/assets'
+            dest: ''
           }
         ]
       })

package.json

@@ -20,48 +20,48 @@
     "generate-llms-api": "node generate-llms-api.js"
   },
   "dependencies": {
-    "@astrojs/check": "^0.9.6",
-    "@astrojs/markdown-remark": "^6.3.10",
+    "@astrojs/check": "^0.9.9",
+    "@astrojs/markdown-remark": "^7.2.1",
     "@astrojs/sitemap": "^3.7.3",
-    "@astrojs/starlight": "^0.37.6",
-    "@astrojs/starlight-tailwind": "^4.0.2",
-    "@expressive-code/plugin-collapsible-sections": "^0.41.7",
+    "@astrojs/starlight": "^0.41.3",
+    "@astrojs/starlight-tailwind": "^5.0.0",
+    "@expressive-code/plugin-collapsible-sections": "^0.44.0",
     "@fontsource-variable/noto-sans": "^5.2.10",
     "@fontsource-variable/plus-jakarta-sans": "^5.2.8",
-    "@iconify-json/garden": "^1.2.4",
+    "@iconify-json/garden": "^1.2.6",
     "@iconify-json/heroicons": "^1.2.3",
-    "@iconify-json/material-symbols": "^1.2.58",
+    "@iconify-json/material-symbols": "^1.2.80",
     "@iconify-json/mdi": "^1.2.3",
-    "@lorenzo_lewis/starlight-utils": "^0.3.2",
-    "@tailwindcss/vite": "^4.2.1",
-    "astro": "^5.18.1",
-    "astro-embed": "^0.12.0",
+    "@tailwindcss/vite": "^4.3.2",
+    "astro": "^7.0.6",
+    "astro-embed": "^0.13.1",
     "astro-icon": "^1.1.5",
-    "astro-og-canvas": "^0.10.1",
-    "canvaskit-wasm": "^0.40.0",
+    "astro-og-canvas": "^0.13.0",
+    "canvaskit-wasm": "^0.41.1",
     "github-slugger": "^2.0.0",
     "redoc": "2.5.2",
     "rehype-autolink-headings": "^7.1.0",
     "rehype-external-links": "^3.0.0",
     "remark-custom-heading-id": "^2.0.0",
-    "sharp": "^0.34.5",
-    "starlight-heading-badges": "^0.6.1",
-    "starlight-links-validator": "^0.19.2",
-    "starlight-llms-txt": "^0.7.0",
-    "tailwindcss": "^4.2.1",
-    "typescript": "^5.9.3",
+    "sharp": "^0.35.3",
+    "starlight-heading-badges": "^0.8.0",
+    "starlight-links-validator": "^0.25.2",
+    "starlight-llms-txt": "^0.11.0",
+    "starlight-sidebar-topics": "^0.8.0",
+    "tailwindcss": "^4.3.2",
+    "typescript": "^6.0.3",
     "unist-util-visit": "^5.1.0"
   },
   "devDependencies": {
     "@apidevtools/swagger-parser": "^12.1.0",
     "@types/mdast": "^4.0.4",
-    "sass": "^1.97.3",
+    "sass": "^1.101.0",
     "vfile": "^6.0.3",
-    "vite-plugin-static-copy": "^3.2.0",
-    "vitest": "^4.1.8"
+    "vite-plugin-static-copy": "^4.1.1",
+    "vitest": "^4.1.10"
   },
   "engines": {
-    "node": ">=22"
+    "node": ">=22.12.0"
   },
-  "packageManager": "pnpm@11.8.0"
+  "packageManager": "pnpm@11.10.0"
 }