Merge branch 'dev' into fix-morpher-fade

Author: wackerow

.all-contributorsrc

@@ -0,0 +1,87 @@
+# Update LLMS.txt Command
+
+This command helps maintain the `public/llms.txt` file by monitoring key navigation files:
+
+1. **Main Navigation**: `src/components/Nav/useNavigation.ts`
+2. **Developer Docs**: `src/data/developer-docs-links.yaml`
+3. **Footer Links**: `src/components/Footer.tsx`
+
+## How it works
+
+- Adds missing links to appropriate sections
+- Preserves existing descriptions and organization
+- Follows established llms.txt structure
+- **Prefers static markdown files URLs over html URLs** for better LLM comprehension
+
+## Implementation
+
+When this command is executed, I will:
+
+### Step 1: Parse Navigation Files
+
+**Main Navigation** (`src/components/Nav/useNavigation.ts`):
+
+```javascript
+// Extract linkSections object structure
+// Parse learn, use, build, participate sections
+// Get href, label, and description for each link
+```
+
+**Developer Docs** (`src/data/developer-docs-links.yaml`):
+
+```yaml
+# Parse foundational-topics, ethereum-stack, advanced, design-fundamentals
+# Extract href and id mappings
+# Build hierarchical structure
+```
+
+**Footer Links** (`src/components/Footer.tsx`):
+
+```javascript
+// Extract linkSections and dipperLinks arrays
+// Get all footer navigation items
+// Include external links (blog, ESP, Devcon)
+```
+
+### Step 2: Analyze Current llms.txt
+
+- Parse existing sections and their links
+- Extract current URLs and descriptions
+- Identify section organization and hierarchy
+
+### Step 3: URL to Markdown File Mapping
+
+**Priority: Static markdown files URLs over web html URLs**
+
+For each link, I will:
+
+1. Check if corresponding markdown file exists in `public/content/`. **Ignore translations**: Skip `public/content/translations/` directory (60+ language versions)
+2. Use a URL pointing to the markdown file for the page: `https://ethereum.org/content/[page]/index.md`
+3. Fall back to web URL only if no markdown file exists
+4. Example: `https://ethereum.org/learn/` → `https://ethereum.org/content/learn/index.md`
+5. Example2: `https://ethereum.org/guides/how-to-use-a-wallet/` → `https://ethereum.org/content/guides/how-to-use-a-wallet/index.md`
+
+### Step 4: Smart Link Categorization
+
+New links are categorized using these rules:
+
+1. **Learn Section**: `/learn/`, `/what-is-*`, `/guides/`, `/quizzes/`, `/glossary/`
+2. **Use Section**: `/get-eth`, `/wallets/`, `/dapps/`, `/staking/`, use cases
+3. **Build Section**: `/developers/`, `/enterprise/`, developer tools
+4. **Participate Section**: `/community/`, `/contributing/`, `/foundation/`
+5. **Research Section**: `/whitepaper`, `/roadmap/`, `/eips/`, `/governance/`
+
+### Step 5: Validation & Quality Checks
+
+- Verify all markdown files exist in `public/content/`
+- Check for duplicate links within sections
+- Validate section organization and hierarchy
+- Ensure descriptions are informative and concise
+
+### Step 6: Execute Action
+
+Update llms.txt file with improved structure and validated links
+
+---
+
+The command ensures the llms.txt file remains comprehensive and current with minimal manual maintenance.

.claude/commands/update-llms-txt.md

@@ -31,7 +31,7 @@ NEXT_PUBLIC_MATOMO_URL=
 NEXT_PUBLIC_MATOMO_SITE_ID=
 
 # Used to avoid loading Matomo in our preview deploys
-IS_PREVIEW_DEPLOY=false
+NEXT_PUBLIC_IS_PREVIEW_DEPLOY=false
 
 # Build pages only for the specified langs. Leave it empty to build all the langs
 # e.g. `en,fr` will only build English and French pages

.env.example

@@ -0,0 +1,52 @@
+name: Check Links In Public Directory
+
+on:
+  schedule:
+    - cron: "0 0 1 * *" # Monthly run on the 1st day of every month at midnight UTC
+  workflow_dispatch:
+
+concurrency:
+  group: ${{ github.workflow }}-${{ github.ref }}
+  cancel-in-progress: true
+
+jobs:
+  check-links:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Clone repository
+        uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+          ref: dev
+
+      - name: Check links in /public
+        uses: lycheeverse/lychee-action@v2
+        with:
+          args: |
+            public/
+            --quiet
+            --max-retries 1
+            --accept 200,429,403
+            --exclude-all-private
+            --exclude '^file://'
+            --exclude "ethereum\.org"
+            --include '^https?://'
+            --format detailed
+            './**/*.md'
+        continue-on-error: true
+
+      - name: Provide helpful failure message
+        if: failure()
+        run: |
+          echo "::error::Link check failed! Please review the broken links reported above."
+          echo ""
+          echo "If certain links are valid but fail due to:"
+          echo "- CAPTCHA challenges"
+          echo "- IP blocking"
+          echo "- Authentication requirements"
+          echo "- Rate limiting"
+          echo ""
+          echo "Consider adding them to .lycheeignore to bypass future checks."
+          echo "Format: Add one URL pattern per line"
+          exit 1

