Sistema de Triggers Automáticos para Desarrollo: Context

TL;DR

Crea un sistema que detecta automáticamente cuando dices “hagamos un post” y carga todo el contexto necesario (pilares, tags, posts relacionados) para acelerar el desarrollo. Implementación en TypeScript con ~100 líneas de código.

El Problema: Context Switching Manual

En el desarrollo moderno, constantemente necesitamos cargar contexto:

Crear posts: ¿Qué pilares existen? ¿Qué tags usar? ¿Hay posts similares?
Trabajar en features: ¿Qué componentes hay? ¿Qué patrones seguir?
Debugging: ¿Qué configuración actual? ¿Qué logs revisar?

El problema: Cargar este contexto manualmente es lento y propenso a errores.

La Solución: Sistema de Triggers Inteligente

Concepto Base

Un sistema que:

Detecta intenciones mediante patrones de texto
Carga contexto automáticamente según la intención
Presenta información relevante de forma estructurada
Se integra con herramientas existentes

Arquitectura del Sistema

interface TriggerSystem {
  patterns: RegExp[];           // Patrones de detección
  contextLoader: () => Context; // Función de carga
  display: (ctx: Context) => void; // Presentación
}

interface Context {
  pillars: string[];
  tags: TagCount[];
  recentItems: Item[];
  rules: string;
}

Implementación Paso a Paso

1. Definir Patrones de Detección

class SimpleMultiAgent {
  constructor() {
    // Triggers para detección de intenciones de posts
    this.POST_TRIGGERS = [
      /creamos un post/i,
      /creemos un post/i,
      /crear post/i,
      /hagamos un post/i,
      /vamos a crear un post/i,
      /hacer un post/i,
      /post con esto/i,
      /documentar esto/i
    ];
  }

  detectPostIntent(message: string): boolean {
    return this.POST_TRIGGERS.some(pattern => pattern.test(message));
  }
}

2. Implementar Context Loading

async loadBlogContext(): Promise<BlogContext> {
  try {
    console.log('Detectada intención de crear post - Cargando contexto...\n');

    const context = {
      pillars: await this.getCurrentPillars(),
      tags: await this.getExistingTags(),
      recentPosts: await this.getRecentPosts(5),
      rules: await this.loadEssentialRules()
    };

    this.displayBlogContext(context);
    return context;

  } catch (error) {
    console.error('Error cargando contexto del blog:', error.message);
    return null;
  }
}

3. Cargar Pilares Dinámicamente

async getCurrentPillars(): Promise<string[]> {
  try {
    // Leer configuración de pilares desde archivo TypeScript
    const pillarsConfig = await fs.readFile(
      'src/features/content-pillars/config/pillars.config.ts',
      'utf8'
    );

    // Extraer IDs de pilares del CONTENT_PILLARS
    const pillarMatches = pillarsConfig.match(/'([^']+)':\s*{/g);

    if (pillarMatches) {
      const pillars = pillarMatches.map(match =>
        match.match(/'([^']+)':/)[1]
      );
      return pillars;
    }

    // Fallback a pilares por defecto
    return ['astro-performance', 'typescript-architecture', 'automation-devops', 'seo-optimization'];
  } catch (error) {
    return ['astro-performance', 'typescript-architecture', 'automation-devops', 'seo-optimization'];
  }
}

4. Analizar Tags Existentes

