proper @demo deps

pmndrs · Aug 3, 2024 · 9a1ca78 · 9a1ca78
1 parent c12f910
commit 9a1ca78
Show file tree

Hide file tree

Showing 170 changed files with 1,393 additions and 1,052 deletions.
diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
@@ -15,20 +15,24 @@ permissions:
 jobs:
   build-job:
     runs-on: ubuntu-latest
+    env:
+      TURBO_TELEMETRY_DISABLED: 1
 
     # Cancel multiple runs when pushing to main
     concurrency:
       group: ${{ github.event_name != 'pull_request' && 'group-pushmain' || github.run_id }}
       cancel-in-progress: ${{ github.event_name != 'pull_request' }}
 
-    # container:
-    #   image: ghcr.io/pmndrs/playwright:main
-    #   credentials:
-    #     username: ${{ github.actor }}
-    #     password: ${{ secrets.GITHUB_TOKEN }}
+    container:
+      image: ghcr.io/pmndrs/playwright:main
+      credentials:
+        username: ${{ github.actor }}
+        password: ${{ secrets.GITHUB_TOKEN }}
 
     steps:
-      # Build
+      #
+      # Setup
+      #
       - uses: actions/checkout@v4
       - id: configurepages
         uses: actions/configure-pages@v5
@@ -38,18 +42,22 @@ jobs:
           cache: "npm"
       - run: npm ci
       - uses: rharkor/caching-for-turbo@v1.5
-      - run: npm run build
+
+      #
+      # Test
+      #
+      - run: npm test
         env:
           BASE_PATH: ${{ steps.configurepages.outputs.base_path }}
-          PUBLIC_URL: ${{ steps.configurepages.outputs.base_url }}
 
-      # Tests (only for PRs)
-      - run: ./test.sh
-        if: github.event_name == 'pull_request'
+      #
+      # Build (only for pushes on main)
+      #
+      - run: npm run build
+        if: github.event_name != 'pull_request'
         env:
           BASE_PATH: ${{ steps.configurepages.outputs.base_path }}
-
-      # Upload artifact (only for pushes on main)
+          PUBLIC_URL: ${{ steps.configurepages.outputs.base_url }}
       - uses: actions/upload-pages-artifact@v3
         if: github.event_name != 'pull_request'
         with:

diff --git a/README.md b/README.md
@@ -55,45 +55,44 @@ This will:
 
 # test
 
