diff --git a/x-pack/plugins/fleet/public/applications/fleet/components/link_and_revision.tsx b/x-pack/plugins/fleet/public/applications/fleet/components/link_and_revision.tsx index 071a9dc5943b2..41ef63b23b564 100644 --- a/x-pack/plugins/fleet/public/applications/fleet/components/link_and_revision.tsx +++ b/x-pack/plugins/fleet/public/applications/fleet/components/link_and_revision.tsx @@ -5,43 +5,54 @@ * 2.0. */ -import { EuiFlexGroup, EuiFlexItem, EuiLink, EuiText } from '@elastic/eui'; +import { EuiFlexGroup, EuiFlexItem, EuiIconTip, EuiLink, EuiText } from '@elastic/eui'; +import { i18n } from '@kbn/i18n'; import { FormattedMessage } from '@kbn/i18n/react'; import type { CSSProperties } from 'react'; import React, { memo } from 'react'; -import type { EuiLinkProps } from '@elastic/eui/src/components/link/link'; +import type { AgentPolicy } from '../../../../common/types'; +import { useLink } from '../hooks'; const MIN_WIDTH: CSSProperties = { minWidth: 0 }; const NO_WRAP_WHITE_SPACE: CSSProperties = { whiteSpace: 'nowrap' }; -export type LinkAndRevisionProps = EuiLinkProps & { - revision?: string | number; -}; - -/** - * Components shows a link for a given value along with a revision number to its right. The display - * value is truncated if it is longer than the width of where it is displayed, while the revision - * always remain visible - */ -export const LinkAndRevision = memo( - ({ revision, className, ...euiLinkProps }) => { - return ( - - - +export const AgentPolicySummaryLine = memo<{ policy: AgentPolicy }>(({ policy }) => { + const { getHref } = useLink(); + const { name, id, revision, is_managed: isManaged } = policy; + return ( + + + + {name || id} + + + {isManaged && ( + + )} + {revision && ( + + + + - {revision && ( - - - - - - )} - - ); - } -); + )} + + ); +}); diff --git a/x-pack/plugins/fleet/public/applications/fleet/sections/agent_policy/list_page/index.tsx b/x-pack/plugins/fleet/public/applications/fleet/sections/agent_policy/list_page/index.tsx index 55788da05bcea..48b9118d11566 100644 --- a/x-pack/plugins/fleet/public/applications/fleet/sections/agent_policy/list_page/index.tsx +++ b/x-pack/plugins/fleet/public/applications/fleet/sections/agent_policy/list_page/index.tsx @@ -36,7 +36,7 @@ import { useUrlParams, useBreadcrumbs, } from '../../../hooks'; -import { LinkAndRevision, SearchBar } from '../../../components'; +import { AgentPolicySummaryLine, SearchBar } from '../../../components'; import { LinkedAgentCount, AgentPolicyActionMenu } from '../components'; import { CreateAgentPolicyFlyout } from './components'; @@ -74,7 +74,7 @@ const AgentPolicyListPageLayout: React.FunctionComponent = ({ children }) => ( export const AgentPolicyListPage: React.FunctionComponent<{}> = () => { useBreadcrumbs('policies_list'); - const { getHref, getPath } = useLink(); + const { getPath } = useLink(); const hasWriteCapabilites = useCapabilities().write; const { agents: { enabled: isFleetEnabled }, @@ -132,13 +132,7 @@ export const AgentPolicyListPage: React.FunctionComponent<{}> = () => { }), width: '20%', render: (name: string, agentPolicy: AgentPolicy) => ( - - {name || agentPolicy.id} - + ), }, { @@ -205,7 +199,7 @@ export const AgentPolicyListPage: React.FunctionComponent<{}> = () => { } return cols; - }, [getHref, isFleetEnabled, resendRequest]); + }, [isFleetEnabled, resendRequest]); const createAgentPolicyButton = useMemo( () => ( diff --git a/x-pack/plugins/fleet/public/applications/fleet/sections/agents/agent_details_page/components/agent_details/agent_details_overview.tsx b/x-pack/plugins/fleet/public/applications/fleet/sections/agents/agent_details_page/components/agent_details/agent_details_overview.tsx index 482861b3db9e8..bf8385712dd23 100644 --- a/x-pack/plugins/fleet/public/applications/fleet/sections/agents/agent_details_page/components/agent_details/agent_details_overview.tsx +++ b/x-pack/plugins/fleet/public/applications/fleet/sections/agents/agent_details_page/components/agent_details/agent_details_overview.tsx @@ -21,10 +21,10 @@ import { i18n } from '@kbn/i18n'; import { FormattedMessage } from '@kbn/i18n/react'; import type { Agent, AgentPolicy } from '../../../../../types'; -import { useKibanaVersion, useLink } from '../../../../../hooks'; +import { useKibanaVersion } from '../../../../../hooks'; import { isAgentUpgradeable } from '../../../../../services'; import { AgentPolicyPackageBadges } from '../../../components/agent_policy_package_badges'; -import { LinkAndRevision } from '../../../../../components'; +import { AgentPolicySummaryLine } from '../../../../../components'; // Allows child text to be truncated const FlexItemWithMinWidth = styled(EuiFlexItem)` @@ -35,7 +35,6 @@ export const AgentDetailsOverviewSection: React.FunctionComponent<{ agent: Agent; agentPolicy?: AgentPolicy; }> = memo(({ agent, agentPolicy }) => { - const { getHref } = useLink(); const kibanaVersion = useKibanaVersion(); return ( @@ -52,13 +51,7 @@ export const AgentDetailsOverviewSection: React.FunctionComponent<{ defaultMessage: 'Agent policy', }), description: agentPolicy ? ( - - {agentPolicy.name || agentPolicy.id} - + ) : ( agent.policy_id || '-' ), diff --git a/x-pack/plugins/fleet/public/applications/fleet/sections/agents/agent_list_page/index.tsx b/x-pack/plugins/fleet/public/applications/fleet/sections/agents/agent_list_page/index.tsx index 10f35aab44c5a..6dd1b8a9693e8 100644 --- a/x-pack/plugins/fleet/public/applications/fleet/sections/agents/agent_list_page/index.tsx +++ b/x-pack/plugins/fleet/public/applications/fleet/sections/agents/agent_list_page/index.tsx @@ -37,7 +37,7 @@ import { useKibanaVersion, useStartServices, } from '../../../hooks'; -import { ContextMenuActions } from '../../../components'; +import { AgentPolicySummaryLine, ContextMenuActions } from '../../../components'; import { AgentStatusKueryHelper, isAgentUpgradeable } from '../../../services'; import { AGENT_SAVED_OBJECT_TYPE } from '../../../constants'; import { @@ -374,48 +374,24 @@ export const AgentListPage: React.FunctionComponent<{}> = () => { defaultMessage: 'Agent policy', }), render: (policyId: string, agent: Agent) => { - const policyName = agentPoliciesIndexedById[policyId]?.name; + const agentPolicy = agentPoliciesIndexedById[policyId]; + const showWarning = agent.policy_revision && agentPolicy?.revision > agent.policy_revision; + return ( - - - {policyName || policyId} - - - {agent.policy_revision && ( + + {showWarning && ( - + + +   )} - {agent.policy_id && - agent.policy_revision && - agentPoliciesIndexedById[agent.policy_id] && - agentPoliciesIndexedById[agent.policy_id].revision > agent.policy_revision && ( - - - -   - {true && ( - <> - - - )} - - - )} ); }, diff --git a/x-pack/plugins/fleet/public/applications/fleet/sections/epm/screens/detail/policies/package_policies.tsx b/x-pack/plugins/fleet/public/applications/fleet/sections/epm/screens/detail/policies/package_policies.tsx index 94b4b748cb1bd..b14551098e688 100644 --- a/x-pack/plugins/fleet/public/applications/fleet/sections/epm/screens/detail/policies/package_policies.tsx +++ b/x-pack/plugins/fleet/public/applications/fleet/sections/epm/screens/detail/policies/package_policies.tsx @@ -5,7 +5,6 @@ * 2.0. */ -import type { ReactNode } from 'react'; import React, { memo, useCallback, useMemo } from 'react'; import { Redirect } from 'react-router-dom'; import type { CriteriaWithPagination, EuiTableFieldDataColumnType } from '@elastic/eui'; @@ -16,8 +15,7 @@ import { FormattedRelative, FormattedMessage } from '@kbn/i18n/react'; import { InstallStatus } from '../../../../../types'; import { useLink, useUrlPagination } from '../../../../../hooks'; import { PACKAGE_POLICY_SAVED_OBJECT_TYPE } from '../../../../../constants'; -import type { LinkAndRevisionProps } from '../../../../../components'; -import { LinkAndRevision } from '../../../../../components'; +import { AgentPolicySummaryLine } from '../../../../../components'; import { LinkedAgentCount } from '../../../../../components/linked_agent_count'; import { useGetPackageInstallStatus } from '../../../hooks'; @@ -42,27 +40,6 @@ const IntegrationDetailsLink = memo<{ ); }); - -const AgentPolicyDetailLink = memo<{ - agentPolicyId: string; - revision: LinkAndRevisionProps['revision']; - children: ReactNode; -}>(({ agentPolicyId, revision, children }) => { - const { getHref } = useLink(); - - return ( - - {children} - - ); -}); - interface PackagePoliciesPanelProps { name: string; version: string; @@ -112,11 +89,7 @@ export const PackagePoliciesPage = ({ name, version }: PackagePoliciesPanelProps }), truncateText: true, render(id, { agentPolicy }) { - return ( - - {agentPolicy.name ?? id} - - ); + return ; }, }, { diff --git a/x-pack/plugins/translations/translations/ja-JP.json b/x-pack/plugins/translations/translations/ja-JP.json index fea58eaa05d07..db6d63115aac6 100644 --- a/x-pack/plugins/translations/translations/ja-JP.json +++ b/x-pack/plugins/translations/translations/ja-JP.json @@ -8235,7 +8235,6 @@ "xpack.fleet.agentList.policyColumnTitle": "エージェントポリシー", "xpack.fleet.agentList.policyFilterText": "エージェントポリシー", "xpack.fleet.agentList.reassignActionText": "新しいポリシーに割り当てる", - "xpack.fleet.agentList.revisionNumber": "rev. {revNumber}", "xpack.fleet.agentList.showUpgradeableFilterLabel": "アップグレードが利用可能です", "xpack.fleet.agentList.statusColumnTitle": "ステータス", "xpack.fleet.agentList.statusFilterText": "ステータス", @@ -8653,7 +8652,6 @@ "xpack.fleet.policyForm.generalSettingsGroupDescription": "エージェントポリシーの名前と説明を選択してください。", "xpack.fleet.policyForm.generalSettingsGroupTitle": "一般設定", "xpack.fleet.policyForm.unableToDeleteDefaultPolicyText": "デフォルトポリシーは削除できません", - "xpack.fleet.policyNameLink.revisionNumber": "rev. {revNumber}", "xpack.fleet.securityRequiredErrorMessage": "Fleet を使用するには、Kibana と Elasticsearch でセキュリティを有効にする必要があります。", "xpack.fleet.securityRequiredErrorTitle": "セキュリティが有効ではありません", "xpack.fleet.settings.additionalYamlConfig": "Elasticsearch出力構成", diff --git a/x-pack/plugins/translations/translations/zh-CN.json b/x-pack/plugins/translations/translations/zh-CN.json index d8404a8d282bb..c78def79e0d23 100644 --- a/x-pack/plugins/translations/translations/zh-CN.json +++ b/x-pack/plugins/translations/translations/zh-CN.json @@ -8309,7 +8309,6 @@ "xpack.fleet.agentList.policyColumnTitle": "代理策略", "xpack.fleet.agentList.policyFilterText": "代理策略", "xpack.fleet.agentList.reassignActionText": "分配到新策略", - "xpack.fleet.agentList.revisionNumber": "修订版 {revNumber}", "xpack.fleet.agentList.showUpgradeableFilterLabel": "升级可用", "xpack.fleet.agentList.statusColumnTitle": "状态", "xpack.fleet.agentList.statusFilterText": "状态", @@ -8737,7 +8736,7 @@ "xpack.fleet.policyForm.generalSettingsGroupDescription": "为您的代理策略选择名称和描述。", "xpack.fleet.policyForm.generalSettingsGroupTitle": "常规设置", "xpack.fleet.policyForm.unableToDeleteDefaultPolicyText": "默认策略无法删除", - "xpack.fleet.policyNameLink.revisionNumber": "修订版 {revNumber}", + "xpack.fleet.agentPolicySummaryLine.revisionNumber": "修订版 {revNumber}", "xpack.fleet.securityRequiredErrorMessage": "必须在 Kibana 和 Elasticsearch 启用安全性，才能使用 Fleet。", "xpack.fleet.securityRequiredErrorTitle": "安全性未启用", "xpack.fleet.settings.additionalYamlConfig": "Elasticsearch 输出配置",