Prompt suggestions "+X more" expansion does not display additional suggestions

[rezamirsadeghi96]

There appears to be an issue with the expansion behavior of the Prompt Suggestions section in Sitebuilder.

Observed behavior

• When a project has more than 3 prompt suggestions, a "+X more" button appears.
• When the user clicks on "+X more", the additional prompts are not displayed.
• The UI does not expand to show the remaining suggestions.

Expected behavior

• When clicking on "+X more", all additional prompt suggestions should become visible.
• The button should toggle properly (e.g., change to "Show less" if applicable).
• The expansion should work consistently for any number of suggestions above 3.

Why this matters

• Users cannot access all available prompt suggestions.
• This limits usability and discoverability of predefined prompts.
• It creates confusion, as the UI indicates more suggestions exist but does not reveal them.

Environment

• Feature: Prompt Suggestions (Sitebuilder)
• Scenario: Projects with more than 3 suggestions

[JOORVIS]

ProductBuilder Planning Agent — Implementation Plan

I’ll map where the Prompt Suggestions +X more logic lives in the Sitebuilder UI, then I’ll produce a concrete implementation plan with likely root-cause checks, code touchpoints, and validation steps.I found the likely implementation and tests under ChatBasedContentEditor (including a dedicated prompt_suggestions_controller.ts). I’ll quickly inspect those files to anchor the plan to the actual behavior and test gaps.I’ve confirmed there is dedicated expand/collapse code plus unit tests, which suggests the bug is likely in integration wiring (DOM targets/actions or a conflicting controller lifecycle) rather than pure logic. I’ll inspect where this partial is mounted in Sitebuilder to make the plan precise.I traced where the partial is rendered and didn’t find an obvious template mismatch; next I’m checking Stimulus registration and controller bootstrap to include a likely root cause and a tighter plan instead of a generic one.Applying rules: 00-rule-acknowledgment.mdc, 07-workflow.mdc, 02-code-standards.mdc

Implementation Plan

1. Reproduce and isolate the failure in Sitebuilder

• Reproduce with a project that has >3 prompt suggestions.
• Verify whether click->prompt-suggestions#expand fires and whether rows lose the hidden class.
• Confirm if failure is in event wiring, DOM selection, or visibility/layout (e.g., rows unhidden but clipped by container behavior).

2. Add a failing frontend test that matches real user interaction

• Extend tests/frontend/unit/ChatBasedContentEditor/prompt_suggestions_controller.test.ts with an interaction-focused test that clicks the +X more control (not just calling expand() directly).
• Assert:
  • hidden rows become visible,
  • expand button hides,
  • collapse button (Show less) appears,
  • collapse restores first 3 visible rows.
• Add a coverage case for larger lists (e.g., 8+ suggestions) to ensure scaling behavior.

3. Harden expand/collapse implementation in controller

• Refactor prompt_suggestions_controller.ts to avoid brittle row lookup via closest("[data-index]").
• Introduce explicit row targets (e.g., suggestionRow) in _prompt_suggestions.twig and use them directly for show/hide.
• Add a small internal expanded/collapsed state flag so button visibility and list visibility are always synchronized from one source of truth.

4. Normalize initial and refreshed states

• Ensure connect() initializes visibility based on maxVisible and suggestion count (instead of relying only on server-side initial hidden classes).
• Keep refreshSuggestionsList() aligned with the same toggle logic so add/edit/delete never desync the expansion controls.

5. UX/accessibility polish for toggle behavior

• Keep labels deterministic (+X more ↔ Show less) and update every time the list changes.
• Add aria-expanded and aria-controls semantics on the toggle button(s) for consistent accessibility and easier test assertions.

6. Validation

• Run frontend tests via mise run tests:frontend.
• Run focused quality/build checks for the changed frontend assets (mise run quality, and if needed mise run frontend).
• Manual smoke test in Sitebuilder:
  • 0–3 suggestions: no expand controls,
  • 4 suggestions: expand/collapse works,
  • 8+ suggestions: all extra rows reveal and collapse reliably after repeated toggles.

Definition of Done

• +X more reliably reveals all additional prompt suggestions.
• Toggle transitions correctly between expanded and collapsed states.
• Behavior remains correct after add/edit/delete operations.
• New/updated tests cover click-driven expansion behavior and pass consistently.

---

Review this plan. Add comments to refine it, or add the prdb:plan-approved label to start implementation.