awesome-reviewers/index.html

---
layout: default
---

<section class="hero">
    <div class="container">
        <h1>Awesome Reviewers ✨</h1>
        <p>Ready-to-use system prompts extracted from thousands of code review comments in leading open source repositories. Simply copy and paste into VS Code, Cursor, Claude, or any AI agent.</p>
    </div>
</section>

<section class="library-header">
    <div class="container">
        <h2>Reviewers Library (<span id="reviewer-count" class="stat-value" data-total="{{ site.reviewers.size }}">{{ site.reviewers.size }}</span>)</h2>
        <button id="add-repo-button" class="add-repo-btn">Add Repository</button>
    </div>
</section>

<section class="filters">
    <div class="container">
        <div class="filter-controls">
            <div class="filter-group">
                <input type="text" id="search" class="search-input" placeholder="Search reviewers, languages, categories, repos...">
            </div>
            <div class="filter-group">
                <div id="category-filter" class="multi-select-container" data-placeholder="All Categories"></div>
            </div>
            <div class="filter-group">
                <div id="repo-filter" class="multi-select-container" data-placeholder="All Repositories"></div>
            </div>
            <div class="filter-group">
                <div id="language-filter" class="multi-select-container" data-placeholder="All Languages"></div>
            </div>
            <button class="clear-filters" onclick="clearFilters()" title="Clear filters">⟳</button>
        </div>
    </div>
</section>

<main class="main-content">
    <div class="container">
        <div class="reviewer-grid">
            {% assign sorted_reviewers = site.reviewers | sort: "comments_count" | reverse %}
            {% assign initial_limit = 100 %}
            {% for reviewer in sorted_reviewers %}
            {% assign index = forloop.index0 %}
            {% assign slug = reviewer.url | remove: '/reviewers/' | remove: '/' %}
            <div class="reviewer-card{% if index >= initial_limit %} extra-reviewer{% endif %}" id="{{ slug }}" data-slug="{{ slug }}"
                 data-repo="{{ reviewer.repository }}"
                 data-category="{{ reviewer.label }}"
                 data-language="{{ reviewer.language }}">
                <div class="reviewer-header">
                    <div>
                        <h3 class="reviewer-title">{{ reviewer.title }}</h3>
                        <a class="reviewer-repo" href="https://github.com/{{ reviewer.repository }}" target="_blank" rel="noopener noreferrer">
                            <svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor">
                                <path d="M8.21.07l6 3A.75.75 0 0 1 15 3.75V12a.75.75 0 0 1-.4.67l-6 3a.75.75 0 0 1-.6 0l-6-3A.75.75 0 0 1 1 12V3.75a.75.75 0 0 1 .39-.68l6-3a.75.75 0 0 1 .82 0ZM8 1.26 3.25 3.48 8 5.74l4.75-2.26L8 1.26ZM2.5 4.97v6.54l5 2.5V7.47l-5-2.5Zm11 6.54V4.97l-5 2.5v6.54l5-2.5Z"/>
                            </svg>
                            {{ reviewer.repository }}
                        </a>
                    </div>
                    <div class="reviewer-stats">
                        <div class="stat-item stat-comments">
                            <svg width="12" height="12" viewBox="0 0 16 16" fill="currentColor">
                                <path d="M1.75 2.5A.75.75 0 0 1 2.5 1.75h11a.75.75 0 0 1 .75.75v8.5a.75.75 0 0 1-.75.75H6.4l-3.52 3.2a.75.75 0 0 1-1.28-.55V2.5Z"/>
                            </svg>
                            <span class="stat-value" data-count="{{ reviewer.comments_count | default: 0 }}">{{ reviewer.comments_count | default: 0 }}</span>
                        </div>
                        <div class="stat-item stat-stars">
                            ⭐ <span class="stat-value" data-count="{{ reviewer.repository_stars | default: 0 }}">{{ reviewer.repository_stars | default: 0 }}</span>
                        </div>
                    </div>
                </div>

                <p class="reviewer-description">{{ reviewer.description | truncate: 120 }}</p>

                <div class="reviewer-meta">
                    <div class="reviewer-tags">
                        <span class="tag">{{ reviewer.label }}</span>
                        <span class="tag language">{{ reviewer.language }}</span>
                    </div>
                    <div class="card-actions">
                        <a href="{{ reviewer.url }}" class="fullpage-button" onclick="event.stopPropagation()">⛶</a>
                        <button class="share-button" onclick="shareFromCard(event, '{{ slug }}')">Share</button>
                    </div>
                </div>
            </div>
            {% endfor %}
        </div>
        {% if site.reviewers.size > 100 %}
        <div class="load-more-wrapper">
            <button id="load-more" onclick="loadMore()">Show all Reviewers</button>
        </div>
        {% endif %}
    </div>
</main>

<div id="drawer" class="drawer">
    <div class="drawer-overlay" onclick="closeDrawer()"></div>
    <div class="drawer-panel">
        <div class="drawer-header">
            <button class="drawer-deploy-btn" onclick="deployToBaz()">
                🚀 Deploy to baz
            </button>
            <button class="drawer-close" onclick="closeDrawer()">&times;</button>
        </div>
        <div id="drawer-content"></div>
    </div>
</div>