Enhanced Memo Rendering Pipeline with Citations and Image Proxy

Upgraded investment memo rendering to use the full markdown pipeline with Shiki syntax highlighting, Mermaid diagrams, citation support, and a server-side image proxy for private GitHub assets.

Claude
Claude Claude

Changelog - 2026-01-28 (#1)

Enhanced Memo Rendering Pipeline with Citations and Image Proxy

Overview

Upgraded the investment memo rendering system to use the same full-featured markdown pipeline as changelog entries. Added support for citations from frontmatter, syntax highlighting, Mermaid diagrams, and a server-side image proxy for serving assets from the private GitHub repository.


Changes

1. Full Markdown Pipeline

Memos now use the complete unified pipeline with all features:

const processor = unified()
  .use(remarkParse)
  .use(remarkGfm)
  .use(remarkRehype, { allowDangerousHtml: true })
  .use(rehypeMermaidPre)      // Extract mermaid blocks
  .use(rehypeMemoImages, slug) // Rewrite image URLs
  .use(rehypeShiki, {          // Syntax highlighting
    themes: { light: 'github-light', dark: 'tokyo-night' },
    addLanguageClass: true,
  })
  .use(rehypeStringify, { allowDangerousHtml: true });

Features enabled:

  • GitHub Flavored Markdown (tables, strikethrough, task lists)
  • Shiki syntax highlighting with dual themes
  • Mermaid diagram rendering
  • ContentEnhancer wrapper (code block headers, copy buttons)

2. Citation System Integration

Memos can now include citations in YAML frontmatter:

---
title: Investment Memo
citations:
  mkt001:
    title: "Market Analysis Report 2024"
    url: "https://example.com/report"
    source: "Gartner"
    publishedDate: "2024-06-15"
  tech002:
    title: "Technology Trends"
    url: "https://example.com/tech"
    source: "MIT Technology Review"
---

Citations are rendered as a Sources section at the bottom of the memo with sequential indices.


3. Image Proxy API

Created /api/memo-image/[...path].ts to serve images from the private GitHub repository:

Features:

  • Fetches images using GITHUB_CONTENT_PAT
  • Returns proper content types (PNG, JPEG, SVG, WebP)
  • 1-hour cache for performance
  • Falls back to local filesystem when PAT not configured
  • Requires portfolio access cookie for authentication

URL Mapping:

Request Path GitHub Path
/api/memo-image/deals/ExoLux/outputs/... {repo}/deals/ExoLux/outputs/...

4. Image URL Rewriting Plugin

Created rehypeMemoImages rehype plugin to transform relative image paths in memo markdown:

Input Path Output Path
io/dark-matter/deals/ExoLux/... /api/memo-image/deals/ExoLux/...
./deck-screenshots/page-02.png /api/memo-image/deals/{company}/outputs/{version}/deck-screenshots/page-02.png
../inputs/logo.svg /api/memo-image/deals/{company}/inputs/logo.svg

5. Local Fallback for Development

Updated fetchMemoBySlug to fall back to src/content/markdown-memos/ when:

  • GitHub fetch fails (for simple slugs like sample-memo)
  • PAT not configured

This enables local testing without GitHub API access.


6. Workspace Configuration Fix

Added sites/dark-matter to pnpm-workspace.yaml to fix dependency resolution issues where packages were not being properly symlinked.


Environment Variables

The memo system uses these environment variables (configured in Vercel):

Variable Purpose
GITHUB_CONTENT_PAT Fine-grained PAT with read-only Contents access
GITHUB_CONTENT_OWNER Repository owner (default: "lossless-group")
GITHUB_CONTENT_REPO Repository name (default: "dark-matter-secure-data")
GITHUB_CONTENT_BRANCH Branch to fetch from (default: "main")
MEMO_DISCOVERY_LOCAL Set to "true" for local development

Architecture

flowchart TD
    A[/memos/slug] --> B{Auth Cookie?}
    B -->|No| C[Redirect to Gate]
    B -->|Yes| D[fetchMemoBySlug]
    D --> E{GitHub PAT?}
    E -->|Yes| F[Fetch from GitHub]
    E -->|No| G[Read Local Files]
    F --> H[Parse Frontmatter]
    G --> H
    H --> I[Process Markdown]
    I --> J[rehypeMemoImages]
    J --> K[rehypeShiki]
    K --> L[Render HTML]
    L --> M[ContentEnhancer]
    M --> N[Display Memo]

    O[Image Request] --> P[/api/memo-image/...]
    P --> Q{Auth Cookie?}
    Q -->|No| R[401 Unauthorized]
    Q -->|Yes| S[Fetch from GitHub]
    S --> T[Return Image]

Updated README

Added comprehensive documentation for the memo system including:

  • Configuration environment variables
  • Markdown rendering pipeline
  • Citation support
  • Slug-to-path derivation table
  • Latest version discovery algorithm
  • Local development mode
  • File structure overview