[Fleet] show download rate in upgrade details tooltlip (elastic#173614)

## Summary

Closes elastic#171943

Showing download rate in the upgrade details tooltip.

Used fake data as I couldn't get an actual agent to be in downloading
state with download percent and rate.

<img width="659" alt="image"
src="https://github.com/elastic/kibana/assets/90178898/1488fa7f-b003-4d5a-a98a-27fcc8a4c70c">

Insert test ES data with curl and go to Agent list/details to see the
tooltip, replace `existing_agent_id` with an existing agent's id or
insert a full agent doc.
```
curl -sk -XPOST --user elastic:changeme -H 'content-type:application/json' \
http://localhost:9200/_security/role/fleet_superuser -d '
   {
      "indices": [
            {
               "names": [".fleet*",".kibana*"],
               "privileges": ["all"],
               "allow_restricted_indices": true
            }
      ]
   }'

curl -sk -XPOST --user elastic:changeme -H 'content-type:application/json' \
http://localhost:9200/_security/user/fleet_superuser -d '
   {
      "password": "password",
      "roles": ["superuser", "fleet_superuser"]
   }'

   curl -sk -XPOST --user fleet_superuser:password -H 'content-type:application/json' \
   -H'x-elastic-product-origin:fleet' \
   http://localhost:9200/.fleet-agents/_update_by_query -d '
   {
      "script": {
        "source": "ctx._source.upgrade_details.state = \"UPG_DOWNLOADING\"; ctx._source.upgrade_details.metadata.download_percent = 22; ctx._source.upgrade_details.metadata.download_rate = 1223912;",
        "lang": "painless"
      },
      "query": {
        "term": {
          "agent.id":"existing_agent_id"
        }
      }
    }'

```

### Checklist

- [x] [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

(cherry picked from commit b9d3c86)

x-pack/plugins/fleet/common/types/models/agent.ts

@@ -446,6 +446,7 @@ export interface AgentUpgradeDetails {
   metadata?: {
     scheduled_at?: string;
     download_percent?: number;
+    download_rate?: number; // bytes per second
     failed_state?: AgentUpgradeStateType;
     error_msg?: string;
   };

x-pack/plugins/fleet/public/applications/fleet/sections/agents/agent_list_page/components/agent_upgrade_status.test.tsx

@@ -48,12 +48,38 @@ describe('getDownloadEstimate', () => {
     expect(getDownloadEstimate()).toEqual('');
   });
 
-  it('should return an empty string if the agent has a zero download percent', () => {
-    expect(getDownloadEstimate(0)).toEqual('');
+  it('should display 0% if the agent has a zero download percent', () => {
+    expect(getDownloadEstimate({ download_percent: 0 })).toEqual(' (0%)');
+  });
+
+  it('should display 0 Bps if the agent has a zero download rate', () => {
+    expect(getDownloadEstimate({ download_rate: 0 })).toEqual(' (at 0.0 Bps)');
   });
 
   it('should return a formatted string if the agent has a positive download percent', () => {
-    expect(getDownloadEstimate(16.4)).toEqual(' (16.4%)');
+    expect(getDownloadEstimate({ download_percent: 16.4 })).toEqual(' (16.4%)');
+  });
+
+  it('should return a formatted string if the agent has a kBps download rate', () => {
+    expect(getDownloadEstimate({ download_rate: 1024 })).toEqual(' (at 1.0 kBps)');
+  });
+
+  it('should return a formatted string if the agent has a download rate and download percent', () => {
+    expect(getDownloadEstimate({ download_rate: 10, download_percent: 99 })).toEqual(
+      ' (99% at 10.0 Bps)'
+    );
+  });
+
+  it('should return a formatted string if the agent has a MBps download rate', () => {
+    expect(getDownloadEstimate({ download_rate: 1200000 })).toEqual(' (at 1.1 MBps)');
+  });
+
+  it('should return a formatted string if the agent has a GBps download rate', () => {
+    expect(getDownloadEstimate({ download_rate: 2400000000 })).toEqual(' (at 2.2 GBps)');
+  });
+
+  it('should return a formatted string if the agent has a GBps download rate more than 1024', () => {
+    expect(getDownloadEstimate({ download_rate: 1200000000 * 1024 })).toEqual(' (at 1144.4 GBps)');
   });
 });
 

x-pack/plugins/fleet/public/applications/fleet/sections/agents/agent_list_page/components/agent_upgrade_status.tsx

@@ -35,14 +35,34 @@ export function getUpgradeStartDelay(scheduledAt?: string): string {
   return ` The upgrade will start in less than ${Math.ceil(timeDiffMillis / 36e5)} hours.`;
 }
 
-export function getDownloadEstimate(downloadPercent?: number): string {
-  if (!downloadPercent || downloadPercent === 0) {
+export function getDownloadEstimate(metadata?: AgentUpgradeDetails['metadata']): string {
+  if (
+    !metadata ||
+    (metadata.download_percent === undefined && metadata.download_rate === undefined)
+  ) {
     return '';
   }
+  let tooltip = '';
+  if (metadata.download_percent !== undefined) {
+    tooltip = `${metadata.download_percent}%`;
+  }
+  if (metadata.download_rate !== undefined) {
+    tooltip += ` at ${formatRate(metadata.download_rate)}`;
+  }
 
-  return ` (${downloadPercent}%)`;
+  return ` (${tooltip.trim()})`;
 }
 
+const formatRate = (downloadRate: number) => {
+  let i = 0;
+  const byteUnits = [' Bps', ' kBps', ' MBps', ' GBps'];
+  for (; i < byteUnits.length - 1; i++) {
+    if (downloadRate < 1024) break;
+    downloadRate = downloadRate / 1024;
+  }
+  return downloadRate.toFixed(1) + byteUnits[i];
+};
+
 function getStatusComponents(agentUpgradeDetails?: AgentUpgradeDetails) {
   switch (agentUpgradeDetails?.state) {
     case 'UPG_REQUESTED':
@@ -97,9 +117,7 @@ function getStatusComponents(agentUpgradeDetails?: AgentUpgradeDetails) {
             id="xpack.fleet.agentUpgradeStatusTooltip.upgradeDownloading"
             defaultMessage="Downloading the new agent artifact version{downloadEstimate}."
             values={{
-              downloadEstimate: getDownloadEstimate(
-                agentUpgradeDetails?.metadata?.download_percent
-              ),
+              downloadEstimate: getDownloadEstimate(agentUpgradeDetails?.metadata),
             }}
           />
         ),