Chapa

Read, compare, and verify public developer impact profiles and Chapa badges through nine read-only tools.

Documentation

Chapa — Developer Impact Badge

CI Security Scan Secret Scanning TypeScript Node.js Next.js License

Generate a live, embeddable, animated SVG badge that showcases your developer impact from GitHub, Bitbucket, Codeberg, and GitLab activity — with multi-dimensional scoring, verification, and one-click sharing.

juan294's Chapa Impact Badge

WebMCP

Chapa adds a WebMCP layer to four surfaces: the landing page, the Creator Studio, and the public profile and verification pages. The landing page is the front door, where get_site_capabilities returns a map of every route and the tools it carries, so an agent can find the right page instead of guessing at one. Studio tools reuse the existing command registry, so agent actions update the same preview and terminal that the user sees. Saving is always human-gated; in judge demo mode (/studio?demo=1), confirmed saves stay local and never write production data. Landing, public profile, and verification tools are read-only.

Registration uses the current document.modelContext.registerTool(tool, { signal }) contract, an AbortController for cleanup, feature detection for unsupported clients, and a remote feature-flag kill switch.

See the WebMCP tool catalog and judge guide and the under-three-minute demo script and submission checklist.

The catalog's Design methodology documents each user goal, initial state, role-play, and recovery path.

Runtime status, 2026-08-27: a preview-only chapa_hello spike passed native registration, discovery, and execution in flagged Chrome 151. The completed tool catalog still needs final production verification after release and flag enablement. The ChatGPT in-app client was unavailable for the spike, so this README does not claim ChatGPT runtime validation.

Prior work and submission-period work

For this submission, all work through 2026-08-24 is prior work. The badge, scoring engine, share and verification pages, CLI, admin surfaces, and earlier Studio foundation already existed. The released baselines are v2.22.0 (2026-08-19) and v2.22.1 (2026-08-23).

Submission-period work started after that cutoff:

  • The Creator Studio revival and hardening landed on 2026-08-26 and was released as v2.23.0.
  • The pre-launch audit remediation — 73 findings across two waves, including both launch-blockers — landed on 2026-08-27 and was released as v2.24.0.
  • Two follow-up releases landed on 2026-08-28: v2.24.1 (EMU handles no longer pollute the warm-cache registry) and v2.25.0, which flipped the signal-less default locale to English and fixed the feature-flag cache bug that made Creator Studio unreachable in a real browser.
  • The WebMCP layer runs from 3156fcaa through 699f94b0. The local receipt is git log --oneline 3156fcaa^..699f94b0:
699f94b0 feat(webmcp): add public read tools
15be8695 feat(studio): add judge demo mode
57142416 feat(webmcp): add Studio tool catalog
30f4c750 feat(webmcp): add registration infrastructure
13bdd871 docs(webmcp): pass Chrome runtime gate
b338942d test(webmcp): add main-world execution probe
d7777e47 docs(webmcp): record blocked runtime gate
3156fcaa feat(webmcp): add runtime spike
  • The layer has continued since that first contiguous block, so later WebMCP commits are no longer one range. The receipt for them is git log --oneline -E --grep='^[a-z]+\(webmcp\):' 699f94b0..HEAD:
71e2ff47 docs(webmcp): add submission package
e72a4e3a refactor(webmcp): harden tool lifecycle
f5e9e85e feat(webmcp): add tool outcome telemetry
80e327d5 feat(webmcp): improve agent workflow recovery
5551020d docs(webmcp): document agent workflow design
d771b544 feat(webmcp): add landing discovery tools
18779e40 docs(webmcp): document landing discovery

What It Does

Chapa analyzes your last 12 months of activity across connected platforms and generates a badge with:

  • Impact Score (0–100) with tier (Emerging → Solid → High → Elite)
  • 4–5 Dimension Profile — Delivery, Quality, Consistency, Breadth + optional Craft (AI tool insights)
  • Developer Archetype — Builder, Quality Champion, Marathoner, Polymath, Artificer, Balanced, or Emerging
  • Activity Timeline — 13-week daily contribution dot visualization
  • Radar Chart — pentagon (5 dimensions) or diamond (4 dimensions) breakdown
  • Verification Hash — HMAC-SHA256 watermark proving badge authenticity

Features

Multi-Platform Support

Connect GitHub (primary), Bitbucket, Codeberg, and GitLab to aggregate your impact across platforms. Stats are merged automatically — repos are summed, social metrics take the max to avoid double-counting mirrors.

Embeddable Badge (/u/:handle/badge.svg)

