feat(FR-2183): add set as main and deactivate actions for active tab

[agatha197]

Resolves #6095(FR-2183)

Summary

• Add action column to the Active tab table with "Set as Main" and "Deactivate" actions
• "Set as Main" uses switchMyMainAccessKey mutation with Popconfirm confirmation (hidden for current main keypair)
• "Deactivate" uses updateMyKeypair mutation with Popconfirm confirmation (disabled with tooltip for main keypair)
• Use useTransition for flicker-free refetch after mutations, with subtle opacity reduction during pending state
• Add 7 new i18n keys for action labels, confirmations, and success messages

[agatha197]

Warning

This pull request is not mergeable via GitHub because a downstack PR is open. Once all requirements are satisfied, merge this PR as a stack on Graphite.
Learn more

• feat(FR-2183): add set as main and deactivate actions for active tab #6103 : 2 dependent PRs (#6106 , #6108 ) 👈 (View in Graphite)
• feat(FR-2183): add issue new keypair mutation and credential result modal #6102
• feat(FR-2183): create MyKeypairManagementModal with myKeypairs query, tabs, and table #6100
• feat(FR-2183): rename MyKeypairInfoModal to legacy and add @since branching #6099
• feat(FR-2183): add keypair self-service management feature spec #6019
• main

---

How to use the Graphite Merge Queue

Add either label to this PR to merge it via the merge queue:

• flow:merge-queue - adds this PR to the back of the merge queue
• flow:hotfix - for urgent changes, fast-track this PR to the front of the merge queue

You must have a Graphite account in order to use the merge queue. Sign up using this link.

An organization admin has required the Graphite Merge Queue in this repository.

Please do not merge from GitHub as this will restart CI on PRs being processed by the merge queue.

This stack of pull requests is managed by Graphite. Learn more about stacking.

[github-actions]

Coverage report for ./react

St.❔	Category	Percentage	Covered / Total
🔴	Statements	8.75% (-0.02% 🔻)	1543/17634
🔴	Branches	7.56% (-0.01% 🔻)	930/12306
🔴	Functions	5.65% (-0.02% 🔻)	278/4919
🔴	Lines	8.42% (-0.02% 🔻)	1446/17165

Test suite run success

784 tests passing in 37 suites.

Report generated by 🧪jest coverage report action from 48bde00

[Copilot]

Pull request overview

Adds per-row actions to the My Keypair Management modal’s Active tab so users can switch their main access key or deactivate a keypair, with confirmation prompts and refetch UX smoothing.

Changes:

• Add “Set as Main” and “Deactivate” action buttons (with Popconfirm/Tooltip) to the Active tab table.
• Introduce Relay mutations for switching main key and deactivating keypairs, and refetch via useTransition with a pending-state opacity change.
• Add new i18n strings for action labels, confirmations, and success messages (English only in this PR).

Reviewed changes

Copilot reviewed 2 out of 2 changed files in this pull request and generated 7 comments.

File	Description
react/src/components/MyKeypairManagementModal.tsx	Adds action column + mutations + transition-based refetch styling for main-switch/deactivate flows.
resources/i18n/en.json	Adds new English i18n keys used by the new action UI (labels/confirmations/toasts).

[ironAiken2]

How about displaying the "default access key" for table columns differently? Instead of text, it might be better to show the main access key icon for the control button.

The button in the "control" column should not be hidden based on conditions; instead, it should remain visible but be disabled.

[Copilot]

Pull request overview

Copilot reviewed 23 out of 23 changed files in this pull request and generated 1 comment.

Comments suppressed due to low confidence (1)

react/src/components/MyKeypairManagementModal.tsx:51

• The PR description mentions using useTransition (and a pending-state opacity treatment) for flicker-free refetching after mutations, but this component currently only uses useDeferredValue and calls updateFetchKey() directly. Either update the PR description to match the implementation, or wrap the refetch-triggering state updates in a transition (and apply the pending UI state) if that behavior is still intended.

import { useDeferredValue, useState } from 'react';
import { useTranslation } from 'react-i18next';
import { graphql, useLazyLoadQuery, useMutation } from 'react-relay';