Revert "fix: tab: added a prop to enable standard key navigation for tabs component"

[mbhagat-c-eightfold]

Reverts #953

[codesandbox-ci]

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 84.46%. Comparing base (7693ca2) to head (4be65b3).
⚠️ Report is 1 commits behind head on main.

Additional details and impacted files

@@            Coverage Diff             @@
##             main    #1026      +/-   ##
==========================================
- Coverage   84.52%   84.46%   -0.07%     
==========================================
  Files        1104     1104              
  Lines       20837    20692     -145     
  Branches     7900     7841      -59     
==========================================
- Hits        17612    17477     -135     
+ Misses       3137     3127      -10     
  Partials       88       88              

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[factory-droid]

PR Description:
This PR reverts keyboard navigation functionality from the tabs component by removing the enableArrowNav prop and associated features. The reversion removes arrow key navigation, Home/End key support, and tab focus management functionality from Tab.tsx, Tabs.context.tsx, and Tabs.types.ts. All related keyboard navigation tests and aria attributes were also removed as part of this change. ¹

Click For Summary of Files

Summary of Files

Files Modified

src/components/Tabs/Tabs/index.tsx

Remove keyboard navigation functionality from Tabs component:

- Removed enableArrowNav and disabledTabIndexes props from Tabs component interface
- Removed prop forwarding to internal tab components

src/components/Tabs/Tab/Tab.tsx

Simplified Tab component by removing keyboard navigation functionality:

- Removed tab registration and keyboard event handling logic
- Simplified button attributes and ref handling
- Removed tab index management and focus control features

src/components/Tabs/Tabs.test.tsx

Removed keyboard navigation functionality tests from Tabs component:

- Removed tests for arrow key navigation, Home/End key support, and focus management
- Removed stateful test cases for keyboard interaction and disabled tab handling
- Preserved core tab functionality tests including tab switching, styling and badge content verification

src/components/Tabs/Tabs/AnimatedTabs.tsx

Simplified AnimatedTabs component by removing keyboard navigation functionality:

- Removed tablist registration and management functionality
- Simplified ref handling by removing merged refs implementation
- Removed child element index tracking and transformation
- Removed tabIndex attribute from tablist element

src/components/Dialog/BaseDialog/BaseDialog.tsx

Standardized quote style in BaseDialog component:

- Updated ARIA attribute syntax from single to double quotes for role and aria-level properties
- Removed trailing comma in header attributes spread operator

src/components/Tabs/__snapshots__/Tabs.test.tsx.snap

Removed keyboard navigation functionality from Tabs component snapshots:

- Removed keyboard interaction attributes (tabIndex, onKeyDown handlers)
- Removed navigation-related data attributes (data-index, data-value, index)
- Preserved core accessibility roles and aria attributes for basic tab functionality

src/components/Tabs/Tabs.stories.tsx

Remove keyboard navigation functionality from Tabs component stories:

- Removed tab identification and tracking features:
  - Removed 'id' property from all tab configurations
  - Removed disabled tab indexes tracking
- Removed enableArrowNav configuration from default story arguments

src/components/Dialog/Dialog.tsx

Standardized prop default value formatting in Dialog component:

- Removed spaces around equals sign in headingLevel prop default assignment

src/components/Tabs/Tabs.types.ts

Remove keyboard navigation functionality from Tabs component types:

- Removed keyboard navigation props and types from TabsContextProps and ITabsContext interfaces including enableArrowNav, disabledTabIndexes, and focus management functions
- Removed accessibility and navigation-related props from TabProps including ariaControls and internal index tracking
- Removed navigation control props from TabsProps interface

src/components/Tabs/Tabs.context.tsx

Removed keyboard navigation functionality from Tabs component:

- Simplified TabsProvider by removing keyboard navigation state and handlers
- Removed tab registration system and refs management
- Streamlined tab selection to only handle click events
- Removed accessibility-related context values and disabled state handling

Tips

Review Droid is highly customizable and comes with powerful features for augmenting your organization's code review process. Here are some tips to get the most out of it.

Table of contents

