Merge pull request #14 from CapituloJaverianoACM/develop

feat/imageImprovement

Author: Samu-Kiss

src/commands/announce-handlers.ts

@@ -27,6 +27,92 @@ const PRESET_COLORS = [
   { name: '⚪ Blanco Discord', value: '#5865F2' },
 ];
 
+/**
+ * Construye los componentes (dropdowns y botones) para el anuncio
+ */
+function buildAnnouncementComponents(session: any, cfg: any) {
+  const rows = [];
+
+  // Dropdown de colores
+  const colorMenu = new StringSelectMenuBuilder()
+    .setCustomId(`announce:color:${session.userId}`)
+    .setPlaceholder('🎨 Selecciona un color')
+    .addOptions(
+      PRESET_COLORS.map((color) =>
+        new StringSelectMenuOptionBuilder()
+          .setLabel(color.name)
+          .setValue(color.value)
+          .setDefault(session.announcement.color === color.value),
+      ),
+    );
+  rows.push(new ActionRowBuilder<StringSelectMenuBuilder>().addComponents(colorMenu));
+
+  // Dropdown de roles a mencionar (si existen roles de notificaciones configurados)
+  const notificationRoles = [];
+  const seenRoleIds = new Set<string>();
+
+  // Agregar roles solo si no están duplicados
+  if (cfg?.roles.laLiga && !seenRoleIds.has(cfg.roles.laLiga)) {
+    notificationRoles.push({ label: '⚽ La Liga', value: cfg.roles.laLiga });
+    seenRoleIds.add(cfg.roles.laLiga);
+  }
+  if (cfg?.roles.preParciales && !seenRoleIds.has(cfg.roles.preParciales)) {
+    notificationRoles.push({ label: '📚 Pre-Parciales', value: cfg.roles.preParciales });
+    seenRoleIds.add(cfg.roles.preParciales);
+  }
+  if (cfg?.roles.cursos && !seenRoleIds.has(cfg.roles.cursos)) {
+    notificationRoles.push({ label: '📖 Cursos', value: cfg.roles.cursos });
+    seenRoleIds.add(cfg.roles.cursos);
+  }
+  if (cfg?.roles.notificacionesGenerales && !seenRoleIds.has(cfg.roles.notificacionesGenerales)) {
+    notificationRoles.push({
+      label: '🔔 Notificaciones Generales',
+      value: cfg.roles.notificacionesGenerales,
+    });
+    seenRoleIds.add(cfg.roles.notificacionesGenerales);
+  }
+
+  if (notificationRoles.length > 0) {
+    const rolesMenu = new StringSelectMenuBuilder()
+      .setCustomId(`announce:roles:${session.userId}`)
+      .setPlaceholder('🔔 Selecciona roles a mencionar (opcional)')
+      .setMinValues(0)
+      .setMaxValues(notificationRoles.length)
+      .addOptions(
+        notificationRoles.map((role) =>
+          new StringSelectMenuOptionBuilder()
+            .setLabel(role.label)
+            .setValue(role.value)
+            .setDefault(session.announcement.roles?.includes(role.value) || false),
+        ),
+      );
+    rows.push(new ActionRowBuilder<StringSelectMenuBuilder>().addComponents(rolesMenu));
+  }
+
+  // Botones de acción
+  const actionRow = new ActionRowBuilder<ButtonBuilder>().addComponents(
+    new ButtonBuilder()
+      .setCustomId(`announce:edit:${session.userId}`)
+      .setLabel('✏️ Editar Texto')
+      .setStyle(ButtonStyle.Secondary),
+    new ButtonBuilder()
+      .setCustomId(`announce:image:${session.userId}`)
+      .setLabel('🖼️ Imagen')
+      .setStyle(ButtonStyle.Secondary),
+    new ButtonBuilder()
+      .setCustomId(`announce:publish:${session.userId}`)
+      .setLabel('📢 Publicar')
+      .setStyle(ButtonStyle.Success),
+    new ButtonBuilder()
+      .setCustomId(`announce:cancel:${session.userId}`)
+      .setLabel('❌ Cancelar')
+      .setStyle(ButtonStyle.Danger),
+  );
+  rows.push(actionRow);
+
+  return rows;
+}
+
 /**
  * Handler para el modal del announce
  */
@@ -98,109 +184,43 @@ export async function handleAnnounceModal(interaction: any) {
       flags: 1 << 6,
     });
 
