[Fleet] Show host id in agent overview page (#188822)

Fixes https://github.com/elastic/kibana/issues/182680

## Summary
Display the host id in agent detail page. Previously this info wasn't
displayed anywhere in the UI

![Screenshot 2024-07-22 at 11 29
20](https://github.com/user-attachments/assets/828c4069-8595-4de0-b9a6-b00c6fa66fe0)


### Checklist
- [ ] Any text added follows [EUI's writing
guidelines](https://elastic.github.io/eui/#/guidelines/writing), uses
sentence case text and includes [i18n
support](https://github.com/elastic/kibana/blob/main/packages/kbn-i18n/README.md)
- [ ] [Unit or functional
tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)
were updated or added to match the most common scenarios

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

@@ -149,7 +149,7 @@ export const AgentDetailsOverviewSection: React.FunctionComponent<{
               description: agent.last_checkin_message ? agent.last_checkin_message : '-',
             },
             {
-              title: i18n.translate('xpack.fleet.agentDetails.hostIdLabel', {
+              title: i18n.translate('xpack.fleet.agentDetails.agentIdLabel', {
                 defaultMessage: 'Agent ID',
               }),
               description: agent.id,
@@ -197,6 +197,15 @@ export const AgentDetailsOverviewSection: React.FunctionComponent<{
                   ? agent.local_metadata.host.hostname
                   : '-',
             },
+            {
+              title: i18n.translate('xpack.fleet.agentDetails.hostIdLabel', {
+                defaultMessage: 'Host ID',
+              }),
+              description:
+                typeof agent.local_metadata?.host?.id === 'string'
+                  ? agent.local_metadata.host.id
+                  : '-',
+            },
             {
               title: i18n.translate('xpack.fleet.agentDetails.logLevel', {
                 defaultMessage: 'Logging level',