fix: Debugger tab is not selected by default when open using shortkeys

[albinAppsmith]

Description

When debugger is opened via short key, the default tab is not selected. This PR fixes this behaviour.

Fixes #31988

Automation

/ok-to-test tags="@tag.IDE, @tag.Debugger"

🔍 Cypress test results

Important

Workflow run: https://github.com/appsmithorg/appsmith/actions/runs/8374340841
Commit: 8e65a3f678d6a682346c798b4f4bf61477d4a366
Cypress dashboard url: Click here!
All cypress tests have passed 🎉🎉🎉

Summary by CodeRabbit

• New Features
  • Enhanced the debugger functionality within the app, including the ability to toggle debugger states and set the selected debugger tab more intuitively.
• Refactor
  • Updated key functions and mappings related to debugger actions for improved performance and user experience.

[coderabbitai]

Walkthrough

The update to GlobalHotKeys.tsx focuses on enhancing the debugger's functionality by replacing the showDebugger function with toggleDebugger for toggling the debugger's state and setting the selected tab if it's not already set. It introduces better state management and tab selection within the debugger, aligning with the need to improve the user experience when interacting with the debugger through hotkeys.

Changes

File Path	Change Summary
app/client/src/pages/Editor/GlobalHotKeys/GlobalHotKeys.tsx	Updated functionality to replace showDebugger with toggleDebugger; added new functions and props mapping related to debugger state and tab selection.
app/client/src/pages/Editor/GlobalHotKeys/GlobalHotKeys.test.tsx	Added a toggleDebugger prop to components for hotkey functionalities.
app/client/src/pages/Editor/GlobalHotKeys/index.tsx	Added toggleDebugger functionality to GlobalHotKeys component.
app/client/src/actions/debuggerActions.ts app/client/src/selectors/debuggerSelectors.ts app/client/src/components/editorComponents/Debugger/helpers.ts	Introduces changes related to debugger actions and selectors for improved functionality.

Assessment against linked issues

Objective	Addressed	Explanation
Debugger default tab not selected when opening via shortkey (#31988)	✅

Related issues

• [Bug]: Unable to Edit Non-Default Tabs Widget When "Show tabs" Is false #30723: The changes might indirectly address the issue of redirection to the default tab when the "Show tabs" property is set to false by improving debugger tab management. The focus on debugger state management and tab selection could potentially influence similar functionalities across the platform.
• [Bug]: Clicking on any child widgets on tabs causes control to switch to default/first tab #25622: Although primarily focused on debugger improvements, the enhanced tab selection and state management could be relevant to resolving issues related to unintended tab switching, depending on how these components interact within the broader application context.

Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media?

Share

• X
• Mastodon
• Reddit
• LinkedIn

---

Tips

Chat

There are 3 ways to chat with CodeRabbit:

• Review comments: Directly reply to a review comment made by CodeRabbit. Example:
  • I pushed a fix in commit <commit_id>.
  • Generate unit-tests for this file.
  • Open a follow-up GitHub issue for this discussion.
• Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query. Examples:
  • @coderabbitai generate unit tests for this file.
  • @coderabbitai modularize this function.
• PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
  • @coderabbitai generate interesting stats about this repository and render them as a table.
  • @coderabbitai show all the console.log statements in this repository.
  • @coderabbitai read src/utils.ts and generate unit tests.
  • @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.

Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments.

CodeRabbit Commands (invoked as PR comments)

• @coderabbitai pause to pause the reviews on a PR.
• @coderabbitai resume to resume the paused reviews.
• @coderabbitai review to trigger a review. This is useful when automatic reviews are disabled for the repository.
• @coderabbitai resolve resolve all the CodeRabbit review comments.
• @coderabbitai help to get help.

Additionally, you can add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.

CodeRabbit Configration File (.coderabbit.yaml)

• You can programmatically configure CodeRabbit by adding a .coderabbit.yaml file to the root of your repository.
• The JSON schema for the configuration file is available here.
• If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/coderabbit-overrides.v2.json

CodeRabbit Discord Community

Join our Discord Community to get help, request features, and share feedback.

[coderabbitai]

The addition of the toggleDebugger prop with an empty function in test scenarios is correctly implemented. Consider adding specific tests to verify the new toggleDebugger functionality's behavior and integration within the application.

Would you like me to help draft some test cases for the toggleDebugger functionality?