Una skill de Openclaw que transforma diffs de git en texto plano y notas de revisión de código en páginas de visualización HTML interactivas y autocontenidas, con indicadores de riesgo y guías con resaltado de sintaxis.
Instalar y Descargar
1. ClawHub CLI
La forma más rápida de instalar una habilidad directamente desde el registro.
npx clawhub@latest install code-review-visualizer
2. Instalación manual
Copia la carpeta de la habilidad a una de estas ubicaciones
~/.openclaw/skills/ <project>/skills/ Prioridad: Espacio de trabajo > Local > Integrado
3. Instalación del prompt
Copia este prompt en OpenClaw para instalarlo automáticamente.
Ayúdame a instalar code-review-visualizer usando Clawhub. Si Clawhub no está instalado, instálalo primero (npm i -g clawhub).
¿Prefieres descargar?
Obtén los archivos originales de la habilidad en un archivo ZIP.
¿Qué es Code Review Visualizer?
Code Review Visualizer es una utilidad diseñada específicamente para Openclaw Skills para cerrar la brecha entre diffs de terminal densos y puros y las revisiones de código legibles por humanos. Automatiza la generación de informes HTML de un solo archivo con un formato atractivo que resumen los pull requests, mapean los niveles de riesgo arquitectónico y presentan las modificaciones de código cronológicamente.
Al aprovechar el estilo integrado y los patrones de diseño responsivo, esta herramienta permite a los desarrolladores y mantenedores evaluar rápidamente los alcances de los cambios, comprender las modificaciones lógicas mediante comparaciones de comportamiento antes/después y revisar el código en cualquier navegador de escritorio o móvil sin depender de dependencias externas.
Casos de uso de Code Review Visualizer
- Optimización de las Revisiones de Pull Requests: Transformación de entradas de diff de git largas y de múltiples archivos en resúmenes visuales altamente escaneables que contienen mapas de calor de riesgo.
- Alineación e Integración del Equipo: Creación de sesiones interactivas de recorrido por módulos complejos para explicar las rutas de llamada, los límites de confianza y el flujo de datos a las nuevas contrataciones de ingeniería.
- Auditoría de Distribución de Riesgos: Etiquetado de archivos críticos con alertas codificadas por colores para resaltar la lógica que exige una atención más cercana, que merece una mirada o que es completamente segura.
- Generación Automatizada de Descripciones de PR: Generación de rutas de lectura lógica junto con las motivaciones de la modificación para integrarlas de nuevo en las plataformas de control de versiones.
Cómo funciona Code Review Visualizer
- Ingesta de Entradas: La skill recibe texto de código puro, nombres de ramas, listados de archivos o salidas de diff de parches de git proporcionados por el usuario.
- Análisis Contextual: El motor subyacente analiza los cambios, clasifica la sintaxis, mapea las dependencias arquitectónicas y calcula los factores de riesgo.
- Asignación de Riesgos y Etiquetas: Los archivos se clasifican en niveles de riesgo específicos representados por indicadores visuales explícitos: seguro, merece una mirada o necesita atención.
- Compilación HTML: El sistema integra todos los diseños de cuadrícula CSS necesarios, las bases de color y la lógica de estructura directamente en una sola plantilla.
- Exportación Autocontenida: La salida final se entrega de forma limpia como un documento HTML completamente autocontenido listo para ser renderizado a través de navegadores o utilidades locales de canvas.
Configuración de Code Review Visualizer
Para activar el visualizador dentro de su entorno Openclaw, declare la dependencia de la skill dentro de su manifiesto de configuración o actívela dinámicamente durante la ejecución del agent. Asegúrese de que el flujo de trabajo de su agent tenga los permisos apropiados en el sistema de archivos para generar artefactos HTML localizados.
# Verify git diffs are available to pass to the skill pipeline
git diff main..feature-branch > changes.diff
# Invoke Openclaw agent with the code-review-visualizer asset configuration
openclaw run code-review-visualizer --input changes.diff
Esquema de datos y taxonomía de Code Review Visualizer
La skill estructura consistentemente su salida generada utilizando un modelo de diseño integrado. Formatea la información utilizando la siguiente jerarquía de diseño:
| Section | Component Type | Content Elements |
|---|---|---|
| Header Meta | Core Info Block | PR Title, Author, TL;DR Summary, and Motivation Context |
| Risk Heatmap | Visual Badges | Categorized file array mapped via green (safe), yellow (worth a look), and red (needs attention) states |
| File Walkthrough | Code Blocks | Syntax-highlighted Github-style diff panels with expanding source snippets |
| Architecture Map | Call Path Layout | Trust boundary markers, external dependency borders, and data flow steps |
Funciones avanzadas de Code Review Visualizer
- Autocontención sin Dependencias: Compila todas las hojas de estilo en cascada (CSS), cuadrículas estructurales y lógica en línea para permitir la portabilidad sin conexión.
- Arquitectura de Componentes Responsiva: Da formato al texto, a las tablas de comportamiento lado a lado y a los contenedores de código expandidos a la perfección tanto en vistas de escritorio como en visores móviles.
- Truncamiento Inteligente de Diffs: Recorta automáticamente flujos masivos de diffs para preservar solo las líneas operativas críticas, agregando indicadores de contexto claros para las líneas omitidas.
- Resaltado de Límites de Confianza: Implementa estilos de canvas dedicados para resaltar secciones de alta seguridad, puntos de entrada de datos no confiables y límites de red.
SKILL.md
Cargando
Habilidades relacionadas de Openclaw
Code Walkthrough
Una skill de AI agent que mapea flujos de datos, rastrea pilas de llamadas y visualiza límites de seguridad en una única página HTML autocontenida.
CoreCoder Coding Agent Skill
CoreCoder es una habilidad avanzada de agente de codificación de IA que implementa los siete patrones arquitectónicos de Claude Code para una modificación precisa del código, aislamiento de subagentes y optimización de contexto de múltiples capas.
Financial Equity Research
Una habilidad de agent de investigación de acciones de nivel institucional que automatiza el análisis de resultados, el inicio de cobertura y las actualizaciones de modelos financieros.
Suite de Análisis y Modelado Financiero
Un kit de herramientas de modelado y análisis financiero de nivel institucional para generar, auditar y actualizar modelos DCF, LBO, Comps, de 3 estados financieros y presentaciones para inversores.
Workday Music Greeter
Sincroniza automáticamente el entorno de su día de trabajo cambiando las escenas musicales, extrayendo GIFs que coincidan y enviando saludos diarios automatizados por correo electrónico según la hora del día.
Jiebang SEO Analyzer
Una habilidad integral de auditoría de SEO y extracción de metadados diseñada para evaluar la salud de la página web y las optimizaciones estructurales.
jiebang-file-process
Una eficiente habilidad de utilidad para hashing de texto, codificación/decodificación Base64 y transformaciones URL basadas en la Jiebang API.
Presentado*
