Fix long agent policy name accessibility in add/edit integration (#113828)

This commit is contained in:
Jack 2021-10-06 10:58:04 -04:00 committed by GitHub
parent 1eceef4fc8
commit e16495792f
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -7,6 +7,7 @@
import React, { memo, useMemo } from 'react'; import React, { memo, useMemo } from 'react';
import { FormattedMessage } from '@kbn/i18n/react'; import { FormattedMessage } from '@kbn/i18n/react';
import styled from 'styled-components';
import { import {
EuiFlexGroup, EuiFlexGroup,
EuiFlexItem, EuiFlexItem,
@ -23,6 +24,14 @@ import type { AgentPolicy, PackageInfo, RegistryPolicyTemplate } from '../../../
import { PackageIcon } from '../../../../components'; import { PackageIcon } from '../../../../components';
import type { EditPackagePolicyFrom } from '../types'; import type { EditPackagePolicyFrom } from '../types';
const AgentPolicyName = styled(EuiDescriptionListDescription)`
margin-left: auto;
max-width: 250px;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
`;
export const CreatePackagePolicyPageLayout: React.FunctionComponent<{ export const CreatePackagePolicyPageLayout: React.FunctionComponent<{
from: EditPackagePolicyFrom; from: EditPackagePolicyFrom;
cancelUrl: string; cancelUrl: string;
@ -209,9 +218,9 @@ export const CreatePackagePolicyPageLayout: React.FunctionComponent<{
defaultMessage="Agent policy" defaultMessage="Agent policy"
/> />
</EuiDescriptionListTitle> </EuiDescriptionListTitle>
<EuiDescriptionListDescription className="eui-textBreakWord"> <AgentPolicyName className="eui-textBreakWord" title={agentPolicy?.name || '-'}>
{agentPolicy?.name || '-'} {agentPolicy?.name || '-'}
</EuiDescriptionListDescription> </AgentPolicyName>
</EuiDescriptionList> </EuiDescriptionList>
) : undefined; ) : undefined;