[release-4.19] OLS-2892: Use separate menu for the Ask/Troubleshooting mode

[kyoto]

Cherry pick of #1837

Made-with: Cursor

Summary by CodeRabbit

• New Features

  • Redesigned mode switching control with dedicated selector for "Ask" and "Troubleshooting" modes
  • Updated placeholder prompts to reflect current mode context

• Tests

  • Updated test suite to validate new mode selection workflow and persistence

[coderabbitai]

📝 Walkthrough

Walkthrough

The PR updates locale strings and refactors the mode-switching UI component from using a MessageBar label within a dropdown to a dedicated Select control with menu toggle, while updating corresponding tests to use the new selector.

Changes

Cohort / File(s)	Summary
Locale Strings locales/en/plugin__lightspeed-console-plugin.json	Added two prompt-related locale keys ("Ask a question..." and "Describe the issue you're troubleshooting...") and removed two action-related keys ("Remove Troubleshooting mode" and "Send a message...").
Mode Switching UI src/components/Prompt.tsx, tests/tests/lightspeed-install.cy.ts	Replaced dropdown-based mode indicator with a Select + MenuToggle control driven by new local state isModeMenuOpen. Direct Redux dispatch of setIsTroubleshooting on mode selection. Updated test selectors and assertions to verify the new control behavior and mode persistence across UI cycles.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Poem

🐰 A toggle takes shape, no dropdown in sight,
Mode-switching now flows with Select's delight,
Ask or troubleshoot, the choice is so clear,
Tests verified true—refactored with cheer! ✨

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Title check	✅ Passed	The title accurately describes the main change: replacing the mode indicator/label with a separate Select menu for toggling between Ask and Troubleshooting modes.
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests

---

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[openshift-ci]

[APPROVALNOTIFIER] This PR is APPROVED

Approval requirements bypassed by manually added approval.

This pull-request has been approved by:

The full list of commands accepted by this bot can be found here.

The pull request process is described here

Details

Needs approval from an approver in each of these files:

• OWNERS

Approvers can indicate their approval by writing /approve in a comment
Approvers can cancel approval by writing /approve cancel in a comment

[openshift-ci]

[APPROVALNOTIFIER] This PR is APPROVED

Approval requirements bypassed by manually added approval.

This pull-request has been approved by:

The full list of commands accepted by this bot can be found here.

The pull request process is described here

Details

Needs approval from an approver in each of these files:

• OWNERS

Approvers can indicate their approval by writing /approve in a comment
Approvers can cancel approval by writing /approve cancel in a comment

[openshift-ci-robot]

@kyoto: This pull request references OLS-2892 which is a valid jira issue.

Details

In response to this:

Made-with: Cursor

Summary by CodeRabbit

• New Features

• Redesigned mode switching control with dedicated selector for "Ask" and "Troubleshooting" modes

• Updated placeholder prompts to reflect current mode context

• Tests

• Updated test suite to validate new mode selection workflow and persistence

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the openshift-eng/jira-lifecycle-plugin repository.

[coderabbitai]

🧹 Nitpick comments (1)

tests/tests/lightspeed-install.cy.ts (1)

370-383: Consider asserting placeholder text when mode changes.

This test already validates persistence well; adding placeholder assertions would directly cover the new Ask/Troubleshooting prompt copy behavior too.

✅ Suggested test augmentation

       cy.get(modeToggle).should('include.text', 'Ask');
+      cy.get(promptInput).should('have.attr', 'placeholder', 'Ask a question...');
       cy.get(modeToggle).click();
       cy.contains('[role="option"]', 'Troubleshooting').click();
       cy.get(modeToggle).should('include.text', 'Troubleshooting');
+      cy
+        .get(promptInput)
+        .should('have.attr', 'placeholder', "Describe the issue you're troubleshooting...");
@@
       cy.get(modeToggle).click();
       cy.contains('[role="option"]', 'Ask').click();
       cy.get(modeToggle).should('include.text', 'Ask');
+      cy.get(promptInput).should('have.attr', 'placeholder', 'Ask a question...');

Also applies to: 389-389

🤖 Prompt for AI Agents

Verify each finding against the current code and only fix it if needed.

In `@tests/tests/lightspeed-install.cy.ts` around lines 370 - 383, After each mode
switch using the modeToggle (when you click and select 'Troubleshooting' or
'Ask'), assert that the chat input's placeholder text updates to the expected
prompt copy for that mode; specifically, after selecting 'Troubleshooting'
assert the input placeholder equals the troubleshooting prompt and after
switching back to 'Ask' assert the input placeholder equals the ask prompt. Use
the existing modeToggle click/selection flow and add
cy.get('<chatInputSelector>').should('have.attr', 'placeholder').and('include',
'<expectedPlaceholderText>') (replace <chatInputSelector> with your chat input
selector and <expectedPlaceholderText> with the exact Ask/Troubleshooting copy)
adjacent to the existing cy.get(modeToggle).should(...) checks so the
placeholder behavior is validated alongside the visible mode label.

🤖 Prompt for all review comments with AI agents

Verify each finding against the current code and only fix it if needed.

Nitpick comments:
In `@tests/tests/lightspeed-install.cy.ts`:
- Around line 370-383: After each mode switch using the modeToggle (when you
click and select 'Troubleshooting' or 'Ask'), assert that the chat input's
placeholder text updates to the expected prompt copy for that mode;
specifically, after selecting 'Troubleshooting' assert the input placeholder
equals the troubleshooting prompt and after switching back to 'Ask' assert the
input placeholder equals the ask prompt. Use the existing modeToggle
click/selection flow and add cy.get('<chatInputSelector>').should('have.attr',
'placeholder').and('include', '<expectedPlaceholderText>') (replace
<chatInputSelector> with your chat input selector and <expectedPlaceholderText>
with the exact Ask/Troubleshooting copy) adjacent to the existing
cy.get(modeToggle).should(...) checks so the placeholder behavior is validated
alongside the visible mode label.

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Enterprise

Run ID: f65ed98a-bc6b-4907-9bb2-62efb72b7fe5

📥 Commits

Reviewing files that changed from the base of the PR and between 9abbc4f and 7fd8f37.

📒 Files selected for processing (3)

• locales/en/plugin__lightspeed-console-plugin.json
• src/components/Prompt.tsx
• tests/tests/lightspeed-install.cy.ts