-Pre-requisites:
-
-- [build](#build)
-
-> [!WARNING]
-> Do not forget to (re-)[build](#build) first!
-
 ```sh
 $ npm test
 ```
 
 To update the snapshots: `npm test -- -- --update-snapshots`
 
-> [!IMPORTANT]
-> If you built the project with eg. `BASE_PATH=/examples` you'll need to:
->
-> ```sh
-> $ BASE_PATH=/examples npm test
-> ```
+<details>
+
+You can also:
+
+```sh
+$ BASE_PATH=/examples npm test
+```
+
+</details>
 
 ## Docker
 
-For generating reproductible snapshots, we still build static `out/` folder locally, but use dockerised environment to run playwright tests against:
+For generating reproductible snapshots, we use [`ghcr.io/pmndrs/playwright:main`](https://github.com/pmndrs/playwright/pkgs/container/playwright/249720592?tag=main) Docker image.
 
 ```sh
-$ ./test.sh
+$ docker run -it --rm  \
+  -w /app -v "$(pwd)":/app -v /app/node_modules \
+  ghcr.io/pmndrs/playwright:main /bin/sh
+#
+# echo "Hey, I am acting like the CI"
+#
+# npm ci
+# npm test
 ```
 
-> [!NOTE]
-> A `-v "$(pwd)":/app` volume is mounted to the container, so any snapshot will be written to the host machine.
+or in one command to update snapshots:
 
-To update the snapshots: `./test.sh --update`
-
-> [!IMPORTANT]
-> If you built the project with eg. `BASE_PATH=/examples` you'll need to:
->
-> ```sh
-> $ BASE_PATH=/examples ./test.sh
-> ```
+```sh
+docker run --rm  \
+  -w /app -v "$(pwd)":/app -v /app/node_modules \
+  ghcr.io/pmndrs/playwright:main /bin/sh -c "npm ci && npm test -- -- --update-snapshots"
+```
 
 # Colophon
 

diff --git a/apps/website/lib/helper.ts b/apps/website/lib/helper.ts
@@ -1,6 +1,6 @@
-import path, { dirname, resolve } from "path";
-import fs from "fs";
-import { fileURLToPath } from "url";
+// Importing JSON directly
+import pkg from "@/package.json";
+
 import { generatePort } from "@examples/e2e";
 
 const BASE_PATH = process.env.BASE_PATH || "";
@@ -12,17 +12,10 @@ const host =
     : () => (PUBLIC_URL ? new URL(PUBLIC_URL).origin : "");
 
 export function getDemos() {
-  const __filename = fileURLToPath(import.meta.url); // Converts the URL to a file path
-  const __dirname = dirname(__filename); // Gets the directory name
-
-  const demosDir = resolve(__dirname, "../../../demos");
-
-  return fs
-    .readdirSync(demosDir)
-    .filter((file) => {
-      return fs.statSync(path.join(demosDir, file)).isDirectory();
-    })
-    .map((demoname) => {
+  return Object.keys(pkg.dependencies)
+    .filter((dep) => dep.startsWith("@demo/"))
+    .map((pkgname) => {
+      const demoname = pkgname.split("@demo/")[1];
       const port = generatePort(demoname);
       const h = host(port);
 

diff --git a/apps/website/package.json b/apps/website/package.json
@@ -6,7 +6,7 @@
     "dev": "next dev",
     "dev2": "npm run dev",
     "build": "NODE_ENV=production next build",
-    "build2": "npm run build",
+    "build3": "npm run build",
     "start": "next start",
     "lint": "next lint"
   },
@@ -16,7 +16,164 @@
     "react": "^18",
     "react-dom": "^18",
     "react-use": "^17.5.1",
-    "tailwind-merge": "^2.4.0"
+    "tailwind-merge": "^2.4.0",
+    "@demo/aquarium": "*",
+    "@demo/arkanoid": "*",
+    "@demo/arkanoid-under-60-loc": "*",
+    "@demo/audio-analyser": "*",
+    "@demo/backdrop-and-cables": "*",
+    "@demo/baking-soft-shadows": "*",
+    "@demo/basic-ballpit": "*",
+    "@demo/basic-demo": "*",
+    "@demo/bestservedbold-christmas-baubles": "*",
+    "@demo/bezier-curves-and-nodes": "*",
+    "@demo/bloom-hdr-workflow-gltf": "*",
+    "@demo/bouncy-watch": "*",
+    "@demo/bounds-and-makedefault": "*",
+    "@demo/bruno-simons-20k-challenge": "*",
+    "@demo/building-dynamic-envmaps": "*",
+    "@demo/building-live-envmaps": "*",
+    "@demo/bvh": "*",
+    "@demo/camera-scroll": "*",
+    "@demo/camera-shake": "*",
+    "@demo/canvas-text": "*",
+    "@demo/cards": "*",
+    "@demo/cards-with-border-radius": "*",
+    "@demo/caustics": "*",
+    "@demo/cell-fracture": "*",
+    "@demo/clones": "*",
+    "@demo/clouds": "*",
+    "@demo/color-grading": "*",
+    "@demo/confetti": "*",
+    "@demo/csg-bunny-usegroups": "*",
+    "@demo/csg-house": "*",
+    "@demo/csg-operations-rapier-physics": "*",
+    "@demo/dbismut-furniture": "*",
+    "@demo/diamond-refraction": "*",
+    "@demo/diamond-ring": "*",
+    "@demo/drei-rendertexture": "*",
+    "@demo/ecctrl-fisheye": "*",
+    "@demo/edgesgeometry": "*",
+    "@demo/enter-portals": "*",
+    "@demo/environment-blur-and-transitions": "*",
+    "@demo/envmap-ground-projection": "*",
+    "@demo/faucets-select-highlight": "*",
+    "@demo/flexbox-yoga-in-webgl": "*",
+    "@demo/floating-diamonds": "*",
+    "@demo/floating-instanced-shoes": "*",
+    "@demo/floating-laptop": "*",
+    "@demo/flying-bananas": "*",
+    "@demo/frosted-glass": "*",
+    "@demo/gatsby-stars": "*",
+    "@demo/glass-flower": "*",
+    "@demo/gltf-animations": "*",
+    "@demo/gltf-animations-re-used": "*",
+    "@demo/gltf-animations-tied-to-scroll": "*",
+    "@demo/gltfjsx-400kb-drone": "*",
+    "@demo/gpgpu-curl-noise-dof": "*",
+    "@demo/grass-shader": "*",
+    "@demo/ground-projected-envmaps-lamina": "*",
+    "@demo/ground-reflections-and-video-textures": "*",
+    "@demo/hi-key-bubbles": "*",
+    "@demo/horizontal-tiles": "*",
+    "@demo/html-annotations": "*",
+    "@demo/html-input-fields": "*",
+    "@demo/html-markers": "*",
+    "@demo/image-gallery": "*",
+    "@demo/infinite-scroll": "*",
+    "@demo/instanced-particles-effects": "*",
+    "@demo/instanced-vertex-colors": "*",
+    "@demo/instances": "*",
+    "@demo/inter-epoxy-resin": "*",
+    "@demo/interactive-spline-scene-live-html": "*",
+    "@demo/inverted-stencil-buffer": "*",
+    "@demo/iridescent-decals": "*",
+    "@demo/lamina-1x": "*",
+    "@demo/landing-page": "*",
+    "@demo/learn-with-jason": "*",
+    "@demo/lulaby-city": "*",
+    "@demo/lusion-connectors": "*",
+    "@demo/magic-box": "*",
+    "@demo/merged-instance": "*",
+    "@demo/minecraft": "*",
+    "@demo/mixing-controls": "*",
+    "@demo/mixing-html-and-webgl": "*",
+    "@demo/mixing-html-and-webgl-w-occlusion": "*",
+    "@demo/moksha": "*",
+    "@demo/monitors": "*",
+    "@demo/motionpathcontrols": "*",
+    "@demo/mount-transitions": "*",
+    "@demo/multiple-views-with-uniform-controls": "*",
+    "@demo/nextjs-prism": "*",
+    "@demo/night-train": "*",
+    "@demo/object-clump": "*",
+    "@demo/pairing-threejs-to-ui": "*",
+    "@demo/pass-through-portals": "*",
+    "@demo/physics-with-convex-polyhedrons": "*",
+    "@demo/pinball-in-70-lines": "*",
+    "@demo/pmndrs-vercel": "*",
+    "@demo/portal-shapes": "*",
+    "@demo/portals": "*",
+    "@demo/progressive-loading-states-with-suspense": "*",
+    "@demo/racing-game": "*",
+    "@demo/ragdoll-physics": "*",
+    "@demo/rapier-physics": "*",
+    "@demo/rapier-ping-pong": "*",
+    "@demo/raycast-cycling": "*",
+    "@demo/re-using-geometry-and-level-of-detail": "*",
+    "@demo/re-using-gltfs": "*",
+    "@demo/react-ellipsecurve": "*",
+    "@demo/react-pp-outlines": "*",
+    "@demo/react-spring-animations": "*",
+    "@demo/room-with-soft-shadows": "*",
+    "@demo/router-transitions": "*",
+    "@demo/scrollcontrols-and-lens-refraction": "*",
+    "@demo/scrollcontrols-gltf": "*",
+    "@demo/scrollcontrols-with-minimap": "*",
+    "@demo/selective-outlines": "*",
+    "@demo/shader-fire": "*",
+    "@demo/shader-hmr": "*",
+    "@demo/shadermaterials": "*",
+    "@demo/shoe-configurator": "*",
+    "@demo/shopping": "*",
+    "@demo/simple-audio-analyser": "*",
+    "@demo/simple-physics-demo": "*",
+    "@demo/simple-physics-demo-with-debug-bounds": "*",
+    "@demo/sky-dome-with-annotations": "*",
+    "@demo/soft-shadows": "*",
+    "@demo/space-game": "*",
+    "@demo/sparks-and-effects": "*",
+    "@demo/spline-glass-shapes": "*",
+    "@demo/sport-hall": "*",
+    "@demo/springy-boxes": "*",
+    "@demo/ssgi-spheres-with-rapier-physics": "*",
+    "@demo/ssr-test": "*",
+    "@demo/stage-presets-gltfjsx": "*",
+    "@demo/staging-and-camerashake": "*",
+    "@demo/starwars": "*",
+    "@demo/stencil-mask": "*",
+    "@demo/svg-maps-with-html-annotations": "*",
+    "@demo/svg-renderer": "*",
+    "@demo/t-shirt-configurator": "*",
+    "@demo/the-three-graces": "*",
+    "@demo/threejs-journey-lv-1-fisheye": "*",
+    "@demo/threejs-journey-portal": "*",
+    "@demo/thunder-clouds": "*",
+    "@demo/transformcontrols-and-makedefault": "*",
+    "@demo/transparent-aesop-bottles": "*",
+    "@demo/trigger-meshes": "*",
+    "@demo/tying-canvas-to-scroll-offset": "*",
+    "@demo/useintersect-and-scrollcontrols": "*",
+    "@demo/video-cookies": "*",
+    "@demo/video-textures": "*",
+    "@demo/view-tracking": "*",
+    "@demo/viewcube": "*",
+    "@demo/viking-ship": "*",
+    "@demo/volumetric-light-godray": "*",
+    "@demo/volumetric-spotlight": "*",
+    "@demo/water-shader": "*",
+    "@demo/wobbling-sphere": "*",
+    "@demo/zustand-site": "*"
   },
   "devDependencies": {
     "@types/node": "^20",

diff --git a/demos/aquarium/package.json b/demos/aquarium/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "aquarium",
+  "name": "@demo/aquarium",
   "version": "1.0.0",
   "description": "",
   "homepage": "https://codesandbox.io/s/n7jf0f",

diff --git a/demos/arkanoid-under-60-loc/package.json b/demos/arkanoid-under-60-loc/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "arkanoid-under-60-loc",
+  "name": "@demo/arkanoid-under-60-loc",
   "version": "1.0.0",
   "description": "Super small Arkanoid barebones implementation.",
   "homepage": "https://codesandbox.io/s/66cd7",

diff --git a/demos/arkanoid/package.json b/demos/arkanoid/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "arkanoid",
+  "name": "@demo/arkanoid",
   "version": "1.0.0",
   "description": "Simple arkanoid implementation using cannon physics.",
   "homepage": "https://codesandbox.io/s/2yqpv",

diff --git a/demos/audio-analyser/package.json b/demos/audio-analyser/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "audio-analyser",
+  "name": "@demo/audio-analyser",
   "version": "1.0.0",
   "description": "Combining audio analysis with gltf cell fracture and reflections.",
   "homepage": "https://codesandbox.io/s/dvokj",

diff --git a/demos/backdrop-and-cables/package.json b/demos/backdrop-and-cables/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "backdrop-and-cables",
+  "name": "@demo/backdrop-and-cables",
   "version": "1.0.0",
   "description": "Using a studio backdrop, quadratic bezier line and contact shadows.",
   "homepage": "https://codesandbox.io/s/2ij9u",

diff --git a/demos/baking-soft-shadows/package.json b/demos/baking-soft-shadows/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "baking-soft-shadows",
+  "name": "@demo/baking-soft-shadows",
   "version": "1.0.0",
   "description": "How to use drei/AccumulativeShadows and RandomizedLight",
   "homepage": "https://codesandbox.io/s/hxcc1x",

diff --git a/demos/basic-ballpit/package.json b/demos/basic-ballpit/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "basic-ballpit",
+  "name": "@demo/basic-ballpit",
   "version": "1.0.0",
   "description": "Physics simulation using cannon.",
   "homepage": "https://codesandbox.io/s/0fqow2",

diff --git a/demos/basic-demo/package.json b/demos/basic-demo/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "basic-demo",
+  "name": "@demo/basic-demo",
   "version": "1.0.0",
   "description": "Shows how to form self-contained components with their own state and user interaction.",
   "homepage": "https://codesandbox.io/s/rrppl0y8l4",