Merge branch 'master' into sample-flights

test/functional/apps/dashboard/dashboard_listing.ts

@@ -15,9 +15,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
   const browser = getService('browser');
   const listingTable = getService('listingTable');
 
-  // FLAKY: https://github.com/elastic/kibana/issues/86948
-  // FLAKY: https://github.com/elastic/kibana/issues/98247
-  describe.skip('dashboard listing page', function describeIndexTests() {
+  describe('dashboard listing page', function describeIndexTests() {
     const dashboardName = 'Dashboard Listing Test';
 
     before(async function () {

x-pack/plugins/infra/public/pages/metrics/inventory_view/components/filter_bar.tsx

@@ -12,12 +12,7 @@ import { WaffleTimeControls } from './waffle/waffle_time_controls';
 import { SearchBar } from './search_bar';
 
 export const FilterBar = () => (
-  <EuiFlexGroup
-    alignItems="center"
-    justifyContent="spaceBetween"
-    gutterSize="m"
-    style={{ flexGrow: 0 }}
-  >
+  <EuiFlexGroup justifyContent="spaceBetween" gutterSize="m" style={{ flexGrow: 0 }}>
     <EuiFlexItem>
       <SearchBar />
     </EuiFlexItem>

x-pack/plugins/infra/public/pages/metrics/inventory_view/components/layout.tsx

@@ -152,7 +152,7 @@ export const Layout = React.memo(
                           gutterSize="m"
                         >
                           <Toolbar nodeType={nodeType} currentTime={currentTime} />
-                          <EuiFlexItem grow={false}>
+                          <EuiFlexItem grow={false} className="eui-hideFor--s eui-hideFor--xs">
                             <IntervalLabel intervalAsString={intervalAsString} />
                           </EuiFlexItem>
                           <EuiFlexItem grow={false}>

x-pack/plugins/infra/public/pages/metrics/inventory_view/components/waffle/interval_label.tsx

@@ -6,7 +6,7 @@
  */
 
 import React from 'react';
-import { EuiText } from '@elastic/eui';
+import { EuiIconTip } from '@elastic/eui';
 import { FormattedMessage } from '@kbn/i18n/react';
 
 interface Props {
@@ -19,14 +19,16 @@ export const IntervalLabel = ({ intervalAsString }: Props) => {
   }
 
   return (
-    <EuiText color="subdued" size="s">
-      <p>
+    <EuiIconTip
+      size="m"
+      type="clock"
+      content={
         <FormattedMessage
           id="xpack.infra.homePage.toolbar.showingLastOneMinuteDataText"
           defaultMessage="Last {duration} of data for the selected time"
           values={{ duration: intervalAsString }}
         />
-      </p>
-    </EuiText>
+      }
+    />
   );
 };

x-pack/plugins/infra/public/pages/metrics/inventory_view/components/waffle/waffle_time_controls.tsx

@@ -53,7 +53,7 @@ export const WaffleTimeControls = withTheme(({ theme }: Props) => {
   );
 
   return (
-    <EuiFlexGroup alignItems="center" gutterSize="m">
+    <EuiFlexGroup gutterSize="m">
       <EuiFlexItem grow={false} data-test-subj="waffleDatePicker">
         <EuiDatePicker
           dateFormat="L LTS"

x-pack/plugins/ml/public/application/routing/routes/explorer.tsx

@@ -108,6 +108,7 @@ const ExplorerUrlStateManager: FC<ExplorerUrlStateManagerProps> = ({ jobsWithTim
         setGlobalState('time', {
           from: start,
           to: end,
+          ...(start === 'now' || end === 'now' ? { ts: Date.now() } : {}),
         });
       }
     }
@@ -127,7 +128,7 @@ const ExplorerUrlStateManager: FC<ExplorerUrlStateManagerProps> = ({ jobsWithTim
         to: globalState.time.to,
       });
     }
-  }, [lastRefresh, globalState?.time?.from, globalState?.time?.to]);
+  }, [globalState?.time?.from, globalState?.time?.to, globalState?.time?.ts]);
 
   const getJobsWithStoppedPartitions = useCallback(async (selectedJobIds: string[]) => {
     try {

x-pack/plugins/ml/public/application/routing/routes/timeseriesexplorer.tsx

@@ -118,6 +118,7 @@ export const TimeSeriesExplorerUrlStateManager: FC<TimeSeriesExplorerUrlStateMan
         setGlobalState('time', {
           from: start,
           to: end,
+          ...(start === 'now' || end === 'now' ? { ts: Date.now() } : {}),
         });
       }
     }
@@ -145,7 +146,7 @@ export const TimeSeriesExplorerUrlStateManager: FC<TimeSeriesExplorerUrlStateMan
         setBounds(timefilterBounds);
       }
     }
-  }, [lastRefresh, globalState?.time?.from, globalState?.time?.to]);
+  }, [globalState?.time?.from, globalState?.time?.to, globalState?.time?.ts]);
 
   const selectedJobIds = globalState?.ml?.jobIds;
   // Sort selectedJobIds so we can be sure comparison works when stringifying.