-    // Actualizar el mensaje original del preview usando el mensaje guardado
+    // Actualizar el mensaje original del preview usando interaction del mensaje original
     try {
-      if (session.previewMessage) {
+      logger.info('Attempting to update preview via webhook', {
+        requestId: session.requestId,
+        hasOriginalInteraction: !!session.originalInteraction,
+        imageUrl,
+      });
+
+      if (session.originalInteraction) {
         const embed = createAnnouncementPreview(session);
         const cfg = getGuildConfig(session.guildId);
 
-        // Reconstruir los componentes (necesarios para que Discord re-renderice el embed)
-        const rows = [];
-
-        // Dropdown de colores
-        const colorMenu = new StringSelectMenuBuilder()
-          .setCustomId(`announce:color:${session.userId}`)
-          .setPlaceholder('🎨 Selecciona un color')
-          .addOptions(
-            PRESET_COLORS.map((color) =>
-              new StringSelectMenuOptionBuilder()
-                .setLabel(color.name)
-                .setValue(color.value)
-                .setDefault(session.announcement.color === color.value),
-            ),
-          );
-        rows.push(new ActionRowBuilder<StringSelectMenuBuilder>().addComponents(colorMenu));
-
-        // Dropdown de roles
-        const notificationRoles = [];
-        const seenRoleIds = new Set<string>();
-
-        if (cfg?.roles.laLiga && !seenRoleIds.has(cfg.roles.laLiga)) {
-          notificationRoles.push({ label: '⚽ La Liga', value: cfg.roles.laLiga });
-          seenRoleIds.add(cfg.roles.laLiga);
-        }
-        if (cfg?.roles.preParciales && !seenRoleIds.has(cfg.roles.preParciales)) {
-          notificationRoles.push({ label: '📚 Pre-Parciales', value: cfg.roles.preParciales });
-          seenRoleIds.add(cfg.roles.preParciales);
-        }
-        if (cfg?.roles.cursos && !seenRoleIds.has(cfg.roles.cursos)) {
-          notificationRoles.push({ label: '📖 Cursos', value: cfg.roles.cursos });
-          seenRoleIds.add(cfg.roles.cursos);
-        }
-        if (
-          cfg?.roles.notificacionesGenerales &&
-          !seenRoleIds.has(cfg.roles.notificacionesGenerales)
-        ) {
-          notificationRoles.push({
-            label: '🔔 Notificaciones Generales',
-            value: cfg.roles.notificacionesGenerales,
-          });
-          seenRoleIds.add(cfg.roles.notificacionesGenerales);
-        }
-
-        if (notificationRoles.length > 0) {
-          const rolesMenu = new StringSelectMenuBuilder()
-            .setCustomId(`announce:roles:${session.userId}`)
-            .setPlaceholder('🔔 Selecciona roles a mencionar (opcional)')
-            .setMinValues(0)
-            .setMaxValues(notificationRoles.length)
-            .addOptions(
-              notificationRoles.map((role) =>
-                new StringSelectMenuOptionBuilder()
-                  .setLabel(role.label)
-                  .setValue(role.value)
-                  .setDefault(session.announcement.roles?.includes(role.value) || false),
-              ),
-            );
-          rows.push(new ActionRowBuilder<StringSelectMenuBuilder>().addComponents(rolesMenu));
-        }
-
-        // Botones
-        const actionRow = new ActionRowBuilder<ButtonBuilder>().addComponents(
-          new ButtonBuilder()
-            .setCustomId(`announce:edit:${session.userId}`)
-            .setLabel('✏️ Editar Texto')
-            .setStyle(ButtonStyle.Secondary),
-          new ButtonBuilder()
-            .setCustomId(`announce:image:${session.userId}`)
-            .setLabel('🖼️ Imagen')
-            .setStyle(ButtonStyle.Secondary),
-          new ButtonBuilder()
-            .setCustomId(`announce:publish:${session.userId}`)
-            .setLabel('📢 Publicar')
-            .setStyle(ButtonStyle.Success),
-          new ButtonBuilder()
-            .setCustomId(`announce:cancel:${session.userId}`)
-            .setLabel('❌ Cancelar')
-            .setStyle(ButtonStyle.Danger),
-        );
-        rows.push(actionRow);
-
-        // Actualizar el mensaje con embed y componentes
-        await session.previewMessage.edit({ embeds: [embed], components: rows });
-
-        logger.info('Preview updated with image', {
+        // Usar la función auxiliar para construir los componentes
+        const rows = buildAnnouncementComponents(session, cfg);
+
+        logger.info('About to edit preview via editReply', {
+          requestId: session.requestId,
+          embedHasImage: !!session.announcement.image,
+          embedImage: session.announcement.image,
+        });
+
+        // Usar editReply en la interacción original (funciona con efímeros)
+        await session.originalInteraction.editReply({ embeds: [embed], components: rows });
+
+        logger.info('Preview updated successfully with image', {
           requestId: session.requestId,
           hasImage: !!imageUrl,
         });
       } else {
-        logger.warn('No preview message found to update', {
+        logger.warn('No original interaction found to update', {
           requestId: session.requestId,
         });
       }
     } catch (err) {
       logger.error('Failed to update preview after image change', {
         error: err instanceof Error ? err.message : String(err),
+        stack: err instanceof Error ? err.stack : undefined,
         requestId: session.requestId,
       });
     }
@@ -214,94 +234,22 @@ async function showAnnouncementOptions(interaction: any, session: any) {
   const embed = createAnnouncementPreview(session);
   const cfg = getGuildConfig(session.guildId);
 
-  const rows = [];
-
-  // Dropdown de colores
-  const colorMenu = new StringSelectMenuBuilder()
-    .setCustomId(`announce:color:${session.userId}`)
-    .setPlaceholder('🎨 Selecciona un color')
-    .addOptions(
-      PRESET_COLORS.map((color) =>
-        new StringSelectMenuOptionBuilder()
-          .setLabel(color.name)
-          .setValue(color.value)
-          .setDefault(session.announcement.color === color.value),
-      ),
-    );
-  rows.push(new ActionRowBuilder<StringSelectMenuBuilder>().addComponents(colorMenu));
-
-  // Dropdown de roles a mencionar (si existen roles de notificaciones configurados)
-  const notificationRoles = [];
-  const seenRoleIds = new Set<string>();
-
-  // Agregar roles solo si no están duplicados
-  if (cfg?.roles.laLiga && !seenRoleIds.has(cfg.roles.laLiga)) {
-    notificationRoles.push({ label: '⚽ La Liga', value: cfg.roles.laLiga });
-    seenRoleIds.add(cfg.roles.laLiga);
-  }
-  if (cfg?.roles.preParciales && !seenRoleIds.has(cfg.roles.preParciales)) {
-    notificationRoles.push({ label: '📚 Pre-Parciales', value: cfg.roles.preParciales });
-    seenRoleIds.add(cfg.roles.preParciales);
-  }
-  if (cfg?.roles.cursos && !seenRoleIds.has(cfg.roles.cursos)) {
-    notificationRoles.push({ label: '📖 Cursos', value: cfg.roles.cursos });
-    seenRoleIds.add(cfg.roles.cursos);
-  }
-  if (cfg?.roles.notificacionesGenerales && !seenRoleIds.has(cfg.roles.notificacionesGenerales)) {
-    notificationRoles.push({
-      label: '🔔 Notificaciones Generales',
-      value: cfg.roles.notificacionesGenerales,
-    });
-    seenRoleIds.add(cfg.roles.notificacionesGenerales);
-  }
-
-  if (notificationRoles.length > 0) {
-    const rolesMenu = new StringSelectMenuBuilder()
-      .setCustomId(`announce:roles:${session.userId}`)
-      .setPlaceholder('🔔 Selecciona roles a mencionar (opcional)')
-      .setMinValues(0)
-      .setMaxValues(notificationRoles.length)
-      .addOptions(
-        notificationRoles.map((role) =>
-          new StringSelectMenuOptionBuilder()
-            .setLabel(role.label)
-            .setValue(role.value)
-            .setDefault(session.announcement.roles?.includes(role.value) || false),
-        ),
-      );
-    rows.push(new ActionRowBuilder<StringSelectMenuBuilder>().addComponents(rolesMenu));
-  }
+  // Usar la función auxiliar para construir los componentes
+  const rows = buildAnnouncementComponents(session, cfg);
 
-  // Botones de acción
-  const actionRow = new ActionRowBuilder<ButtonBuilder>().addComponents(
-    new ButtonBuilder()
-      .setCustomId(`announce:edit:${session.userId}`)
-      .setLabel('✏️ Editar Texto')
-      .setStyle(ButtonStyle.Secondary),
-    new ButtonBuilder()
-      .setCustomId(`announce:image:${session.userId}`)
-      .setLabel('🖼️ Imagen')
-      .setStyle(ButtonStyle.Secondary),
-    new ButtonBuilder()
-      .setCustomId(`announce:publish:${session.userId}`)
-      .setLabel('📢 Publicar')
-      .setStyle(ButtonStyle.Success),
-    new ButtonBuilder()
-      .setCustomId(`announce:cancel:${session.userId}`)
-      .setLabel('❌ Cancelar')
-      .setStyle(ButtonStyle.Danger),
-  );
-  rows.push(actionRow);
-
-  const reply = await interaction.reply({
+  await interaction.reply({
     embeds: [embed],
     components: rows,
     flags: 1 << 6,
-    fetchReply: true, // Obtener el mensaje para poder editarlo después
   });
 
-  // Guardar el mensaje para poder actualizarlo después
-  session.previewMessage = reply;
+  // Guardar la interacción original para poder usar editReply después
+  session.originalInteraction = interaction;
+
+  logger.info('Preview message created and saved', {
+    requestId: session.requestId,
+    hasInteraction: !!interaction,
+  });
 }
 
 /**

src/commands/announce.ts

@@ -135,7 +135,7 @@ async function execute(interaction: any) {
     guildId,
     requestId,
     channelId: cfg.channels.announcements,
-    previewMessage: undefined, // Se guardará el mensaje del preview para actualizarlo
+    originalInteraction: undefined, // Se guardará la interacción original para usar editReply
     announcement: {
       title: undefined,
       message: undefined,