fixed FOUC

astro.config.mjs

@@ -238,6 +238,7 @@ async function config() {
         // Component overrides
         components: {
           CallToAction: './src/components/overrides/CallToAction.astro',
+          Head: './src/components/overrides/Head.astro',
           Footer: './src/components/overrides/Footer.astro',
           Icon: './src/components/overrides/Icon.astro',
           Header: './src/components/overrides/Header.astro',
@@ -295,6 +296,18 @@ async function config() {
 
     vite: {
       plugins: [
+        {
+          name: 'sidebar-topics-custom-icons',
+          enforce: 'pre',
+          resolveId(source, importer) {
+            if (
+              source === '@astrojs/starlight/components' &&
+              importer?.split('?')[0].endsWith('/starlight-sidebar-topics/components/Topics.astro')
+            ) {
+              return path.resolve('./src/components/overrides/SidebarTopicComponents.ts');
+            }
+          },
+        },
         {
           // Patch the Vite logger after config is resolved so the filter applies
           // to all logging paths, including environment-level loggers in Vite 6+.

astro.sidebar.mjs

@@ -188,7 +188,7 @@ export function generateSidebar() {
     {
       label: 'Authors',
       link: '/merchants/quick-start/',
-      icon: 'seti:svg',
+      icon: 'document',
       items: [
         {
           label: 'Getting started',
@@ -501,11 +501,11 @@ export function generateSidebar() {
       id: 'how-tos',
       label: 'How-tos',
       link: '/how-tos/',
-      icon: 'pencil',
+      icon: 'lightbulb',
       items: [
         { label: 'Overview', link: '/how-tos/' },
         {
-          label: 'Author how-tos',
+          label: 'Author How-tos',
           collapsed: false,
           items: [
             { label: 'Browse All', link: '/how-tos/#for-authors' },
@@ -554,7 +554,7 @@ export function generateSidebar() {
           ],
         },
         {
-          label: 'Developer how-tos',
+          label: 'Developer How-tos',
           collapsed: false,
           items: [
             { label: 'Browse All', link: '/how-tos/#for-developers' },

package.json

@@ -79,11 +79,11 @@
     "prod": "build:prod-fast && preview:prod-fast"
   },
   "dependencies": {
-    "@dropins/ai-tools": "^1.0.0",
     "@astrojs/check": "^0.9.8",
     "@astrojs/react": "4.4.2",
     "@astrojs/starlight": "0.37.7",
     "@codesandbox/sandpack-client": "^2.19.8",
+    "@dropins/ai-tools": "^1.0.0",
     "@dropins/storefront-account": "~4.2.0",
     "@dropins/storefront-auth": "~4.1.0",
     "@dropins/storefront-cart": "3.4.0",
@@ -126,6 +126,7 @@
     "hastscript": "^9.0.1",
     "lodash": "^4.18.1",
     "lodash.escaperegexp": "^4.1.2",
+    "lucide": "^1.52.0",
     "mermaid": "^11.12.2",
     "node-html-parser": "^7.0.1",
     "prettier": "^3.7.4",