Skip to content

Commit d097d96

Browse files
nchauletkibanamachine
nchaulet
and
kibanamachine
authored
[Fleet] Fix agent details after EUI upgrade (elastic#146073)
## Summary Fix a padding issue with the latest EUI upgrade on the agent details page It's easier to review with whitespace hidden https://github.com/elastic/kibana/pull/146073/files?w=1 ## UI change <img width="1318" alt="Screen Shot 2022-11-22 at 4 30 58 PM" src="https://user-images.githubusercontent.com/1336873/203425390-4be34e2f-9cd4-416c-8ee7-de6a8c7fadc9.png"> ## Bugged UI <img width="1290" alt="Screen Shot 2022-11-22 at 4 30 12 PM" src="https://user-images.githubusercontent.com/1336873/203425405-11f8d20f-71af-423e-b4c8-9943e18fc68f.png"> Co-authored-by: Kibana Machine <[email protected]>
1 parent 7c89949 commit d097d96

File tree

1 file changed

+161
-159
lines changed
  • x-pack/plugins/fleet/public/applications/fleet/sections/agents/agent_details_page/components/agent_details

1 file changed

+161
-159
lines changed

‎x-pack/plugins/fleet/public/applications/fleet/sections/agents/agent_details_page/components/agent_details/agent_details_overview.tsx‎

Lines changed: 161 additions & 159 deletions
Original file line numberDiff line numberDiff line change
@@ -41,170 +41,172 @@ export const AgentDetailsOverviewSection: React.FunctionComponent<{
4141
return (
4242
<EuiPanel>
4343
<EuiDescriptionList compressed>
44-
{[
45-
{
46-
title: i18n.translate('xpack.fleet.agentDetails.statusLabel', {
47-
defaultMessage: 'Status',
48-
}),
49-
description: <AgentHealth agent={agent} showOfflinePreviousStatus={true} />,
50-
},
51-
{
52-
title: i18n.translate('xpack.fleet.agentDetails.lastActivityLabel', {
53-
defaultMessage: 'Last activity',
54-
}),
55-
description: agent.last_checkin ? (
56-
<FormattedRelative value={new Date(agent.last_checkin)} />
57-
) : (
58-
'-'
59-
),
60-
},
61-
{
62-
title: i18n.translate('xpack.fleet.agentDetails.lastCheckinMessageLabel', {
63-
defaultMessage: 'Last checkin message',
64-
}),
65-
description: agent.last_checkin_message ? agent.last_checkin_message : '-',
66-
},
67-
{
68-
title: i18n.translate('xpack.fleet.agentDetails.hostIdLabel', {
69-
defaultMessage: 'Agent ID',
70-
}),
71-
description: agent.id,
72-
},
73-
{
74-
title: i18n.translate('xpack.fleet.agentDetails.agentPolicyLabel', {
75-
defaultMessage: 'Agent policy',
76-
}),
77-
description: agentPolicy ? (
78-
<AgentPolicySummaryLine policy={agentPolicy} agent={agent} />
79-
) : (
80-
agent.policy_id || '-'
81-
),
82-
},
83-
{
84-
title: i18n.translate('xpack.fleet.agentDetails.versionLabel', {
85-
defaultMessage: 'Agent version',
86-
}),
87-
description:
88-
typeof agent.local_metadata?.elastic?.agent?.version === 'string' ? (
89-
<EuiFlexGroup gutterSize="s" alignItems="center" style={{ minWidth: 0 }}>
90-
<EuiFlexItem grow={false} className="eui-textNoWrap">
91-
{agent.local_metadata.elastic.agent.version}
92-
</EuiFlexItem>
93-
{isAgentUpgradeable(agent, kibanaVersion) ? (
94-
<EuiFlexItem grow={false}>
95-
<EuiToolTip
96-
position="right"
97-
content={i18n.translate('xpack.fleet.agentList.agentUpgradeLabel', {
98-
defaultMessage: 'Upgrade available',
99-
})}
100-
>
101-
<EuiIcon type="alert" color="warning" />
102-
</EuiToolTip>
103-
</EuiFlexItem>
104-
) : null}
105-
</EuiFlexGroup>
44+
<EuiFlexGroup direction="column" gutterSize="m">
45+
{[
46+
{
47+
title: i18n.translate('xpack.fleet.agentDetails.statusLabel', {
48+
defaultMessage: 'Status',
49+
}),
50+
description: <AgentHealth agent={agent} showOfflinePreviousStatus={true} />,
51+
},
52+
{
53+
title: i18n.translate('xpack.fleet.agentDetails.lastActivityLabel', {
54+
defaultMessage: 'Last activity',
55+
}),
56+
description: agent.last_checkin ? (
57+
<FormattedRelative value={new Date(agent.last_checkin)} />
10658
) : (
10759
'-'
10860
),
109-
},
110-
{
111-
title: i18n.translate('xpack.fleet.agentDetails.hostNameLabel', {
112-
defaultMessage: 'Host name',
113-
}),
114-
description:
115-
typeof agent.local_metadata?.host?.hostname === 'string'
116-
? agent.local_metadata.host.hostname
117-
: '-',
118-
},
119-
{
120-
title: i18n.translate('xpack.fleet.agentDetails.logLevel', {
121-
defaultMessage: 'Logging level',
122-
}),
123-
description:
124-
typeof agent.local_metadata?.elastic?.agent?.log_level === 'string'
125-
? agent.local_metadata.elastic.agent.log_level
126-
: '-',
127-
},
128-
{
129-
title: i18n.translate('xpack.fleet.agentDetails.releaseLabel', {
130-
defaultMessage: 'Agent release',
131-
}),
132-
description:
133-
typeof agent.local_metadata?.elastic?.agent?.snapshot === 'boolean'
134-
? agent.local_metadata.elastic.agent.snapshot === true
135-
? 'snapshot'
136-
: 'stable'
137-
: '-',
138-
},
139-
{
140-
title: i18n.translate('xpack.fleet.agentDetails.platformLabel', {
141-
defaultMessage: 'Platform',
142-
}),
143-
description:
144-
typeof agent.local_metadata?.os?.platform === 'string'
145-
? agent.local_metadata.os.platform
146-
: '-',
147-
},
148-
{
149-
title: i18n.translate('xpack.fleet.agentDetails.monitorLogsLabel', {
150-
defaultMessage: 'Monitor logs',
151-
}),
152-
description:
153-
Array.isArray(agentPolicy?.monitoring_enabled) &&
154-
agentPolicy?.monitoring_enabled?.includes('logs') ? (
155-
<FormattedMessage
156-
id="xpack.fleet.agentList.monitorLogsEnabledText"
157-
defaultMessage="Enabled"
158-
/>
159-
) : (
160-
<FormattedMessage
161-
id="xpack.fleet.agentList.monitorLogsDisabledText"
162-
defaultMessage="Disabled"
163-
/>
164-
),
165-
},
166-
{
167-
title: i18n.translate('xpack.fleet.agentDetails.monitorMetricsLabel', {
168-
defaultMessage: 'Monitor metrics',
169-
}),
170-
description:
171-
Array.isArray(agentPolicy?.monitoring_enabled) &&
172-
agentPolicy?.monitoring_enabled?.includes('metrics') ? (
173-
<FormattedMessage
174-
id="xpack.fleet.agentList.monitorMetricsEnabledText"
175-
defaultMessage="Enabled"
176-
/>
61+
},
62+
{
63+
title: i18n.translate('xpack.fleet.agentDetails.lastCheckinMessageLabel', {
64+
defaultMessage: 'Last checkin message',
65+
}),
66+
description: agent.last_checkin_message ? agent.last_checkin_message : '-',
67+
},
68+
{
69+
title: i18n.translate('xpack.fleet.agentDetails.hostIdLabel', {
70+
defaultMessage: 'Agent ID',
71+
}),
72+
description: agent.id,
73+
},
74+
{
75+
title: i18n.translate('xpack.fleet.agentDetails.agentPolicyLabel', {
76+
defaultMessage: 'Agent policy',
77+
}),
78+
description: agentPolicy ? (
79+
<AgentPolicySummaryLine policy={agentPolicy} agent={agent} />
17780
) : (
178-
<FormattedMessage
179-
id="xpack.fleet.agentList.monitorMetricsDisabledText"
180-
defaultMessage="Disabled"
181-
/>
81+
agent.policy_id || '-'
18282
),
183-
},
184-
{
185-
title: i18n.translate('xpack.fleet.agentDetails.tagsLabel', {
186-
defaultMessage: 'Tags',
187-
}),
188-
description: (agent.tags ?? []).length > 0 ? <Tags tags={agent.tags ?? []} /> : '-',
189-
},
190-
].map(({ title, description }) => {
191-
const tooltip =
192-
typeof description === 'string' && description.length > 20 ? description : '';
193-
return (
194-
<EuiFlexGroup>
195-
<FlexItemWithMinWidth grow={3}>
196-
<EuiDescriptionListTitle>{title}</EuiDescriptionListTitle>
197-
</FlexItemWithMinWidth>
198-
<FlexItemWithMinWidth grow={7}>
199-
<EuiToolTip position="top" content={tooltip}>
200-
<EuiDescriptionListDescription className="eui-textTruncate">
201-
{description}
202-
</EuiDescriptionListDescription>
203-
</EuiToolTip>
204-
</FlexItemWithMinWidth>
205-
</EuiFlexGroup>
206-
);
207-
})}
83+
},
84+
{
85+
title: i18n.translate('xpack.fleet.agentDetails.versionLabel', {
86+
defaultMessage: 'Agent version',
87+
}),
88+
description:
89+
typeof agent.local_metadata?.elastic?.agent?.version === 'string' ? (
90+
<EuiFlexGroup gutterSize="s" alignItems="center" style={{ minWidth: 0 }}>
91+
<EuiFlexItem grow={false} className="eui-textNoWrap">
92+
{agent.local_metadata.elastic.agent.version}
93+
</EuiFlexItem>
94+
{isAgentUpgradeable(agent, kibanaVersion) ? (
95+
<EuiFlexItem grow={false}>
96+
<EuiToolTip
97+
position="right"
98+
content={i18n.translate('xpack.fleet.agentList.agentUpgradeLabel', {
99+
defaultMessage: 'Upgrade available',
100+
})}
101+
>
102+
<EuiIcon type="alert" color="warning" />
103+
</EuiToolTip>
104+
</EuiFlexItem>
105+
) : null}
106+
</EuiFlexGroup>
107+
) : (
108+
'-'
109+
),
110+
},
111+
{
112+
title: i18n.translate('xpack.fleet.agentDetails.hostNameLabel', {
113+
defaultMessage: 'Host name',
114+
}),
115+
description:
116+
typeof agent.local_metadata?.host?.hostname === 'string'
117+
? agent.local_metadata.host.hostname
118+
: '-',
119+
},
120+
{
121+
title: i18n.translate('xpack.fleet.agentDetails.logLevel', {
122+
defaultMessage: 'Logging level',
123+
}),
124+
description:
125+
typeof agent.local_metadata?.elastic?.agent?.log_level === 'string'
126+
? agent.local_metadata.elastic.agent.log_level
127+
: '-',
128+
},
129+
{
130+
title: i18n.translate('xpack.fleet.agentDetails.releaseLabel', {
131+
defaultMessage: 'Agent release',
132+
}),
133+
description:
134+
typeof agent.local_metadata?.elastic?.agent?.snapshot === 'boolean'
135+
? agent.local_metadata.elastic.agent.snapshot === true
136+
? 'snapshot'
137+
: 'stable'
138+
: '-',
139+
},
140+
{
141+
title: i18n.translate('xpack.fleet.agentDetails.platformLabel', {
142+
defaultMessage: 'Platform',
143+
}),
144+
description:
145+
typeof agent.local_metadata?.os?.platform === 'string'
146+
? agent.local_metadata.os.platform
147+
: '-',
148+
},
149+
{
150+
title: i18n.translate('xpack.fleet.agentDetails.monitorLogsLabel', {
151+
defaultMessage: 'Monitor logs',
152+
}),
153+
description:
154+
Array.isArray(agentPolicy?.monitoring_enabled) &&
155+
agentPolicy?.monitoring_enabled?.includes('logs') ? (
156+
<FormattedMessage
157+
id="xpack.fleet.agentList.monitorLogsEnabledText"
158+
defaultMessage="Enabled"
159+
/>
160+
) : (
161+
<FormattedMessage
162+
id="xpack.fleet.agentList.monitorLogsDisabledText"
163+
defaultMessage="Disabled"
164+
/>
165+
),
166+
},
167+
{
168+
title: i18n.translate('xpack.fleet.agentDetails.monitorMetricsLabel', {
169+
defaultMessage: 'Monitor metrics',
170+
}),
171+
description:
172+
Array.isArray(agentPolicy?.monitoring_enabled) &&
173+
agentPolicy?.monitoring_enabled?.includes('metrics') ? (
174+
<FormattedMessage
175+
id="xpack.fleet.agentList.monitorMetricsEnabledText"
176+
defaultMessage="Enabled"
177+
/>
178+
) : (
179+
<FormattedMessage
180+
id="xpack.fleet.agentList.monitorMetricsDisabledText"
181+
defaultMessage="Disabled"
182+
/>
183+
),
184+
},
185+
{
186+
title: i18n.translate('xpack.fleet.agentDetails.tagsLabel', {
187+
defaultMessage: 'Tags',
188+
}),
189+
description: (agent.tags ?? []).length > 0 ? <Tags tags={agent.tags ?? []} /> : '-',
190+
},
191+
].map(({ title, description }) => {
192+
const tooltip =
193+
typeof description === 'string' && description.length > 20 ? description : '';
194+
return (
195+
<EuiFlexGroup>
196+
<FlexItemWithMinWidth grow={3}>
197+
<EuiDescriptionListTitle>{title}</EuiDescriptionListTitle>
198+
</FlexItemWithMinWidth>
199+
<FlexItemWithMinWidth grow={7}>
200+
<EuiToolTip position="top" content={tooltip}>
201+
<EuiDescriptionListDescription className="eui-textTruncate">
202+
{description}
203+
</EuiDescriptionListDescription>
204+
</EuiToolTip>
205+
</FlexItemWithMinWidth>
206+
</EuiFlexGroup>
207+
);
208+
})}
209+
</EuiFlexGroup>
208210
</EuiDescriptionList>
209211
</EuiPanel>
210212
);

0 commit comments

Comments
 (0)