async getExistingTags(): Promise<TagCount[]> {
  try {
    const postsDir = 'src/content/blog';
    const files = await fs.readdir(postsDir);
    const mdFiles = files.filter(f => f.endsWith('.md'));

    const tagCounts: Record<string, number> = {};

    for (const file of mdFiles) {
      try {
        const content = await fs.readFile(path.join(postsDir, file), 'utf8');
        // Buscar tags en el frontmatter YAML
        const frontmatterMatch = content.match(/^---\s*\n([\s\S]*?)\n---/);

        if (frontmatterMatch) {
          const frontmatter = frontmatterMatch[1];
          const tagsMatch = frontmatter.match(/tags:\s*\[([\s\S]*?)\]/);

          if (tagsMatch) {
            const tagsContent = tagsMatch[1];
            // Extraer tags, manejando comillas simples y dobles
            const tags = tagsContent.match(/['"]([^'"]+)['"]/g)
              ?.map(t => t.replace(/['"]/g, '')) || [];

            tags.forEach(tag => {
              tagCounts[tag] = (tagCounts[tag] || 0) + 1;
            });
          }
        }
      } catch (fileError) {
        continue; // Continuar con el siguiente archivo
      }
    }

    // Retornar tags más usados
    return Object.entries(tagCounts)
      .sort(([,a], [,b]) => b - a)
      .slice(0, 20)
      .map(([tag, count]) => ({ tag, count }));

  } catch (error) {
    return [];
  }
}

5. Presentación Inteligente del Contexto

displayBlogContext(context: BlogContext): void {
  console.log('Contexto del blog cargado:');
  console.log(`${context.pillars.length} pilares existentes: ${context.pillars.join(', ')}`);
  console.log(`${context.tags.length} tags más usados disponibles para reutilizar`);
  console.log(`${context.recentPosts.length} posts recientes analizados para evitar duplicados`);
  console.log(`${context.rules}`);
  console.log(`Templates SEO y workflow de creación listos\n`);

  console.log('¿Sobre qué tema específico quieres crear el post?');
  console.log('Voy a evaluar automáticamente qué pilar encaja mejor y sugerir tags relevantes.\n');
}

6. Integración con CLI

// CLI Interface
const command = process.argv[2];
const agent = new SimpleMultiAgent();

switch (command) {
  case 'validate':
    agent.validate();
    break;
  case 'context':
    agent.loadBlogContext();
    break;
  case 'post':
    await agent.loadBlogContext();
    await agent.createPost();
    break;
  case 'lesson':
    await agent.loadBlogContext();
    await agent.createLesson();
    break;
  default:
    console.log(`
Sistema Multi-agente Simplificado

Comandos disponibles:
  validate  - Validar configuración del sistema
  context   - Cargar contexto del blog
  post      - Crear nuevo post (con contexto)
  lesson    - Crear lección aprendida (con contexto)

Uso: npm run multi-agent:[comando]
    `);
}

Casos de Uso Avanzados

Triggers para Diferentes Contextos

const TRIGGER_PATTERNS = {
  POST_CREATION: {
    patterns: [/creamos un post/i, /hagamos un post/i],
    action: 'load-blog-context',
    workflow: 'post-creation'
  },
  COMPONENT_WORK: {
    patterns: [/trabajar en componente/i, /crear componente/i],
    action: 'load-component-context',
    workflow: 'component-development'
  },
  DEBUGGING: {
    patterns: [/debuggear/i, /error en/i, /problema con/i],
    action: 'load-debug-context',
    workflow: 'troubleshooting'
  }
};

Context Loading Especializado

async loadComponentContext(): Promise<ComponentContext> {
  return {
    existingComponents: await this.scanComponents(),
    patterns: await this.loadDesignPatterns(),
    styles: await this.getStyleGuide(),
    tests: await this.getTestExamples()
  };
}

async loadDebugContext(): Promise<DebugContext> {
  return {
    recentLogs: await this.getRecentLogs(),
    configuration: await this.getCurrentConfig(),
    commonIssues: await this.getKnownIssues(),
    tools: await this.getDebugTools()
  };
}

Beneficios del Sistema

1. Velocidad de Desarrollo

Antes: 5-10 minutos buscando contexto manualmente
Después: 5 segundos de carga automática

2. Consistencia

Pilares detectados automáticamente desde configuración real
Tags sugeridos basados en uso histórico
Patrones establecidos aplicados consistentemente

3. Reducción de Errores

No más tags inventados - solo reutilización inteligente
No más pilares incorrectos - detección automática
No más duplicados - análisis de posts existentes

4. Escalabilidad

Fácil agregar nuevos triggers - solo patrones regex
Context loaders modulares - cada uno independiente
Integración simple - comandos npm estándar

Implementación en tu Proyecto

Paso 1: Estructura Base

mkdir -p scripts/triggers
touch scripts/triggers/simple-multi-agent.js
touch scripts/triggers/context-loaders.js
touch scripts/triggers/display-helpers.js

Paso 2: Configurar package.json

{
  "scripts": {
    "triggers:validate": "node scripts/triggers/simple-multi-agent.js validate",
    "triggers:context": "node scripts/triggers/simple-multi-agent.js context",
    "triggers:post": "node scripts/triggers/simple-multi-agent.js post"
  }
}

Paso 3: Definir tus Triggers

// Adapta estos patrones a tu workflow
const YOUR_TRIGGERS = [
  /crear componente/i,
  /nueva feature/i,
  /documentar/i,
  /testear/i
];

Lecciones Aprendidas

1. Simplicidad sobre Complejidad

100 líneas vs 725 líneas del sistema anterior
Funcionalidad esencial vs features innecesarias
Mantenimiento fácil vs debugging complejo

2. Detección Robusta

Múltiples patrones para la misma intención
Case insensitive para flexibilidad
Regex simples para mantenibilidad

3. Context Loading Inteligente

Lectura directa de archivos de configuración
Fallbacks para casos de error
Parsing robusto de diferentes formatos

4. Presentación Clara

Información estructurada fácil de leer
Feedback inmediato sobre lo cargado
Próximos pasos claros para el usuario

Herramientas de Debugging

# Validar sistema
npm run triggers:validate

# Probar carga de contexto
npm run triggers:context

# Debug con logs detallados
DEBUG=true npm run triggers:context

Extensiones Futuras

Machine Learning: Detectar intenciones más complejas
Integración IDE: Triggers desde comentarios en código
Context Sharing: Compartir contexto entre desarrolladores
Analytics: Métricas de uso y efectividad

¿Te ha resultado útil esta guía? ¡Compártela y déjanos tus comentarios!