Add support for description field in display component editor state and rendering

src/commands/messages/alliaces/editDisplayComponent.ts

@@ -81,6 +81,24 @@ const renderPreview = async (blockState: any, member: any, guild: any) => {
     const processedTitle = await replaceVars(blockState.title ?? "Sin título", member, guild);
     previewComponents.push({ type: 10, content: validateContent(processedTitle) });
 
+    const rawDescription = typeof blockState.description === 'string' ? blockState.description.trim() : '';
+    if (rawDescription.length > 0) {
+        // @ts-ignore
+        const processedDescription = await replaceVars(rawDescription, member, guild);
+        const validatedDescription = validateContent(processedDescription);
+        const firstTextComponent = Array.isArray(blockState.components)
+            ? blockState.components.find((c: any) => c?.type === 10 && typeof c.content === 'string')
+            : null;
+        const duplicatesWithFirstText = Boolean(
+            firstTextComponent && typeof firstTextComponent.content === 'string'
+            && firstTextComponent.content.trim() === rawDescription
+        );
+
+        if (!duplicatesWithFirstText) {
+            previewComponents.push({ type: 10, content: validatedDescription });
+        }
+    }
+
     for (const c of blockState.components) {
         if (c.type === 10) {
             // @ts-ignore
@@ -159,6 +177,8 @@ export const command: CommandMessage = {
             //@ts-ignore
             title: existingBlock.config?.title ?? `## Block: ${blockName}`,
             //@ts-ignore
+            description: typeof existingBlock.config?.description === 'string' ? existingBlock.config.description : undefined,
+            //@ts-ignore
             color: existingBlock.config?.color ?? 0x427AE3,
             //@ts-ignore
             coverImage: existingBlock.config?.coverImage ?? null,
@@ -166,6 +186,15 @@ export const command: CommandMessage = {
             components: Array.isArray(existingBlock.config?.components) ? existingBlock.config.components : []
         };
 
+        if (!blockState.description || typeof blockState.description !== 'string' || blockState.description.trim().length === 0) {
+            const firstText = Array.isArray(blockState.components)
+                ? blockState.components.find((c: any) => c?.type === 10 && typeof c.content === 'string')
+                : null;
+            if (firstText) {
+                blockState.description = firstText.content;
+            }
+        }
+
         // @ts-ignore
         const editorMessage = await message.channel.send({
             content: "⚠️ **EDITANDO BLOCK EXISTENTE**\n\n" +
@@ -256,8 +285,11 @@ export const command: CommandMessage = {
                         break;
                     }
                     case "edit_description": {
-                        const descComp = blockState.components.find((c: any) => c.type === 10);
+                        let currentDesc = typeof blockState.description === 'string' ? blockState.description : '';
-                        const currentDesc = descComp ? descComp.content : '';
+                        if (!currentDesc) {
+                            const legacyComp = blockState.components.find((c: any) => c.type === 10 && typeof c.content === 'string');
+                            if (legacyComp) currentDesc = legacyComp.content;
+                        }
                         const modal = {
                             title: '📄 Editar Descripción',
                             customId: 'edit_description_modal',
@@ -798,9 +830,8 @@ export const command: CommandMessage = {
                     blockState.title = interaction.fields.getTextInputValue('title_input');
                     await interaction.reply({ content: '✅ Título actualizado.', flags: 64 });
                 } else if (id === 'edit_description_modal') {
-                    const newDescription = interaction.fields.getTextInputValue('description_input');
+                    const newDescription = interaction.fields.getTextInputValue('description_input').trim();
-                    const firstText = blockState.components.find((c: any) => c.type === 10);
+                    blockState.description = newDescription.length > 0 ? newDescription : undefined;
-                    if (firstText) firstText.content = newDescription; else blockState.components.push({ type: 10, content: newDescription, thumbnail: null });
                     await interaction.reply({ content: '✅ Descripción actualizada.', flags: 64 });
                 } else if (id === 'edit_color_modal') {
                     const colorInput = interaction.fields.getTextInputValue('color_input');

src/core/types/displayComponentEditor.ts

@@ -189,6 +189,29 @@ export class DisplayComponentUtils {
             content: this.validateContent(processedTitle)
         } as any);
 
+        // Optional description section (before additional components)
+        const rawDescription = typeof blockState.description === 'string' ? blockState.description.trim() : '';
+        if (rawDescription.length > 0) {
+            const processedDescription = await replaceVars(rawDescription, member, guild);
+            const validatedDescription = this.validateContent(processedDescription);
+
+            const firstTextComponent = Array.isArray(blockState.components)
+                ? blockState.components.find((c: any) => c?.type === 10 && typeof c.content === 'string')
+                : null;
+            const duplicatesWithFirstText = Boolean(
+                firstTextComponent?.type === 10
+                && typeof (firstTextComponent as EditorTextDisplay).content === 'string'
+                && (firstTextComponent as EditorTextDisplay).content.trim() === rawDescription
+            );
+
+            if (!duplicatesWithFirstText) {
+                previewComponents.push({
+                    type: 10,
+                    content: validatedDescription
+                } as any);
+            }
+        }
+
         // Process components in order
         for (const c of blockState.components) {
             if (c.type === 10) {