fix: [Obs Alerts > Rules][KEYBOARD]: Inspect Alerts Table button should always be visible and must be visible on keyboard focus

[alexwizp]

Closes: https://github.com/elastic/observability-dev/issues/3361

Description

The Obs Alerts have a button for opening an Inspect Alerts table modal that is only visible on :hover. This button is easily missed by keyboard navigation because it is not visible on :focus. My recommendation is the button should always be visible and must be visible when it receives focus. Screenshot attached below.

Steps to recreate

1. Open the Obs Alerts table
2. Create an alert that's sure to fire, like a custom threshold that's very low, like 100 or 1000 documents
3. Run the alert rule from the Rules view
4. When the alert appears in Alerts, tab through to the data grid
5. Watch closely for focus to "disappear"
6. Press Tab again and focus should reappear
7. Now press Shift + Tab to make focus disappear again
8. Press Enter and verify the modal opens

What was done?:

1. &:focus-visible styles were added to correctly handle keyboard navigation

Screen:

Screen.Recording.2024-05-15.at.16.33.54.mov

[alexwizp]

/ci

[alexwizp]

/ci

[kibana-ci]

💚 Build Succeeded

• Buildkite Build
• Commit: 89f7c67

Metrics [docs]

Async chunks

Total size of all lazy-loaded chunks that will be downloaded as the user navigates the app

id	before	after	diff
triggersActionsUi	1.6MB	1.6MB	+94.0B

History

• 💔 Build #210164 failed 68a9ecf

To update your PR or re-run it, just comment with:
@elasticmachine merge upstream

[elasticmachine]

Pinging @elastic/kibana-accessibility (Project:Accessibility)

[elasticmachine]

Pinging @elastic/unified-observability (Team:Observability)

[elasticmachine]

Pinging @elastic/response-ops (Team:ResponseOps)