A 1200×630 animated SVG you can embed anywhere — GitHub profile READMEs, personal sites, portfolios. Cached at the CDN edge for 6 hours.

![My Chapa Badge](https://chapa.thecreativetoken.com/u/YOUR_HANDLE/badge.svg)

Share Page (/u/:handle)

Public profile page with full score breakdown, interactive radar chart, dimension details with explanatory tooltips, embed snippets (Markdown + HTML), and one-click sharing to X, LinkedIn, and Bluesky.

Creator Studio (/studio)

Terminal-first Studio design playground with seven visual categories, live preview, and saved Studio configuration. Requires GitHub login. A saved Studio configuration changes the public SVG badge and share page and invalidates the badge cache.

CLI Tool (chapa-cli)

For developers on GitHub Enterprise (EMU) — merge your work contributions into your personal Chapa badge via a secure device auth flow.

npx chapa-cli login
npx chapa-cli merge

Supports --insecure for corporate networks with TLS interception and --verbose for diagnostics.

Bilingual UI (EN / ES)

Chapa's interface is available in English and Spanish. A language picker (globe icon, next to the theme toggle in the nav bar) saves your preference in a cookie. Your locale is resolved in that order — the chapa-locale cookie first, then your browser's Accept-Language header — so a Spanish visitor gets Spanish. English is the fallback only when a request carries no locale signal at all, which is the normal case for an embedded badge in a README. The main content pages (landing, about, privacy, terms, archetype guides) are server-rendered per locale — both languages are pre-built, so there's no flash of the wrong language while the page loads.

Admin Dashboard (/admin)

Admin-only dashboard with user management, agent fleet monitoring, feature flags, engagement controls, campaign management, and a command bar. Access controlled by the ADMIN_HANDLES environment variable.

Badge Verification

Badges marked Verified metrics include a 32-character HMAC-SHA256 hash. Anyone can look up the original stored verification record at /api/verify/:hash and compare its returned fields with the badge. The lookup does not scan or re-sign an SVG.

Quick Start

# Prerequisites: Node.js 20+, corepack enabled
corepack enable pnpm

# Install dependencies
pnpm install

# Copy env vars and fill in values
cp .env.example .env.local

# Run dev server (port 3001)
pnpm run dev

Project Structure

chapa/
├── apps/web/              # Next.js 16 app (App Router)
│   ├── proxy.ts           # Narrow locale rewrite for the 9 content pages below (no visible URL prefix)
│   ├── app/               # Pages and API routes
│   │   ├── api/           # Auth, refresh, verify, health, CLI, cron, admin endpoints
│   │   ├── [locale]/      # Landing, about, privacy, terms, archetypes — server-rendered per locale
│   │   ├── admin/         # Admin dashboard (protected)
│   │   ├── u/[handle]/    # Share page + badge.svg route
│   │   ├── studio/        # Creator Studio
│   │   ├── settings/      # Account settings (connections, insights import, identity)
│   │   └── verify/        # Badge verification landing
│   ├── components/        # React components (terminal UI, badge, dashboard, nav, tooltips)
│   └── lib/               # Business logic
│       ├── auth/          # GitHub, Bitbucket, Codeberg OAuth + CLI token management
│       ├── cache/         # Upstash Redis (6h TTL)
│       ├── dashboard/     # Insight generation (CoachingInsights, DimensionCard, SubMetricPanel)
│       ├── db/            # Supabase data access (users, platforms, snapshots, campaigns)
│       ├── github/        # GraphQL client + stats aggregation + multi-platform merge
│       ├── bitbucket/     # Bitbucket API client + stats aggregation
│       ├── codeberg/      # Codeberg API client + stats aggregation
│       ├── gitlab/        # GitLab API client + stats aggregation
│       ├── history/       # Lifetime metric snapshots (Supabase)
│       ├── i18n/          # Locale detection, dictionaries (en/es), server + client translation
│       ├── impact/        # Impact v6 scoring engine
│       ├── insights/      # AI tool insights integration
│       ├── profile/       # Profile materialisation and orchestration
│       ├── render/        # React-to-SVG badge renderer
│       ├── verification/  # HMAC-SHA256 badge signing
│       ├── webmcp/        # Agent-facing tool adapter, shared tools, route/tool map
│       ├── effects/       # Visual effects library
│       └── email/         # Resend integration + campaigns
├── packages/
│   ├── cli/               # chapa-cli npm package
│   └── shared/            # Shared types, constants, scoring utils
└── docs/                  # Specs, design system, guides

Impact v6 Scoring

Chapa computes a multi-dimensional developer profile from commits, PRs, code reviews, and activity patterns:

DimensionWhat it measures
DeliveryPRs merged, issues closed, commits, lead time modifier (±5%)
QualityCode reviews + review ratio (collaborative) or PR hygiene (solo), batch size score
ConsistencyActive days, heatmap evenness, week coverage
BreadthRepository diversity, cross-project influence, community signals
Craft (optional)AI tool usage patterns via Claude Code insights

An internal confidence score (50–100) reflects data completeness and gently adjusts the composite score to produce the final tier. Confidence is not shown on developer-facing pages — it works behind the scenes to ensure fair scoring.

Tech Stack

LayerTechnology
FrameworkNext.js 16 (App Router), React 19, TypeScript
StylingTailwind CSS v4 (dark theme, purple accent)
CachingUpstash Redis
DatabaseSupabase (PostgreSQL)
DataGitHub GraphQL API, Bitbucket REST API, Codeberg/Gitea API, GitLab REST API
AnalyticsPostHog
EmailResend
CLINode.js, tsup, device auth flow
HostingVercel
TestingVitest with a TDD workflow

Environment Variables

VariableRequiredDescription
GITHUB_CLIENT_IDYesGitHub OAuth App client ID
GITHUB_CLIENT_SECRETYesGitHub OAuth App client secret
NEXTAUTH_SECRETYesSession signing / token encryption secret
NEXT_PUBLIC_BASE_URLYesBase URL for OAuth redirects
UPSTASH_REDIS_REST_URLYesUpstash Redis REST URL
UPSTASH_REDIS_REST_TOKENYesUpstash Redis REST token
SUPABASE_URLNoSupabase project URL (DB features degrade gracefully)
SUPABASE_SERVICE_ROLE_KEYNoSupabase service role key (server-side only)
NEXT_PUBLIC_POSTHOG_KEYNoPostHog project API key
NEXT_PUBLIC_POSTHOG_HOSTNoPostHog ingestion host
CHAPA_ALERT_WEBHOOK_URLNoActive operational alert webhook for health, badge, OAuth, and cron failures
RESEND_API_KEYNoResend email service
BITBUCKET_CLIENT_IDNoBitbucket OAuth consumer key
BITBUCKET_CLIENT_SECRETNoBitbucket OAuth consumer secret
CODEBERG_CLIENT_IDNoCodeberg OAuth app client ID
CODEBERG_CLIENT_SECRETNoCodeberg OAuth app secret
GITLAB_CLIENT_IDNoGitLab OAuth app client ID
GITLAB_CLIENT_SECRETNoGitLab OAuth app secret
NEXT_PUBLIC_GITLAB_ENABLEDNoSet to "true" to enable GitLab link/unlink in User Menu
CHAPA_VERIFICATION_SECRETNoRequired in production for /api/verify; when unset outside production, verification is disabled
ADMIN_HANDLESNoComma-separated admin GitHub handles
CRON_SECRETNoRequired anywhere /api/cron/* should run; cron routes return 503 when it is unset

See .env.example for the full list with descriptions.

Scripts

CommandDescription
pnpm run devStart dev server (port 3001)
pnpm run buildProduction build
pnpm run testRun all tests
pnpm run test:watchTests in watch mode
pnpm run test:coverageTests with coverage report
pnpm run typecheckTypeScript check (all workspaces)
pnpm run lintESLint check

Key Endpoints

EndpointDescription
GET /Landing page
GET /u/:handleShare page — badge preview, breakdown, embed snippets
GET /u/:handle/badge.svgEmbeddable SVG badge (CDN-cached)
GET /studioCreator Studio (auth required)
GET /adminAdmin dashboard (admin handles only)
GET /aboutAbout page (scoring explainer, archetype showcase)
GET /api/healthHealth check (status, timestamp, and Redis/Supabase/GitHub dependency probes)
GET /api/versionNo-store deployment identity for release verification
GET /api/verify/:hashBadge verification
POST /api/refresh?handle=Force refresh (rate-limited)
GET /api/history/:handleScore history, trend, and diff

Embed Your Badge

Markdown:

[![Chapa Badge](https://chapa.thecreativetoken.com/u/YOUR_HANDLE/badge.svg)](https://chapa.thecreativetoken.com/u/YOUR_HANDLE)

HTML:

<a href="https://chapa.thecreativetoken.com/u/YOUR_HANDLE">
  <img src="https://chapa.thecreativetoken.com/u/YOUR_HANDLE/badge.svg" alt="Chapa Impact Badge" width="600" />
</a>

License

Chapa is available under the MIT License.