.github/workflows/lychee-cron.yml

@@ -0,0 +1,80 @@
+name: E2E tests
+on:
+  push:
+    branches: [master, staging, e2e-tests] # TODO: remove e2e-tests branch after testing
+  pull_request:
+    branches: [master, staging, e2e-tests] # TODO: remove e2e-tests branch after testing
+jobs:
+  playwright:
+    runs-on: ubuntu-latest
+    env:
+      CI: true
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: Wait for Netlify Deploy
+        id: netlify_deploy
+        uses: pettinarip/[email protected]
+        with:
+          site_id: "e8f2e766-888b-4954-8500-1b647d84db99"
+          max_timeout: 3600
+        env:
+          NETLIFY_TOKEN: ${{ secrets.NETLIFY_TOKEN }}
+
+      - uses: actions/setup-node@v4
+        with:
+          node-version: lts/*
+
+      - name: Setup pnpm
+        uses: pnpm/action-setup@v2
+
+      - name: Install dependencies
+        run: pnpm install
+
+      - name: Install Playwright with all browsers
+        run: npx playwright install --with-deps
+
+      - name: Run E2E Tests on Netlify URL
+        run: pnpm test:e2e
+        env:
+          PLAYWRIGHT_TEST_BASE_URL: ${{ steps.netlify_deploy.outputs.url }}
+
+      - uses: actions/upload-artifact@v4
+        if: always()
+        with:
+          name: playwright-report
+          path: ./tests/e2e/__results__
+          retention-days: 7
+
+  chromatic:
+    name: chromatic
+    needs: playwright
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 22.12.0
+      - name: Setup pnpm
+        uses: pnpm/action-setup@v2
+
+      - name: Install dependencies
+        run: pnpm install
+
+      - name: Download Playwright test results
+        uses: actions/download-artifact@v4
+        with:
+          name: playwright-report
+          path: ./tests/e2e/__results__
+
+      - name: Run Chromatic
+        uses: chromaui/action@latest
+        with:
+          projectToken: ${{ secrets.CHROMATIC_E2E_TOKEN }}
+          playwright: true
+          exitZeroOnChanges: true
+          storybookBaseDir: .
+        env:
+          CHROMATIC_ARCHIVE_LOCATION: ./tests/e2e/__results__

.github/workflows/playwright.yml

@@ -63,4 +63,5 @@ src/data/crowdin/bucketsAwaitingReviewReport.csv
 
 # Storybook
 build-storybook.log
+build-archive.log
 storybook-static

.gitignore

@@ -192,6 +192,62 @@ pnpm events-import         # Import community events
 - `wagmi` - React hooks for Ethereum
 - `@rainbow-me/rainbowkit` - Wallet connection
 
+## A/B Testing
+
+### Overview
+
+The site uses a GDPR-compliant, cookie-less A/B testing system integrated with Matomo. Tests are configured entirely through the Matomo dashboard with no code changes required.
+
+### Key Features
+
+- **Matomo API Integration** - Experiments configured in Matomo dashboard
+- **Cookie-less Variant Persistence** - Uses deterministic IP + User-Agent fingerprinting for variant assignment
+- **Server-side Rendering** - No layout shifts, consistent variants on first load
+- **Real-time Updates** - Change weights instantly via Matomo (no deployments)
+- **Preview Mode** - Debug panel available in development and preview environments
+- **Automatic Fallbacks** - Graceful degradation when API fails (shows original variant)
+
+### Adding a New A/B Test
+
+1. **Create experiment in Matomo dashboard**:
+   - Go to Experiments → Manage Experiments
+   - Create new experiment with desired name (e.g., "HomepageHero")
+   - Add variations with weights (original is implicit)
+   - Set status to "running"
+
+2. **Implement in component**:
+   ```tsx
+   import ABTestWrapper from "@/components/AB/TestWrapper"
+   
+   <ABTestWrapper
+     testKey="HomepageHero"  // Must match Matomo experiment name exactly
+     variants={[
+       <OriginalComponent key="current-hero" />,     // Index 0: Original
+       <NewComponent key="redesigned-hero" />        // Index 1: Variation
+     ]}
+     fallback={<OriginalComponent />}
+   />
+   ```
+
+**Important**:
+- Variants matched by **array index**, not names
+- Array order must match Matomo experiment order exactly
+- JSX `key` props become debug panel labels: `"redesigned-hero"` → `"Redesigned Hero"`
+- No TypeScript changes required - system fetches configuration from Matomo
+
+### Architecture
+
+- **`/api/ab-config`** - Fetches experiment data from Matomo API
+- **`src/lib/ab-testing/`** - Core logic for assignment and tracking
+- **`src/components/AB/`** - React components for testing and debugging
+
+### Environment Variables
+
+Required for Matomo integration:
+- `NEXT_PUBLIC_MATOMO_URL` - Matomo instance URL
+- `NEXT_PUBLIC_MATOMO_SITE_ID` - Site ID in Matomo
+- `MATOMO_API_TOKEN` - API token with experiments access
+
 ## Deployment
 
 - **Platform**: Netlify (config in `netlify.toml`)

CLAUDE.md

@@ -1993,8 +1993,8 @@ Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/d
       <td align="center" valign="top" width="14.28%"><a href="https://github.com/Nik-EpicWeb3"><img src="https://avatars.githubusercontent.com/u/214466248?v=4?s=100" width="100px;" alt="Nik-EpicWeb3"/><br /><sub><b>Nik-EpicWeb3</b></sub></a><br /><a href="#eventOrganizing-Nik-EpicWeb3" title="Event Organizing">📋</a></td>
     </tr>
     <tr>
-      <td align="center" valign="top" width="14.28%"><a href="https://github.com/kichong"><img src="https://avatars.githubusercontent.com/u/38249409?v=4?s=100" width="100px;" alt="kichong"/><br /><sub><b>kichong</b></sub></a><br /><a href="#content-kichong" title="Content">🖋</a></td>
-      <td align="center" valign="top" width="14.28%"><a href="https://github.com/zeevick10"><img src="https://avatars.githubusercontent.com/u/140458077?v=4?s=100" width="100px;" alt="FT"/><br /><sub><b>FT</b></sub></a><br /><a href="#content-zeevick10" title="Content">🖋</a></td>
+      <td align="center" valign="top" width="14.28%"><a href="https://github.com/brossetti1"><img src="https://avatars.githubusercontent.com/u/5998100?v=4?s=100" width="100px;" alt="Brian Rossetti"/><br /><sub><b>Brian Rossetti</b></sub></a><br /><a href="#maintenance-brossetti1" title="Maintenance">🚧</a> <a href="https://github.com/ethereum/ethereum-org-website/commits?author=brossetti1" title="Code">💻</a></td>
+      <td align="center" valign="top" width="14.28%"><a href="https://github.com/Antoine-Sparenberg"><img src="https://avatars.githubusercontent.com/u/128523213?v=4?s=100" width="100px;" alt="Antoine-Sparenberg"/><br /><sub><b>Antoine-Sparenberg</b></sub></a><br /><a href="#maintenance-Antoine-Sparenberg" title="Maintenance">🚧</a></td>
     </tr>
   </tbody>
 </table>

README.md

@@ -48,6 +48,6 @@ export async function generateMetadata({
     locale,
     slug: ["assets"],
     title: t("page-assets-meta-title"),
-    description: t("page-assets-meta-description"),
+    description: t("page-assets-meta-desc"),
   })
 }

app/[locale]/assets/page.tsx

@@ -8,6 +8,7 @@ import React, {
   useMemo,
   useState,
 } from "react"
+import { ExternalLink } from "lucide-react"
 import { useLocale } from "next-intl"
 
 import { ITutorial, Lang } from "@/lib/types"
@@ -198,13 +199,11 @@ const TutorialsList = ({ internalTutorials }: TutorialsListProps) => {
               href={tutorial.href ?? undefined}
             >
               <Flex className="mb-8 flex-col items-start justify-between gap-y-4 md:-mb-4 md:flex-row">
-                <Text
-                  className={cn(
-                    "relative me-0 text-2xl font-semibold text-body after:ml-2 after:inline-block after:italic after:transition-all after:duration-100 after:ease-in-out after:content-['↗'] md:me-24",
-                    tutorial.isExternal ? "after:inline-block" : "after:hidden"
-                  )}
-                >
+                <Text className="relative me-0 text-2xl font-semibold text-body md:me-24">
                   {tutorial.title}
+                  {tutorial.isExternal && (
+                    <ExternalLink className="mb-[0.25em] ms-[0.25em] inline-block size-[0.875em]" />
+                  )}
                 </Text>
                 <Tag variant="outline">
                   <Translation id={getSkillTranslationId(tutorial.skill!)} />