Fix pb-message boilerplate templates ignored by generic container

src/course-unit/add-component/AddComponent.test.tsx

@@ -745,6 +745,41 @@ describe('<AddComponent />', () => {
     expect(screen.getByRole('button')).not.toBeDisabled();
   });
 
+  it('passes boilerplate name when clicking a generic container block button', async () => {
+    axiosMock
+      .onGet(getCourseSectionVerticalApiUrl(blockId))
+      .reply(200, {
+        ...courseSectionVerticalMock,
+        component_templates: [
+          {
+            type: 'pb-message',
+            display_name: 'Message (complete)',
+            templates: [{
+              display_name: 'Message (complete)',
+              category: 'pb-message',
+              boilerplate_name: 'pb-message-complete',
+            }],
+            support_legend: { show_legend: false },
+          },
+        ],
+      });
+    await executeThunk(fetchCourseSectionVerticalData(blockId), store.dispatch);
+
+    const user = userEvent.setup();
+    renderComponent();
+
+    await user.click(screen.getByRole('button', {
+      name: new RegExp(`${messages.buttonText.defaultMessage} Message \\(complete\\)`, 'i'),
+    }));
+
+    expect(handleCreateNewCourseXBlockMock).toHaveBeenCalledWith({
+      type: 'pb-message',
+      category: 'pb-message',
+      boilerplate: 'pb-message-complete',
+      parentLocator: blockId,
+    });
+  });
+
   describe('component support label', () => {
     it('component support label is hidden if component support legend is disabled', async () => {
       const supportLevels = ['fs', 'ps'];

src/course-unit/add-component/AddComponent.tsx

@@ -231,7 +231,14 @@ const AddComponent = ({
         // Generic handler for container-specific block types declared via
         // StudioContainerWithNestedXBlocksMixin.allowed_nested_blocks that are
         // not one of the MFE's built-in component types (html, video, problem…).
-        handleCreateNewCourseXBlock({ type, category: type, parentLocator: blockId });
+        // Pass boilerplate so that blocks with multiple templates (e.g. pb-message)
+        // get initialised with the correct template content instead of the default.
+        handleCreateNewCourseXBlock({
+          type,
+          category: type,
+          boilerplate: moduleName,
+          parentLocator: blockId,
+        });
     }
   };
 
@@ -283,7 +290,7 @@ const AddComponent = ({
                       return (
                         <li key={type}>
                           <AddComponentButton
-                            onClick={() => handleCreateNewXBlock(type)}
+                            onClick={() => handleCreateNewXBlock(type, firstTemplate?.boilerplateName)}
                             displayName={displayName}
                             type={type}
                             beta={beta}