Skip to content

Commit

Permalink
[8.14] [ResponseOps][Connectors] Fix bug with deprecated icon in the …
Browse files Browse the repository at this point in the history 
…connectors table (#184342) (#184392)

# Backport

This will backport the following commits from `main` to `8.14`:
- [[ResponseOps][Connectors] Fix bug with deprecated icon in the
connectors table
(#184342)](#184342)

<!--- Backport version: 9.4.3 -->

### Questions ?
Please refer to the [Backport tool
documentation](https://github.com/sqren/backport)

<!--BACKPORT [{"author":{"name":"Christos
Nasikas","email":"[email protected]"},"sourceCommit":{"committedDate":"2024-05-29T07:52:37Z","message":"[ResponseOps][Connectors]
Fix bug with deprecated icon in the connectors table (#184342)\n\n##
Summary\r\n\r\nIf the connector's table shows a deprecated connector it
crashes. This\r\nPR fixes this issue by removing any usage of the
deprecated access to\r\nthe EUI theme variables.\r\n\r\n##
Screenshots\r\n\r\n<img width=\"541\" alt=\"Screenshot 2024-05-28 at 1
34
48 PM\"\r\nsrc=\"https://github.com/elastic/kibana/assets/7871006/a2aad5e3-c49c-476a-b7bf-37ec57ed03b9\">\r\n\r\n<img
width=\"456\" alt=\"Screenshot 2024-05-28 at 1 33
13 PM\"\r\nsrc=\"https://github.com/elastic/kibana/assets/7871006/b2953215-1744-481b-8fbf-70a5df26fc30\">\r\n\r\n<img
width=\"743\" alt=\"Screenshot 2024-05-28 at 1 34
11 PM\"\r\nsrc=\"https://github.com/elastic/kibana/assets/7871006/66b1e86f-f618-4a68-bdc0-7c6e1727a4b7\">\r\n\r\n\r\n##
Testing\r\n\r\n1. Create a deprecated SN connector.\r\n2. Verify that
the page that list all connectors (Stack Management ->\r\nConnectors)
does not crash\r\n\r\nYou can create a deprecated SN connector
like:\r\n\r\n```\r\ncurl --location
'https://localhost:5601/api/actions/connector' \\\r\n--header 'kbn-xsrf:
true' \\\r\n--header 'Content-Type: application/json' \\\r\n--header
'Authorization: Basic <basic auth token>' \\\r\n--data-raw '{\r\n
\"name\": \"SN\",\r\n \"connector_type_id\": \".servicenow\",\r\n
\"config\": {\r\n \"apiUrl\":
\"https://<whatever>.service-now.com/\",\r\n \"usesTableApi\": true <--
This makes the connector deprecated\r\n },\r\n \"secrets\": {\r\n
\"username\": \"admin\",\r\n \"password\": \"<whatever>\"\r\n
}\r\n}'\r\n```\r\n\r\n### For maintainers\r\n\r\n- [x] This was checked
for breaking API changes and was
[labeled\r\nappropriately](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)","sha":"a365891c6847c0fef80d909666f1ce5cbf0986b3","branchLabelMapping":{"^v8.15.0$":"main","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["bug","release_note:skip","Team:ResponseOps","Feature:Actions/ConnectorsManagement","v8.14.0","v8.15.0"],"title":"[ResponseOps][Connectors]
Fix bug with deprecated icon in the connectors
table","number":184342,"url":"https://github.com/elastic/kibana/pull/184342","mergeCommit":{"message":"[ResponseOps][Connectors]
Fix bug with deprecated icon in the connectors table (#184342)\n\n##
Summary\r\n\r\nIf the connector's table shows a deprecated connector it
crashes. This\r\nPR fixes this issue by removing any usage of the
deprecated access to\r\nthe EUI theme variables.\r\n\r\n##
Screenshots\r\n\r\n<img width=\"541\" alt=\"Screenshot 2024-05-28 at 1
34
48 PM\"\r\nsrc=\"https://github.com/elastic/kibana/assets/7871006/a2aad5e3-c49c-476a-b7bf-37ec57ed03b9\">\r\n\r\n<img
width=\"456\" alt=\"Screenshot 2024-05-28 at 1 33
13 PM\"\r\nsrc=\"https://github.com/elastic/kibana/assets/7871006/b2953215-1744-481b-8fbf-70a5df26fc30\">\r\n\r\n<img
width=\"743\" alt=\"Screenshot 2024-05-28 at 1 34
11 PM\"\r\nsrc=\"https://github.com/elastic/kibana/assets/7871006/66b1e86f-f618-4a68-bdc0-7c6e1727a4b7\">\r\n\r\n\r\n##
Testing\r\n\r\n1. Create a deprecated SN connector.\r\n2. Verify that
the page that list all connectors (Stack Management ->\r\nConnectors)
does not crash\r\n\r\nYou can create a deprecated SN connector
like:\r\n\r\n```\r\ncurl --location
'https://localhost:5601/api/actions/connector' \\\r\n--header 'kbn-xsrf:
true' \\\r\n--header 'Content-Type: application/json' \\\r\n--header
'Authorization: Basic <basic auth token>' \\\r\n--data-raw '{\r\n
\"name\": \"SN\",\r\n \"connector_type_id\": \".servicenow\",\r\n
\"config\": {\r\n \"apiUrl\":
\"https://<whatever>.service-now.com/\",\r\n \"usesTableApi\": true <--
This makes the connector deprecated\r\n },\r\n \"secrets\": {\r\n
\"username\": \"admin\",\r\n \"password\": \"<whatever>\"\r\n
}\r\n}'\r\n```\r\n\r\n### For maintainers\r\n\r\n- [x] This was checked
for breaking API changes and was
[labeled\r\nappropriately](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)","sha":"a365891c6847c0fef80d909666f1ce5cbf0986b3"}},"sourceBranch":"main","suggestedTargetBranches":["8.14"],"targetPullRequestStates":[{"branch":"8.14","label":"v8.14.0","branchLabelMappingKey":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"},{"branch":"main","label":"v8.15.0","branchLabelMappingKey":"^v8.15.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/184342","number":184342,"mergeCommit":{"message":"[ResponseOps][Connectors]
Fix bug with deprecated icon in the connectors table (#184342)\n\n##
Summary\r\n\r\nIf the connector's table shows a deprecated connector it
crashes. This\r\nPR fixes this issue by removing any usage of the
deprecated access to\r\nthe EUI theme variables.\r\n\r\n##
Screenshots\r\n\r\n<img width=\"541\" alt=\"Screenshot 2024-05-28 at 1
34
48 PM\"\r\nsrc=\"https://github.com/elastic/kibana/assets/7871006/a2aad5e3-c49c-476a-b7bf-37ec57ed03b9\">\r\n\r\n<img
width=\"456\" alt=\"Screenshot 2024-05-28 at 1 33
13 PM\"\r\nsrc=\"https://github.com/elastic/kibana/assets/7871006/b2953215-1744-481b-8fbf-70a5df26fc30\">\r\n\r\n<img
width=\"743\" alt=\"Screenshot 2024-05-28 at 1 34
11 PM\"\r\nsrc=\"https://github.com/elastic/kibana/assets/7871006/66b1e86f-f618-4a68-bdc0-7c6e1727a4b7\">\r\n\r\n\r\n##
Testing\r\n\r\n1. Create a deprecated SN connector.\r\n2. Verify that
the page that list all connectors (Stack Management ->\r\nConnectors)
does not crash\r\n\r\nYou can create a deprecated SN connector
like:\r\n\r\n```\r\ncurl --location
'https://localhost:5601/api/actions/connector' \\\r\n--header 'kbn-xsrf:
true' \\\r\n--header 'Content-Type: application/json' \\\r\n--header
'Authorization: Basic <basic auth token>' \\\r\n--data-raw '{\r\n
\"name\": \"SN\",\r\n \"connector_type_id\": \".servicenow\",\r\n
\"config\": {\r\n \"apiUrl\":
\"https://<whatever>.service-now.com/\",\r\n \"usesTableApi\": true <--
This makes the connector deprecated\r\n },\r\n \"secrets\": {\r\n
\"username\": \"admin\",\r\n \"password\": \"<whatever>\"\r\n
}\r\n}'\r\n```\r\n\r\n### For maintainers\r\n\r\n- [x] This was checked
for breaking API changes and was
[labeled\r\nappropriately](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)","sha":"a365891c6847c0fef80d909666f1ce5cbf0986b3"}}]}]
BACKPORT-->

Co-authored-by: Christos Nasikas <[email protected]>
  • Loading branch information
@kibanamachine @cnasikas
kibanamachine and cnasikas authored May 29, 2024
1 parent 33a056b commit 37c1707
Showing 1 changed file with 48 additions and 47 deletions.
95 changes: 48 additions & 47 deletions ...ublic/application/sections/actions_connectors_list/components/actions_connectors_list.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,6 @@
* 2.0.
*/

import { ClassNames } from '@emotion/react';
import React, { useState, useEffect } from 'react';
import {
EuiInMemoryTable,
Expand All @@ -25,10 +24,9 @@ import {
} from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import { omit } from 'lodash';
import { FormattedMessage } from '@kbn/i18n-react';
import { withTheme, EuiTheme } from '@kbn/kibana-react-plugin/common';
import { getConnectorCompatibility } from '@kbn/actions-plugin/common';
import { useHistory, useLocation, useParams } from 'react-router-dom';
import { getConnectorCompatibility } from '@kbn/actions-plugin/common';
import { FormattedMessage } from '@kbn/i18n-react';
import { loadAllActions, loadActionTypes, deleteActions } from '../../../lib/action_connector_api';
import {
hasDeleteActionsCapability,
Expand Down Expand Up @@ -63,29 +61,21 @@ interface EditConnectorProps {
isFix?: boolean;
}

const ConnectorIconTipWithSpacing = withTheme(({ theme }: { theme: EuiTheme }) => {
const ConnectorIconTipWithSpacing: React.FC = () => {
return (
<ClassNames>
{({ css }) => (
<EuiIconTip
anchorClassName={css({
/**
* Adds some spacing to the left of the warning icon for deprecated connectors
*/
marginLeft: theme.eui.euiSizeS,
marginBottom: '0 !important',
})}
aria-label="Warning"
size="m"
type="warning"
color="warning"
content={connectorDeprecatedMessage}
position="right"
/>
)}
</ClassNames>
<EuiIconTip
aria-label="Warning"
size="m"
type="warning"
color="warning"
content={connectorDeprecatedMessage}
position="right"
iconProps={{
style: { verticalAlign: 'text-top' },
}}
/>
);
});
};

const ActionsConnectorsList: React.FunctionComponent = () => {
const {
Expand Down Expand Up @@ -246,30 +236,41 @@ const ActionsConnectorsList: React.FunctionComponent = () => {
const name = getConnectorName(value, item);

const link = (
<>
<EuiLink
data-test-subj={`edit${item.id}`}
title={name}
onClick={() => editItem(item, EditConnectorTabs.Configuration)}
key={item.id}
disabled={actionTypesIndex ? !actionTypesIndex[item.actionTypeId]?.enabled : true}
>
{name}
</EuiLink>
<EuiFlexGroup justifyContent="center" alignItems="center" gutterSize="xs">
<EuiFlexItem grow={false}>
<EuiLink
data-test-subj={`edit${item.id}`}
title={name}
onClick={() => editItem(item, EditConnectorTabs.Configuration)}
key={item.id}
disabled={actionTypesIndex ? !actionTypesIndex[item.actionTypeId]?.enabled : true}
>
{name}
</EuiLink>
</EuiFlexItem>
{item.isMissingSecrets ? (
<EuiIconTip
iconProps={{ 'data-test-subj': `missingSecrets_${item.id}` }}
type="warning"
color="warning"
content={i18n.translate(
'xpack.triggersActionsUI.sections.actionsConnectorsList.connectorsListTable.columns.actions.missingSecretsDescription',
{ defaultMessage: 'Sensitive information was not imported' }
)}
position="right"
/>
<EuiFlexItem grow={false}>
<EuiIconTip
iconProps={{
'data-test-subj': `missingSecrets_${item.id}`,
style: { verticalAlign: 'text-top' },
}}
type="warning"
color="warning"
content={i18n.translate(
'xpack.triggersActionsUI.sections.actionsConnectorsList.connectorsListTable.columns.actions.missingSecretsDescription',
{ defaultMessage: 'Sensitive information was not imported' }
)}
position="right"
/>
</EuiFlexItem>
) : null}
{showDeprecatedTooltip && <ConnectorIconTipWithSpacing />}
</>
{showDeprecatedTooltip && (
<EuiFlexItem grow={false}>
<ConnectorIconTipWithSpacing />
</EuiFlexItem>
)}
</EuiFlexGroup>
);

return checkEnabledResult.isEnabled ? (
Expand Down

0 comments on commit 37c1707

Please sign in to comment.