improve local experience

Author: danharrin

docs/bin/checkout-local-filament-4.x

@@ -0,0 +1,19 @@
+#!/bin/bash
+
+DOCS_VERSIONS=(
+    1.x
+    2.x
+    3.x
+)
+
+for v in "${DOCS_VERSIONS[@]}"; do
+    if [ -d "filament/$v" ]; then
+        echo "Pulling latest documentation updates for $v..."
+        (cd filament/$v && git pull)
+    else
+        echo "Cloning $v..."
+        git clone --single-branch --branch "$v" [email protected]:filamentphp/filament.git "filament/$v"
+    fi;
+done
+
+ln -sf ../../../filament filament/4.x

docs/package.json

@@ -7,11 +7,12 @@
         "checkout": "bin/checkout-latest-filament",
         "sync": "node sync.mjs",
         "dev": "astro dev",
+        "dev:checkout-4.x": "bin/checkout-local-filament-4.x",
+        "dev:generate-4.x": "npm run dev:checkout-4.x && npm run sync && npm run build && npm run publicize-assets",
         "start": "astro dev",
         "build": "astro build",
-        "publicize-assets": "rm -rf ../public/docs && cp -R dist ../public/docs && rm ../public/docs/index.html && rm -rf ../public/docs/1.x && rm -rf ../public/docs/2.x && rm -rf ../public/docs/3.x && rm -rf ../public/docs/4.x && rm -rf ./preserved-dist && cp -R dist ./preserved-dist",
+        "publicize-assets": "rm -rf ../public/docs && cp -R dist ../public/docs && rm ../public/docs/index.html && rm -rf ../public/docs/1.x && rm -rf ../public/docs/2.x && rm -rf ../public/docs/3.x && rm -rf ../public/docs/4.x && rm -rf ./preserved-dist && cp -R dist ./preserved-dist && mkdir -p ../public/docs/3.x && cp -R filament/3.x/docs-assets/screenshots/images ../public/docs/3.x/images && mkdir -p ../public/docs/4.x && cp -R filament/4.x/docs-assets/screenshots/images ../public/docs/4.x/images",
         "generate": "npm run checkout && npm run sync && npm run build && npm run publicize-assets",
-        "generate-dev": "npm run sync && npm run build && npm run publicize-assets",
         "preview": "astro preview",
         "astro": "astro"
     },

docs/src/components/AutoScreenshot.astro

@@ -13,15 +13,15 @@ const dimensions = probe.sync(image);
 
 <div style={`aspect-ratio: ${dimensions.width} / ${dimensions.height}`} class="rounded-xl ring-1 ring-gray-950/5 dark:bg-gray-900 dark:ring-white/10">
   <img
-    src={`https://github.com/filamentphp/filament/blob/${version}/docs-assets/screenshots/images/light/${name}.jpg?raw=true`}
+    src={`/docs/${version}/images/light/${name}.jpg`}
     alt={alt}
     loading="lazy"
     decoding="async"
     class="rounded-xl dark:hidden"
   />
 
   <img
-    src={`https://github.com/filamentphp/filament/blob/${version}/docs-assets/screenshots/images/dark/${name}.jpg?raw=true`}
+    src={`/docs/${version}/images/dark/${name}.jpg`}
     alt={alt}
     loading="lazy"
     decoding="async"

docs/sync.mjs

@@ -131,6 +131,7 @@ versions.forEach((version) => {
             .sort(function (a, b) {
                 return packagesOrder.indexOf(a) - packagesOrder.indexOf(b)
             })
+            .filter((name) => name !== '.DS_Store')
 
         packages.forEach((packageName) => {
             if (

package.json

@@ -4,7 +4,8 @@
         "dev": "vite",
         "build": "vite build",
         "prettier": "npx prettier --write .",
-        "generate-docs": "cd docs && npm run generate && cd ../"
+        "build:docs": "cd docs && npm run generate && cd ../",
+        "dev:4.x-docs": "cd docs && npm run dev:generate-4.x && cd ../"
     },
     "devDependencies": {
         "@docsearch/js": "^3.5.2",