github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-24 09:48:58 -04:00
Code Issues Projects Releases Packages Wiki Activity

Display tooltips for long tags, even if there are less than 3 total tags (#132528)

Browse source 
Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>
This commit is contained in:
Kyle Pollich 2022-05-19 13:42:10 -04:00 • committed by GitHub
parent 6383b42e5d
commit ccb25d048c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 15 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

17
x-pack/plugins/fleet/public/applications/fleet/sections/agents/agent_list_page/components/tags.tsx
View file

@ -9,7 +9,7 @@ import { EuiToolTip } from '@elastic/eui';
import { take } from 'lodash';
import React from 'react';
import { truncateTag } from '../utils';
import { truncateTag, MAX_TAG_DISPLAY_LENGTH } from '../utils';
interface Props {
tags: string[];
@ -30,7 +30,20 @@ export const Tags: React.FunctionComponent<Props> = ({ tags }) => {
</EuiToolTip>
</>
) : (
<span data-test-subj="agentTags">{tags.map(truncateTag).join(', ')}</span>
<span data-test-subj="agentTags">
{tags.map((tag, index) => (
<>
{index > 0 && ', '}
{tag.length > MAX_TAG_DISPLAY_LENGTH ? (
<EuiToolTip content={<span>{tag}</span>} key={tag}>
<span>{truncateTag(tag)}</span>
</EuiToolTip>
) : (
<span key={tag}>{tag}</span>
)}
</>
))}
</span>
)}
</>
);