• Droid Fill - Contextual PR Body Replacement
• Review Guidelines - Creating guidelines for Droid to enforce
• Droid Chat - Follow up with Droid's Comments
• PR Healing - Diagnose & Fix Failures in CI
• Teaching Droid - Giving Droid feedback so it learns
• Review Usage
  • Re-Requesting Review
  • Ignoring Reviews
  • .droid.yaml to Configure Review Droid

⌨️ Droid Fill

Contextual PR Body Replacement

When you create a PR with the @droid fill command anywhere in your PR body, Review Droid will fill in the PR description for your pull request based on it's PR analysis. This will also take into account your pull request templates.

Review Droid can also analyze your project management system. If you have a project management system integrated with Factory (e.g. Linear, Jira) Review Droid will also integrate information from linked and related tickets.

At Factory, we typically create our PR's with this command. For example, let's say I'm creating a PR which addresses the jira ticket FAC-123. I would write the following PR description:

@droid fill FAC-123

and your Review Droid fills in the rest!

📚 Review Guidelines

Creating guidelines for Droid to follow

You can configure guidelines that Droid will follow when reviewing your PRs. Droid will focus on these aspects of your code and aim to leave in-line comments if any guidelines are violated.

Guidelines are defined in your repository's .droid.yaml. Every week, Droid will automatically refine and edit these guidelines based on the feedback you leave on Droid's comments.

💬 Droid Chat

Ask questions on a PR

You can leave in-line comments on PR's by tagging @droid in-line. This can be helpful when reviewing other's PRs. Some examples include:

• @droid this section looks sketchy, are there issues with it?
• @droid can you show me some examples of what this regex matches?
• @droid is this the most efficient way to do this? I'm concerned about performance.

Follow up with Review Droid's Comments

You can reply to Review Droid's in-line review comments directly to ask questions or provide feedback. Some examples include:

• @droid I made the change you suggested, does that fix the issue?
• @droid we don't actually need to do this because of X, Y, Z. Can you confirm?
• @droid do we have any scripts that rely on this behavior?

🛠️ PR Healing

Diagnose & Fix Failures in CI

Review Droid is aware of the CI processes you utilize and proposes fixes in case of any failures. This allows it to promptly address issues in your pull requests before they escalate.

By default, PR Healing is activated. Your organization does not have advanced PR healing enabled, which involved Review Droid directly making a PR to your PR which fixes the issue. If you would like to enable this feature, you must have an Enterprise Plan.

🎓 Teaching Droid

Giving Droid feedback so it learns

You can give feedback to Review Droid by replying or reacting to its comments (👍 / 👎). This helps Review Droid learn from your preferences and improve its future reviews.

To send feedback directly to the Factory team, include @droid feedback in your comment. Droid will file a ticket with your feedback and provide a ticket ID so you can track it with our support team.

🔎 Review Usage

Re-Requesting Review

If you make changes to your PR and want Review Droid to re-review it, you can simply comment @droid review on the PR. This will trigger Droid to re-review the PR and update the review body.

.droid.yaml to Configure Review Droid

You can place a .droid.yaml file in the root of your repository. This file contains settings for a variety of features and settings including:

• Guidelines - For defining the rules that Review Droid will enforce
• Enabling/Disabling Per-file Summaries
• Enabling/Disabling PR Healing
• Path Filters (For ignoring certain files or directories)
• Auto-Review Settings
• Chat settings

To override a setting leave a comment on a PR with the setting to disable/enable/reset. For example @droid setting disable progress_comment. The current options are: progress_comment, lgtm_comment, and list.

list is a special setting that will list all the settings that you have set and will explain what each setting does.

For more information, you can view our documentation at https://docs.factory.ai - the password is factory.

Ignoring Reviews

If you want to have your PR ignored by Review Droid you can define Droid Ignored Title Words in your .droid.yaml file. If the title of your PR contains any of these words, Review Droid will ignore the PR.

Your organization currently has the following words in the Droid Ignored Title Words list:
None

Footnotes

1. React 👍 / 👎 to comments you like / dislike. Droid will learn from this feedback to leave better reviews. My in-line comments are based on your review guidelines. If you have any questions about the comments, reply to them with @droid ↩