fix(docs): separate local and blob asset resolution for quick-reference

[waleedlatif1]

Summary

• ActionImage now uses local paths directly for PNGs (served from /static/)
• ActionVideo uses Vercel Blob storage with path normalization that strips the static/ prefix
• Fixes 404 errors where PNGs were incorrectly trying to load from blob storage

Test plan

• Verify PNG images load correctly from local /static/quick-reference/ path
• Verify MP4 videos load correctly from Vercel Blob storage
• Check quick-reference page renders all previews properly

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Review	Updated (UTC)
docs	Ready	Preview, Comment	Jan 26, 2026 6:13pm

[greptile-apps]

Greptile Overview

Greptile Summary

This PR fixes 404 errors by separating asset resolution paths for images and videos in the quick-reference documentation. PNG images now load directly from the local /static/ directory, while MP4 videos continue to use Vercel Blob storage with proper path normalization that strips the static/ prefix.

Key Changes:

• ActionImage component now uses local paths directly (ensures leading / for static files)
• ActionVideo component uses new normalizeBlobPath helper to prepare paths for blob storage
• Added normalizeBlobPath function that strips leading / and static/ prefix for blob URLs

Observations:

• The implementation correctly differentiates between local static assets (PNGs) and remote blob storage (MP4s)
• Path normalization logic is sound for the documented use case (/static/quick-reference/... paths)
• Code follows TypeScript conventions with proper function documentation

Confidence Score: 4/5

• This PR is safe to merge with minimal risk
• The change is focused and addresses a specific bug (404 errors for PNGs). The logic is straightforward and correctly separates local vs blob asset resolution. Path normalization is well-documented and handles the expected input format properly.
• No files require special attention

Important Files Changed

Filename	Overview
apps/docs/components/ui/action-media.tsx	Separated asset resolution: images use local paths, videos use blob storage with normalized paths

Sequence Diagram

sequenceDiagram
    participant MDX as Quick Reference MDX
    participant AI as ActionImage Component
    participant AV as ActionVideo Component
    participant NBP as normalizeBlobPath
    participant GAU as getAssetUrl
    participant Static as /static/ Directory
    participant Blob as Vercel Blob Storage

    Note over MDX: PNG Image Request
    MDX->>AI: src="/static/quick-reference/image.png"
    AI->>AI: Ensure leading slash
    AI->>Static: /static/quick-reference/image.png
    Static-->>MDX: PNG served locally

    Note over MDX: MP4 Video Request
    MDX->>AV: src="/static/quick-reference/video.mp4"
    AV->>NBP: "/static/quick-reference/video.mp4"
    NBP->>NBP: Strip leading "/"
    NBP->>NBP: Strip "static/" prefix
    NBP-->>AV: "quick-reference/video.mp4"
    AV->>GAU: "quick-reference/video.mp4"
    alt CDN Configured
        GAU-->>AV: ${CDN}/quick-reference/video.mp4
    else No CDN
        GAU-->>AV: /quick-reference/video.mp4
    end
    AV->>Blob: Request video from blob storage
    Blob-->>MDX: MP4 streamed

Loading

[greptile-apps]

_{No files reviewed, no comments}

_{Edit Code Review Agent Settings | Greptile}

[cursor]

Cursor Bugbot has reviewed your changes and found 1 potential issue.

^{Bugbot Autofix is OFF. To automatically fix reported issues with Cloud Agents, enable Autofix in the Cursor dashboard.}