[RAC] Improve display of "external incident" information

[hbharding]

related design issue: https://github.com/elastic/stack-design-team/issues/92

Summary

There are a few places where we show links to external incidents that we'd like to improve. This will help prevent awkward line breaks in tables and make the information a little less distracting. We show this information in the following places:

• The Cases list page, in the "external incident" column.
• The modal when selecting a case to add an alert to.

Once https://github.com/elastic/kibana/issues/115808 is completed, we will also show this information in:

• The Alerts list page, in a new "external incident" column
• In the Alert details flyout, as a key/value pair.

Solution

We can improve the design by doing the following:

• Remove the Connector's icon. It's not necessary. Use a tooltip instead to indicate where this link goes.
• We don't need to display text "is up to date" or "requires update". Instead, if an incident is out of sync, we can display a yellow alert icon which opens a tooltip / popover explaining that the "case has changes that have not been pushed". If the incident is up to date, we don't need to show anything.
• Better yet, we could allow users to push changes to the external incident without having to navigate to the case. We could provide this action inline inside a popover. If for some reason this is not possible, we can just use a tooltip instead.

Tasks

• [ ] Implement the solution described above. This should likely be a reusable component.
• [ ] Update the places described in the summary to use this new solution.
• [ ] Make sure these changes are also done for Security solution.

[elasticmachine]

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

[elasticmachine]

Pinging @elastic/response-ops-cases (Feature:Cases)