x-pack/plugins/observability/public/components/app/resources/index.tsx

@@ -45,7 +45,7 @@ export function Resources() {
           </h4>
         </EuiTitle>
       </EuiFlexItem>
-      <EuiListGroup flush listItems={resources} data-test-subj="list-group" />
+      <EuiListGroup flush listItems={resources} data-test-subj="list-group" size="s" />
     </EuiFlexGroup>
   );
 }

x-pack/plugins/observability/public/components/app/section/alerts/index.tsx

@@ -14,6 +14,8 @@ import {
   EuiLink,
   EuiText,
   EuiSpacer,
+  EuiTitle,
+  EuiButton,
 } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
 import moment from 'moment';
@@ -22,7 +24,6 @@ import { EuiSelect } from '@elastic/eui';
 import { uniqBy } from 'lodash';
 import { Alert } from '../../../../../../alerting/common';
 import { usePluginContext } from '../../../../hooks/use_plugin_context';
-import { SectionContainer } from '..';
 
 const ALL_TYPES = 'ALL_TYPES';
 const allTypes = {
@@ -39,102 +40,100 @@ interface Props {
 export function AlertsSection({ alerts }: Props) {
   const { config, core } = usePluginContext();
   const [filter, setFilter] = useState(ALL_TYPES);
-  const href = config.unsafe.alertingExperience.enabled
-    ? '/app/observability/alerts'
-    : '/app/management/insightsAndAlerting/triggersActions/alerts';
-
+  const manageLink = config.unsafe.alertingExperience.enabled
+    ? core.http.basePath.prepend(`/app/observability/alerts`)
+    : core.http.basePath.prepend(`/app/management/insightsAndAlerting/triggersActions/rules`);
   const filterOptions = uniqBy(alerts, (alert) => alert.consumer).map(({ consumer }) => ({
     value: consumer,
     text: consumer,
   }));
 
   return (
-    <SectionContainer
-      title={i18n.translate('xpack.observability.overview.alerts.title', {
-        defaultMessage: 'Alerts',
-      })}
-      appLink={{
-        href,
-        label: i18n.translate('xpack.observability.overview.alert.appLink', {
-          defaultMessage: 'Manage alerts',
-        }),
-      }}
-      hasError={false}
-    >
-      <EuiFlexGroup direction="column" gutterSize="none">
+    <div>
+      <EuiFlexGroup alignItems="center" justifyContent="spaceBetween" responsive={false}>
         <EuiFlexItem grow={false}>
-          <EuiFlexGroup justifyContent="flexEnd">
-            <EuiFlexItem grow={false}>
-              <EuiSelect
-                compressed
-                id="filterAlerts"
-                options={[allTypes, ...filterOptions]}
-                value={filter}
-                onChange={(e) => setFilter(e.target.value)}
-                prepend={i18n.translate('xpack.observability.overview.alert.view', {
-                  defaultMessage: 'View',
-                })}
-              />
-            </EuiFlexItem>
-          </EuiFlexGroup>
+          <EuiTitle size="xs">
+            <h4>
+              {i18n.translate('xpack.observability.overview.alerts.title', {
+                defaultMessage: 'Alerts',
+              })}
+            </h4>
+          </EuiTitle>
         </EuiFlexItem>
-        <EuiHorizontalRule margin="xs" />
-        <EuiFlexItem>
-          {alerts
-            .filter((alert) => filter === ALL_TYPES || alert.consumer === filter)
-            .map((alert, index) => {
-              const isLastElement = index === alerts.length - 1;
-              return (
-                <EuiFlexGroup direction="column" gutterSize="s" key={alert.id}>
-                  <EuiSpacer size="s" />
-                  <EuiFlexItem>
-                    <EuiLink
-                      href={core.http.basePath.prepend(
-                        `/app/management/insightsAndAlerting/triggersActions/alert/${alert.id}`
-                      )}
-                    >
-                      <EuiText size="s">{alert.name}</EuiText>
-                    </EuiLink>
-                  </EuiFlexItem>
-                  <EuiFlexItem grow={false}>
-                    <EuiFlexGroup gutterSize="xs">
-                      <EuiFlexItem grow={false}>
-                        <EuiBadge color="hollow">{alert.alertTypeId}</EuiBadge>
-                      </EuiFlexItem>
-                      {alert.tags.map((tag, idx) => {
-                        return (
-                          <EuiFlexItem key={idx} grow={false}>
-                            <EuiBadge color="default">{tag}</EuiBadge>
-                          </EuiFlexItem>
-                        );
-                      })}
-                    </EuiFlexGroup>
-                  </EuiFlexItem>
-                  <EuiFlexItem>
-                    <EuiFlexGroup gutterSize="s">
-                      <EuiFlexItem grow={false}>
-                        <EuiText color="subdued" size="xs">
-                          Updated {moment.duration(moment().diff(alert.updatedAt)).humanize()} ago
-                        </EuiText>
-                      </EuiFlexItem>
-                      {alert.muteAll && (
-                        <EuiFlexItem grow={false}>
-                          <EuiIconTip
-                            type="minusInCircle"
-                            content={i18n.translate('xpack.observability.overview.alerts.muted', {
-                              defaultMessage: 'Muted',
-                            })}
-                          />
-                        </EuiFlexItem>
-                      )}
-                    </EuiFlexGroup>
-                  </EuiFlexItem>
-                  {!isLastElement && <EuiHorizontalRule margin="xs" />}
-                </EuiFlexGroup>
-              );
+        <EuiFlexItem grow={false}>
+          <EuiButton size="s" href={manageLink}>
+            {i18n.translate('xpack.observability.overview.alert.appLink', {
+              defaultMessage: 'Manage alerts',
             })}
+          </EuiButton>
         </EuiFlexItem>
       </EuiFlexGroup>
-    </SectionContainer>
+      <>
+        <EuiFlexItem grow={false}>
+          <EuiSpacer />
+          <EuiSelect
+            compressed
+            fullWidth={true}
+            id="filterAlerts"
+            options={[allTypes, ...filterOptions]}
+            value={filter}
+            onChange={(e) => setFilter(e.target.value)}
+          />
+          <EuiSpacer />
+        </EuiFlexItem>
+        {alerts
+          .filter((alert) => filter === ALL_TYPES || alert.consumer === filter)
+          .map((alert, index) => {
+            const isLastElement = index === alerts.length - 1;
+            return (
+              <EuiFlexGroup direction="column" gutterSize="s" key={alert.id}>
+                <EuiFlexItem grow={false}>
+                  <EuiLink
+                    href={core.http.basePath.prepend(
+                      `/app/management/insightsAndAlerting/triggersActions/alert/${alert.id}`
+                    )}
+                  >
+                    <EuiText size="s">{alert.name}</EuiText>
+                  </EuiLink>
+                </EuiFlexItem>
+                <EuiFlexItem grow={false}>
+                  <EuiFlexGroup gutterSize="xs">
+                    <EuiFlexItem grow={false}>
+                      <EuiBadge color="hollow">{alert.alertTypeId}</EuiBadge>
+                    </EuiFlexItem>
+                    {alert.tags.map((tag, idx) => {
+                      return (
+                        <EuiFlexItem key={idx} grow={false}>
+                          <EuiBadge color="default">{tag}</EuiBadge>
+                        </EuiFlexItem>
+                      );
+                    })}
+                  </EuiFlexGroup>
+                </EuiFlexItem>
+                <EuiFlexItem grow={false}>
+                  <EuiFlexGroup gutterSize="s">
+                    <EuiFlexItem grow={false}>
+                      <EuiText color="subdued" size="xs">
+                        Updated {moment.duration(moment().diff(alert.updatedAt)).humanize()} ago
+                      </EuiText>
+                    </EuiFlexItem>
+                    {alert.muteAll && (
+                      <EuiFlexItem grow={false}>
+                        <EuiIconTip
+                          type="minusInCircle"
+                          content={i18n.translate('xpack.observability.overview.alerts.muted', {
+                            defaultMessage: 'Muted',
+                          })}
+                        />
+                      </EuiFlexItem>
+                    )}
+                  </EuiFlexGroup>
+                </EuiFlexItem>
+                {!isLastElement && <EuiHorizontalRule margin="xs" />}
+              </EuiFlexGroup>
+            );
+          })}
+      </>
+    </div>
   );
 }

x-pack/plugins/observability/public/components/app/section/index.tsx

@@ -37,7 +37,9 @@ export function SectionContainer({ title, appLink, children, hasError }: Props)
         }
         extraAction={
           appLink?.href && (
-            <EuiButton href={core.http.basePath.prepend(appLink.href)}>{appLink.label}</EuiButton>
+            <EuiButton size="s" href={core.http.basePath.prepend(appLink.href)}>
+              {appLink.label}
+            </EuiButton>
           )
         }
       >

x-pack/plugins/observability/public/components/app/section/metrics/host_link.tsx

@@ -4,67 +4,19 @@
  * 2.0; you may not use this file except in compliance with the Elastic License
  * 2.0.
  */
-import { EuiIcon } from '@elastic/eui';
 import React from 'react';
 import { StringOrNull } from '../../../..';
 
-import aixLogo from './logos/aix.svg';
-import androidLogo from './logos/android.svg';
-import darwinLogo from './logos/darwin.svg';
-import dragonflyLogo from './logos/dragonfly.svg';
-import freebsdLogo from './logos/freebsd.svg';
-import illumosLogo from './logos/illumos.svg';
-import linuxLogo from './logos/linux.svg';
-import solarisLogo from './logos/solaris.svg';
-import netbsdLogo from './logos/netbsd.svg';
-
 interface Props {
   name: StringOrNull;
   id: StringOrNull;
-  provider: StringOrNull;
-  platform: StringOrNull;
   timerange: { from: number; to: number };
 }
 
-export function HostLink({ name, id, provider, platform, timerange }: Props) {
-  const providerLogo =
-    provider === 'aws'
-      ? 'logoAWS'
-      : provider === 'gcp'
-      ? 'logoGCP'
-      : provider === 'azure'
-      ? 'logoAzure'
-      : 'compute';
-
-  const platformLogo =
-    platform === 'darwin'
-      ? darwinLogo
-      : platform === 'windows'
-      ? 'logoWindows'
-      : platform === 'linux'
-      ? linuxLogo
-      : platform === 'aix'
-      ? aixLogo
-      : platform === 'andriod'
-      ? androidLogo
-      : platform === 'dragonfly'
-      ? dragonflyLogo
-      : platform === 'illumos'
-      ? illumosLogo
-      : platform === 'freebsd'
-      ? freebsdLogo
-      : platform === 'solaris'
-      ? solarisLogo
-      : platform === 'netbsd'
-      ? netbsdLogo
-      : 'empty';
+export function HostLink({ name, id, timerange }: Props) {
   const link = `../../app/metrics/link-to/host-detail/${id}?from=${timerange.from}&to=${timerange.to}`;
   return (
     <>
-      {platformLogo !== null && <EuiIcon type={platformLogo} title={`${platform}`} />}
-      &nbsp;
-      {providerLogo !== null && <EuiIcon type={providerLogo} title={`${provider}`} />}
-      &nbsp;
       <a href={link}>{name}</a>
     </>
   );