diff --git a/docs/guides/int_framework/intro.md b/docs/guides/int_framework/intro.md
index 23be5b544..5d3253a6f 100644
--- a/docs/guides/int_framework/intro.md
+++ b/docs/guides/int_framework/intro.md
@@ -291,6 +291,11 @@ By nesting commands inside a module that is tagged with [GroupAttribute] you can
 > Although creating nested module stuctures are allowed,
 > you are not permitted to use more than 2 [GroupAttribute]'s in module hierarchy.
 
+> [!NOTE]
+> To not use the command group's name as a prefix for component or modal interaction's custom id set `ignoreGroupNames` parameter to `true` in classes with [GroupAttribute]
+>
+> However, you have to be careful to prevent overlapping ids of buttons and modals
+
 [!code-csharp[Command Group Example](samples/intro/groupmodule.cs)]
 
 ## Executing Commands
diff --git a/docs/guides/int_framework/samples/intro/groupmodule.cs b/docs/guides/int_framework/samples/intro/groupmodule.cs
index f0d992aff..a07b2e4d8 100644
--- a/docs/guides/int_framework/samples/intro/groupmodule.cs
+++ b/docs/guides/int_framework/samples/intro/groupmodule.cs
@@ -16,6 +16,11 @@ public class CommandGroupModule : InteractionModuleBase<SocketInteractionContext
         // group-name subcommand-group-name echo
         [SlashCommand("echo", "Echo an input")]
         public async Task EchoSubcommand(string input)
-            => await RespondAsync(input);
+            => await RespondAsync(input, components: new ComponentBuilder().WithButton("Echo", $"echoButton_{input}").Build());
+
+        // Component interaction with ignoreGroupNames set to true
+        [ComponentInteraction("echoButton_*", true)]
+        public async Task EchoButton(string input)
+            => await RespondAsync(input);  
     }
 }
\ No newline at end of file