Custom Vercel Multi Env

Dual-environment Vercel statusline monitoring both production and preview deployments simultaneously with color-coded status indicators.

When to Use This Setting

Apply this setting when you need to:

• Monitor production and preview deployment environments side-by-side in a single statusline
• Quickly assess deployment health across both environments with green, yellow, and red indicators
• Manage multi-environment workflows where preview deploys must pass before promoting to production Consider alternatives when:
• Your project only uses a single deployment target without separate preview environments
• You prefer separate monitoring dashboards for production versus preview deployments

Quick Start

Configuration

Copy
name: custom-vercel-multi-env
type: setting
category: statusline

Example Application

Copy
claude setting:apply custom-vercel-multi-env

Example Output

Setting applied. Changes:
- statusLine.type: command
- statusLine.command: bash vercel-multi-env inline
- environments: production, preview
- api_scan: last 10 deployments
- status_icons: green(READY), yellow(BUILDING), red(ERROR), white(unknown)

Core Concepts

Multi-Environment Monitor Overview

Aspect	Details
Production Tracking	Filters deployments by target=production and shows the latest state
Preview Tracking	Filters deployments by target=preview and shows the latest state
Color Coding	Green for READY, yellow for BUILDING, red for ERROR, white for unknown
API Efficiency	Fetches 10 deployments in one call and filters client-side for both targets
Compact Display	Shows both environments on a single statusline with abbreviated labels

Multi-Env Architecture

+-------------------+     +-----------------------+     +------------------+
| Vercel API Call   |---->| Target Filter         |---->| Production State |
| /v6/deployments   |     | select target =       |     | first match      |
| limit=10          |     | "production"          |     | READY/BUILD/ERR  |
+-------------------+     +-----------------------+     +------------------+
                                    |                          |
                                    v                          v
                          +---------------------+     +------------------+
                          | Preview Filter      |     | Icon Mapper      |
                          | select target =     |---->| green/yellow/red |
                          | "preview"           |     | per environment  |
                          +---------------------+     +------------------+

Configuration

Parameter	Type	Default	Description
vercel_token	string	""	Bearer token for Vercel API authentication
vercel_project_id	string	""	Project identifier from your Vercel dashboard
api_fetch_limit	integer	10	Number of recent deployments to fetch for filtering both environments
show_production	boolean	true	Display production environment deployment status
show_preview	boolean	true	Display preview environment deployment status

Best Practices

1. Increase fetch limit for active branches - If your team frequently pushes to multiple branches generating preview deployments, increase api_fetch_limit to 20 so the filter always finds the latest preview deployment even when many are queued.
2. Use as a promotion gate - Before promoting a preview deployment to production, check the multi-env statusline to confirm preview shows green. This visual gate prevents promoting failed or in-progress builds to production.
3. Add staging environment - If your workflow includes a staging environment, extend the filter to include a third target. The statusline will show Prod/Staging/Preview states, giving complete deployment pipeline visibility.
4. Alert on environment mismatch - Extend the script to detect when production is red while preview is green, indicating a regression in the production deployment. Trigger a special alert icon for this scenario.
5. Coordinate with branch protection rules - If your repository has branch protection requiring successful preview deployments before merging, the multi-env monitor gives you immediate visual confirmation that the preview deployment passed.

Common Issues

1. Both environments show question marks - The VERCEL_TOKEN or VERCEL_PROJECT_ID is missing or invalid. Verify both environment variables are set and the token has not expired.
2. Preview always shows unknown - No preview deployments exist in the recent fetch window. This is normal if you have not pushed any branch deployments recently. Push a branch commit to trigger a preview deployment.
3. Production and preview show identical states - If you only deploy to production without separate preview environments, both filters may match the same deployments. Configure your Vercel project to use preview environments for branch deployments.